Take the 2-minute tour ×
Game Development Stack Exchange is a question and answer site for professional and independent game developers. It's 100% free, no registration required.

I'm working on a game that uses Flash for the user interface. I'm running into an odd issue with the origin of a library movie clip. Here are the steps to reproduce:

  1. Create a new MovieClip and construct a single rectangle with both a fill and a stroke.
  2. Set position of rectangle to (0,0) and notice that the origin is at the center of the border stroke surrounding the rectangle.
  3. Change position of rectangle accordingly so that the origin is truly the top left (so if the stroke surrounding the rectangle was set to 10, adjust the position of the rectangle to 5,5.
  4. Enable 9 slice for movie clip so that when you scale the rectangle it doesn't scale or distort the stroke surrounding the rectangle.
  5. Drag an instance of the movie clip to the stage and use the free transform tool to scale it to the width of the stage. It should visibly be as wide as the stage.
  6. Run the flash file and verify that the width during execution is not as wide as it was in design view.

So in a nutshell it seems that when you use the free transform tool, it distorts the origin even though 9 slice is enabled and it shouldn't (I would think). I understand that Flash denotes the center of a stroke to be the starting point and not the edge, which is why I adjusted the origin accordingly while editing the movie clip.

What I really need here is pixel perfect positioning for vector based components. I should be able to drag and drop a library movieclip that provides a window with a fancy border around it and scale it to whatever size I need, and place it where I need it to be without any odd positioning problems.

Here are some screenshots of the problem:

( i.imgur.com/8WU2F.png ) is a shot of my window with 9 slice enabled. You can see that the origin is correct being the top left of the window graphic.

( i.imgur.com/ciK8l.png ) is a shot of my window after using free transform to scale it to the width of the stage. It's pretty much perfect in design view

( i.imgur.com/QFUiJ.png ) is a shot of the flash application running. Notice that the window is no longer the width of the stage? I don't get it. It makes it very difficult to position because in order to get this to look right while executing, I have to make the window wider than the stage in design mode.

Any help is greatly appreciated. I'm sure it's something silly. This is pretty much bread and butter stuff that's been around since the early days of flash.

share|improve this question

2 Answers 2

up vote 2 down vote accepted

From the top menu in Flash go:

Modify > Shape > Convert Lines to Fills

share|improve this answer
    
This is perfect. That's exactly what I needed. Thank you. –  Consty Aug 24 '10 at 15:42

Copy the movieclip to a new .fla and upload it somewhere and I will take a look at it.

I figured out your problem. Using lines in 9 slice editor will always give strange results. Remake it from shapes that are made from fills only and have no lines.

share|improve this answer
    
Ok, I figured out your problem, I updated my answer. –  AttackingHobo Aug 24 '10 at 5:04
    
Thank you very much. That did fix the problem. So very odd how the lines seem to cause all sorts of odd issues. I wonder if there is a way to fix it, but either way this will work perfectly as a work around. Thanks again. –  Consty Aug 24 '10 at 5:26
    
Good job for answering the question, but a general tip: "Copy the movieclip..." should be a comment to the question :) –  Bart van Heukelom Aug 24 '10 at 11:24
    
Check my rank, I cannot do that yet, but I had I thought correctly that I knew his problem. –  AttackingHobo Aug 24 '10 at 19:01

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.