ProblemYou have a graphic in a sprite and you want to animate it, giving it some motion. SolutionDecide on a velocity for the x or y-axis (or both), and add that velocity to the object's position on each frame or animation interval. DiscussionVelocity is often incorrectly defined as speed. However, velocity also includes a direction factor. For example, "10 miles per hour" is speed, but "10 miles per hour due north" is a velocity. If you are dealing with velocity on the x or y-axis, the direction is inherent. A positive x velocity is to the right; negative to the left. Likewise, a positive y velocity is down, and negative is up. The first example defines the x velocity, _vx, and sets it to 3. Since this example uses the enterFrame event for animation, the object will move three pixels to the right on each frame: package { import flash.display.Sprite; import flash.events.Event; public class Velocity extends Sprite { private var _sprite:Sprite; private var _vx:Number = 3; public function Velocity( ) { _sprite = new Sprite( ); _sprite.graphics.beginFill(0x0000ff, 100); _sprite.graphics.drawCircle(0, 0, 25); _sprite.graphics.endFill( ); _sprite.x = 50; _sprite.y = 100; addChild(_sprite); addEventListener(Event.ENTER_FRAME, onEnterFrame); } public function onEnterFrame(event:Event):void { _sprite.x += _vx; } } } If you set _vx to -3 instead, you'll see that it goes in the opposite direction. You can also add in some y velocity by creating a _vy variable, giving it a value, and changing the onEnterFrame method, as follows: public function onEnterFrame(event:Event):void { _sprite.x += _vx; _sprite.y += _vy; } If you aren't a fan of frame-based animation (as in the previous example), you can use a timer function instead, as shown here in bold: package { import flash.display.Sprite; import flash.events.Event; import flash.events.TimerEvent; import flash.utils.Timer; public class Velocity extends Sprite { private var _sprite:Sprite; private var _vx:Number = 3; private var _vy:Number = 2; private var _timer:Timer; public function Velocity( ) { _sprite = new Sprite( ); _sprite.graphics.beginFill(0x0000ff, 100); _sprite.graphics.drawCircle(0, 0, 25); _sprite.graphics.endFill( ); _sprite.x = 50; _sprite.y = 100; addChild(_sprite); _timer = new Timer(30); _timer.addEventListener("timer", onTimer); _timer.start( ); } public function onTimer(event:TimerEvent):void { _sprite.x += _vx; _sprite.y += _vy; } } } See AlsoRecipe 11.2 for information on how to move an object at a given speed and angle. |