stats

When I try this with an animated sprite, the jerky motion seems to get lost in the noise of the animation. The interactive test does not seem to exhibit this behavior, but I am not able to move our greensocked hero at exactly 26.56 degrees. So the problem is either with the specific angle I am trying to use, or the use of bitmap images.

Attached is a minimal example using just TweenLite. You can see the image moves a bit jerkily. Am I being too picky? package { import com.greensock.TweenLite; import flash.display.Bitmap; import flash.display.Sprite; import flash.events.MouseEvent; public class TweenerTest extends Sprite { [Embed(source="../assets/char.png")] private var PlayerClass:Class; private var player:Bitmap = new PlayerClass() as Bitmap; private var angle:Number = 26.56 * Math.PI / 180; private var end_x:Number; private var end_y:Number; public function TweenerTest() { player.cacheAsBitmap = false; player.smoothing = true; end_x = Math.cos(angle) * 100; end_y = Math.sin(angle) * 100; this.addChild(player); moveLoop(false); } private function moveLoop(reverse:Boolean = false):void { if(!reverse){ TweenLite.to(player,10,{x:end_x,y:end_y,onComplete:moveLoop,onCompleteParams:[true]}); } else { TweenLite.to(player,10,{x:0,y:0,onComplete:moveLoop,onCompleteParams:[false]}); } } } }

I am going to make a minimal example without using as3isolib to isolate the problem a little further. I will be back with a post when I get that done.

change import mx.transitions.easing.*; to mx.transitions.easing.Regular; and include only the actual classes from mx.transitions.easing.* that you are using.

Post your code so I can look at what you are doing. From here I am not really sure what you are doing and why it is failing.

Change your imports, not your tweens.

If you can not change how the tweens work you might want to go through and include only the tweens you want from the mx.transitions.Tween classes. For example import everything but mx.transitions.Tween.Back that way you can use the Back tween as defined in com.greensock.easing.Back;

onComplete is not like setting an event handler. By default it does not send any parameters. You would need to use onCompleteParams to set parameters. var myVar:int = 10; Tween.to(myObject,{x:10,y:10,onComplete:myFunct,onCompleteParams:[myVar]}); function myFunct(i:int):void { //do something }

I don't see you defining your buttons anywhere. I haven't coded in Flash Professional in a long while, so the following might be incorrect. That being said, I believed you needed to set a variable in the actionscript window so that you would have a pointed to the object that was added to the screen. For example: stop(); import com.greensock.*; import com.greensock.easing.*; var mc_logo:Button; var mc_label:Label; ... TweenLite.to(mc_logo, 1, {x:193.80, y:76.1, ease:Back.easeOut}); TweenLite.to(mc_label, 1, {x:666.5, y:163.05, ease:Back.easeOut}); ...

I just ran the movie through my debugger and checked on the object at the time that TweenLite.to is called. The image has no filters set, it is an empty array, cacheAsBitmap = false, and smoothing = true. I have attached a zipped swf. You will see this behavior when you click on one of the grid boxes 1 or 2 squares adjacent to the character.

At this point I am tied to an Isometric view, but anything else can change. Libraries, coding practices, etc. I am just looking for good looking transitions on an isometric plane.

Hi! I am using TweenLite with as3isolib to move a sprite on a tiles grid. The jerky tweening really shows up when performing a slow tween. 100px over 5 seconds. It appears that my sprite is moving 1 px up, then 1 px right, then 1 px up, then one px right. Which looks pretty jerky. I have tried turning smoothing on for my assets, but the same behavior. I have also tried using the base IsoBox asset instead of a sprite and still the same type of jerky motion. I have an advanced example where I move the sprite through a make using A*, and it gives one a bit of a headache to look at it. Is there anything that can be done to make the animation appear smooth? MovementMinimal.as package { import as3isolib.display.IsoSprite; import as3isolib.display.IsoView; import as3isolib.display.primitive.IsoBox; import as3isolib.display.scene.IsoScene; import com.greensock.TweenLite; import eDpLib.events.ProxyEvent; import flash.display.Bitmap; import flash.display.Sprite; import flash.events.Event; import flash.events.MouseEvent; public class MovementMinimal extends Sprite { private var tween:TweenLite; private var scene:IsoScene; private var view:IsoView; private var player:OffsetIsoSprite; [Embed(source="../assets/char.png")] private var playerClass:Class; public function MovementMinimal(){ scene = new IsoScene(); view = new IsoView(); view.clipContent = false; view.showBorder = false; view.addScene(scene); makeGrid(); var imgObj:Bitmap = new playerClass() as Bitmap; imgObj.smoothing = true; player = new OffsetIsoSprite(); player.offsetX = -14; player.offsetY = -59; player.setSize(20,16,58); player.sprites = [imgObj]; scene.addChild(player); this.addChild(view); scene.render(); } public function makeGrid():void{ var b:IsoBox; for(var i:int = 0; i < 10; i++){ for(var j:int = 0; j < 10; j++){ b = new IsoBox(); b.addEventListener(MouseEvent.CLICK, gridClickHandler); b.setSize(20,20,0); b.moveTo(i * 20, j * 20, 0); scene.addChild(; } } } public function gridClickHandler(event:ProxyEvent):void { var b:IsoBox = event.target as IsoBox; if(tween){ tween.pause(); } tween = TweenLite.to(player,5,{x:b.x,y:b.y,onComplete:tweenCompleteHandler}); if(!hasEventListener(Event.ENTER_FRAME)){ this.addEventListener(Event.ENTER_FRAME, enterFrameHandler); } } private function tweenCompleteHandler():void{ this.removeEventListener(Event.ENTER_FRAME, enterFrameHandler); } private function enterFrameHandler(event:Event):void { scene.render(); } } } OffsetIsoSprite.as package { import as3isolib.display.IsoSprite; import flash.display.Bitmap; import flash.display.BitmapData; import flash.display.DisplayObject; import mx.core.IFactory; public class OffsetIsoSprite extends IsoSprite { public var offsetX:Number = 0; public var offsetY:Number = 0; override protected function renderSprites():void { //remove all previous skins actualSpriteObjects = []; while ( mainContainer.numChildren > 0 ) mainContainer.removeChildAt( 0 ); var spriteObj:Object; for each ( spriteObj in spritesArray ) { if ( spriteObj is BitmapData ) { var b:Bitmap = new Bitmap( BitmapData( spriteObj )); b.cacheAsBitmap = true; b.x = offsetX; b.y = offsetY; mainContainer.addChild( b ); actualSpriteObjects.push( b ); } else if ( spriteObj is DisplayObject ) { var displayInstance:DisplayObject = DisplayObject(spriteObj); displayInstance.x = offsetX; displayInstance.y = offsetY; mainContainer.addChild( displayInstance ); actualSpriteObjects.push( spriteObj ); } else if ( spriteObj is Class ) { var spriteInstance:DisplayObject = DisplayObject( new spriteObj()); spriteInstance.x = offsetX; spriteInstance.y = offsetY; mainContainer.addChild( spriteInstance ); actualSpriteObjects.push( spriteInstance ); } else if ( spriteObj is IFactory ) { spriteInstance = DisplayObject( IFactory( spriteObj ).newInstance()); spriteInstance.x = offsetX; spriteInstance.y = offsetY; mainContainer.addChild( spriteInstance ); actualSpriteObjects.push( spriteInstance ); } else throw new Error( "skin asset is not of the following types: BitmapData, DisplayObject, ISpriteAsset, IFactory or Class cast as DisplayOject." ); } } } }