center movie clips dynamically, as3.0

[markerline]

Hi.  I have seen this discussed both on Adobe Forums and other sites but I can't seem to make sense of the code supplied by what I have seen thus far.

I am trying to center display objects that are added to the stage at runtime dynamically through a basic drawing application.

the code is something like this:

1. add an event listener for the drawing event.

2. add the path you want to draw to a container movie clip on the stage.

3. add an enter-frame event listener to change the scale of the path randomly .... and this is the moment i want to change the default top,left registration point to the center,center of the path.  each path has its own registration point as i can tell thus far but at this point the scale is happening from the top,left of the container rather than about the path's own self.  and if it were to happen about the path i would have to get the bounds of the path and do some averaging to center the registration point.

unfortunately i don't know what the code looks like to achieve what i'm trying to get.

any help is appreciated.  thanks in advance.

[sinious]

You're letting a user draw a path and then you're adding that to a container clip? If that's all you're doing (and each path has a container) then the x/y of the shape drawn should just be negated half the height and width in the container to be center registration.

Psuedo code e.g.

myContainer.addChild(myShapeDrawn);

myShapeDrawn.x -= myShapeDrawn.width / 2;

myShapeDrawn.y -= myShapeDrawn.height / 2;

Whatever you're bundling in the drawn object just needs to move itself half the width and height of itself inside the container to center itself in the container. Then you have center registration.

[markerline]

That's close sinious.  I guess some of the explanation got lost in its length.  Each shape is a new independent Display Object but they all are being drawn on the same container Movie Clip.  How would the code look in that case?

Thanks for the reply by the way.

[markerline]

Also, I realize that if I move my path object I won't be directly drawing on mouseX, mouseY.  I would be drawing on an offset which might pose usability issues.

[sinious]

Are the contents separated into separate objects or are they drawn into a Bitmap/Data? You'd run the same psuedo calculation every single time you added to the container object if so.

Otherwise you're going to need to calculate an area based on all the separate objects in the container (which is actually just the width/height of the container), while moving each item as needed. There's so many ways to skin that cat it's hard to tell you exactly what to do without knowing more details. 

Yes, movement will require you remembering the localX/localY the user clicked on to move the object but if you save that and add (or subtract) it to the movement calculation it's not that hard at all.

[markerline]

Well if using the graphics.lineTo method is Bitmap data then that is what I'm using.  But each call to the shape that I'm drawing is a new Shape(); .  The second paragraph you wrote seems a bit daunting when viewing it in the abstract sense.  Your first reply was a bit more concrete but I guess the first response didn't account for everything being in one container.  Should I create a container2 Movie Clip and create that as a new box on a per-shape basis so that I have multiple container2 mc's in the following path:

container.container2.shape where i would be an index (such that i++) though the code wouldn't be written exactly that way. ?

(To store localX,Y positions in an array or vector shouldn't be too hard but I would need to try it several times before I get it right).

[sinious]

The graphics class draws a Shape. If you add that shape to a container the math is the same to center it but I'm assuming you don't really want to center every shape added to the container. There must be some relative positiion to the shape drawn in each container that you want to maintain to other shapes in the container, is that correct?

To be explicit, if I draw a vertical line and you center it in your container, then draw a second vertical line parallel to it, I won't expect you to center that as well because it will be moved over the previous vertical line I had drawn.

In that situation you need your centering logic to consider multiple objects which gets more complex but I need to verify that.

[markerline]

Yes, I want each Shape that is in its own container (potentially, or not) to be drawn on a master container so as not to interfere with mouse interactions on other parts of the stage (the UI).

And each Shape will have its own center-point about which I can scaleX,scaleY, rotate, etc.  Each Shape will retain its original position as was drawn on the master container with container.mouseX, container.mouseY .

[sinious]

You're in a container of containers situation. If you want that level of granular control each drawn shape should have a container. Run the centering code in each container and keep track of the original location of the shape. Use the original shapes values in the master container along with the negative sub container values to keep the original position in the master container.

Adding each separate shape in a container is really low overhead. It wouldn't even stress mobile until you get to hundreds of objects.

[markerline]

thanks.  i will try your suggestion.  as an aside i have noticed performance issues on android tablets in dealing with arrays.  i dont even think vectors would help that much in place of arrays.  this is why i am opting to stick to desktop development where the processors can handle flash with no sweat.

[sinious]

Older Android tablets and the ridiculous $89 tablet sure do. The modern but cheap Nexus vs original double price ASUS Transformer really shows this. Do everything possible on mobile to offset graphics to Stage3D.

[markerline]

Hi sinious.  I've revisited this topic with my files and I seem to be getting nowhere.  I've tried lots of different approaches, from the basic concept you posted above to some more complex situations with matrix and Point and setting those.

I think I need a better example written in code.  I can attach my code if you'd like, but I have lots of items that are drawn on stage in addition to the items that are drawn at runtime, so I am not sure you'll be able to troubleshoot what I've got unless I strip out the stage stuff.

Thanks in advance.