Starling Wiki

If you use Flash CS to design your sprites , you may oftentimes draw your graphics with the registration point on the “center” of your frame (i.e not the topleft). So how do you locate the pivot point which corrosponds to the cross in the center of your movieClip? Just follow these steps:

1. Create a “Guide” layer above your graphics on the timeline.
2. Copy all the graphics (on all the layers) onto the guide layer.
3. Select all the graphics on the guide layer, right click (or CMD click for Mac) and select “Convert to Bitmap”.
4. Now all your graphics are converted into a bitmap.Select the bitmap and open the properties panel. Take down the x and y properties of the bitmap.
5. The location of your pivot point is the negative of the x and y coordinates of your bitmap. (i.e if the X is -50.5 and Y is -100.2, then the pivotX is 50.5 and pivotY is 100.2 respectively)
6. Delete the bitmap and the guide layer once you're done.

For movieClips with multiple frames ,follow these additional steps:

1. Find the frame whose graphics have the leftmost edge. Convert to bitmap and note the X value.
2. Find the frame whose graphics which have topmost edge. Convert to a bitmap and note the Y value.
3. Your pivotX and pivotY are -X and -Y respectively.

*Note, this only works if you do not scale or use frames when you create your textureAtlas.

You can retrieve the topleft corner of your movieClip by calling the getBounds() method. The getbounds returns a rectangle with the top, left , width and height of all the contents in your frame. By looping thru all the frames in your movieClip, and finding the leftmost and topmost edge of your movieClip, you can find the pivot point of your starling movieclip once you have converted your frames into textures.

Add this code to your stage:

var minLeft:Number=1000000;
var minTop:Number= 1000000;
//an arbitrarily high value so that the bounds of your frames are always less that this
for(var i:uint=0;i< myMovieClip.totalFrames; i++){
myMovieClip.gotoAndStop(i);
// make sure to comment out the gotoAndStops and gotoAndPlays on your movieClip timelines first!
var bounds:Rectangle = myMovieClip.getBounds(myMovieClip);
var left:Number = bounds.left;
var top:Number= bounds.top;
if(left < minLeft){
minLeft = left;
}
if(top< minTop){
minTop = top;
}
}
var pivotX:Number = -minLeft;
var pivotY:Number = -minTop;
trace("the pivot point of this MovieClip is ("+pivotX+","+pivotY+")!")

This only works if your movieClip doesnt dynamically create graphics using frame scripts (or event listeners), or use any filters.

When you invoke getBounds immediately after gotoAndPlay, the getBounds operation happens before any other scripts get executed. But if your clips contain actionscript, all is not lost yet. Take a look at http://www.senocular.com/flash/tutorials/asyncoperations/ to see how you can construct an event listener function get the bounds of each frame asynchronously, using the Event.FRAME_CONSTRUCTED parameter.

Basically, getBounds does not account for filters. That means if you blur your images , getBounds does not record the edges of your blur, only the edges of your original image. Dealing with filters is out of scope of this tutorial, but you may refer to http://www.refactored.fr/?p=163 to see how you can get the bounds of filtered movieClips.