OrientToBezier for Starling MovieClip

[Ghost_V]

HI! I have a problem with using of orientToBezier parameter for starling movieClip.

 

 

var anim:starling.display.MovieClip = new  starling.display.MovieClip(StarlingManager.getInstance().getTextures("anim_0","anim00"));

 

//anim_0 is png of starling spriteSheet

 

TweenMax.to(anim, 10, {bezierThrough:[{x:1000,y:800}, {x:800,y:650}, {x:600,y:555}, {x:400,y:250},], orientToBezier:true, ease:Linear.easeNone, onComplete:onTweenComplete});

 

// if orientToBezier:false - anim is moving correctly, but when orientToBezier:true - it is rotating chaotically and all the time it is moving through the curve.

 

What should I do to move movieClip with rotate exact according to the bezier curve?

 

Thanks!

[Carl]

hmm, orientToBezier is an older property. I would suggest trying autoRotate as described in the docs:

 

autoRotate : Boolean or Array (default:false) - to automatically rotate the target according to its position on the Bezier path, you can use the autoRotate feature (previously called orientToBezier). If your Bezier is affecting the "x" and "y" properties of your target and you don't need to offset the rotation by a certain amount more than normal, then you can simply set autoRotate:true. Or if you want to offset the rotation by a certain amount (in degrees), you can define a number likeautoRotate:90 (adding 90 degrees in this example). Or for more advanced controls, you can define autoRotate as an array. In order to adjust a rotation property accurately, the plugin needs 5 pieces of information:

1. Position property 1 (typically "x")
2. Position property 2 (typically "y")
3. Rotational property (typically "rotation")
4. Number of degrees (or radians) to add to the new rotation (optional - makes it easy to orient your target properly)
5. Boolean value indicating whether or not the rotational property should be defined in radians rather than degrees (default is false which results in degrees)

The autoRotate property should be an Array containing these values, like ["x","y","rotation",90,false].

 

docs: http://api.greensock.com/as/com/greensock/plugins/BezierPlugin.html

 

I don't use Starling but I believe it uses radians instead of degrees, so try this:

TweenMax.to(anim, 10, {bezier:{values:[{x:1000,y:800}, {x:800,y:650}, {x:600,y:555}, {x:400,y:250}], autoRotate:["x","y","rotation",0,true]}, ease:Linear.easeNone});

Please make sure you are using the latest version of GSAP: 12.1.4

Just click on the "getGSAP" button on the top left of this page to grab it.

[Ghost_V]

Thanks! All is working correctly now. For starling mc I have used radians in autoRotate property.