Flash Action Script: how to have a common delay(ms) for a frame by frame animation in the timeline using AS3? - actionscript-3

I am working with Action Script 3 for the first time. I am trying to animation few frames, i want to give a delay to each frame. I am currently using the below script on each frame for 20-frames in total.
stop();
setTimeout(function() { nextFrame(); }, 100);
here if i want to increase/decrease the delay i have to change the value in every single frame. I am pretty sure i am not doing the smart way. please help me out. Thanks in Advance Experts.

While the easiest solution would be to just adjust your frame rate to 10fps (the equivalent of 100ms between slides), there are reasons that may not be appropriate (animations inside the timeline etc).
Perhaps a Timer would be better.
Something like this:
import flash.utils.Timer;
import flash.events.TimerEvent;
//create a timer
var timer:Timer = new Timer(100); //fire every 100ms
//listen for it's tick, and run the timerTick function every interval
timer.addEventListener(TimerEvent.TIMER, timerTick);
//start the timer
timer.start();
function timerTick(e:Event):void {
//if the next frame is the last frame, stop the timer
if(this.currentFrame == this.totalFrames - 1){
timer.stop();
}
//go to the next frame
nextFrame();
}
On your individual frames, you can tweak the timer's delay (how long before ticking) or stop the timer all together. This can be helpful if you wanted to say pause for user interaction at some point, or make the delay longer/shorter for certain frames.
timer.delay = 200;
or
timer.stop();

Related

ActionScript 3 - Timer/Countdown

I'm trying to make timer which goes up 1 every second and this is displayed in a dynamic text box called timer_txt.
When the timer reaches 60 secounds I want to display a screen, to do this I will use gameOver.visible = true;. But how would I get the timer to completely stop?
Also I want the car object to stop the timer completely when it hits the finish movie clip and to display the finshed time in a dynamic text box called finishTime. This is all on the same frame.
Would anyone please help me ?
This is the code I currently have to calculated the time but I'm currently having no luck.
var currentTime:int = getTimer();
//Setting the timer to 0.
var Secounds = 0;
function timer():void{
//Adding 1 to secounds var.
Secounds +=1;
}
setInterval(timer,1000);
trace(Secounds);
Use Timer instead of setInterval.
var timer:Timer = new Timer(1000, 60);
1000 — is a delay in ms.
60 — is a repeat count.
Timer will fire every second for one minute.
Next, add an event listener.
timer.addEventListener(TimerEvent.TIMER, tick);
timer.addEventListener(TimerEvent.TIMER_COMPLETE, complete);
and start the timer:
timer.start();
The tick method will fired (called) every second.
After 1 minute the complete method will fired (called).
To stop the timer call timer.stop();

AS3 - Make the screen flash for half a second

What I want to do is:
After colliding with an [object], I want the screen to flash for about half of a second. I have tried for loops and while loops but they seem to not work. I have no idea how I should program this.
I've been trying to figure out how to do this since I'v been making the game so it would be helpful if someone could help me.
Thank you for reading.
You need to use something that involves time. loops all run in a thread which doesn't pause for time - which is why they don't work.
Here is how you could do this with an AS3 Timer (let's say this code runs right after you've determined there's been a collision)
function flashScreen():void {
var timer:Timer = new Timer(50, 10); //run the timer every 50 milliseconds, 10 times (eg the whole timer will run for half a second giving you a tick 10 times)
var flash:Shape = new Shape(); //a white rectangle to cover the whole screen.
flash.graphics.beginFill(0xFFFFFF);
flash.graphics.drawRect(0,0,stage.stageWidth,stage.stageHeight);
flash.visible = false;
stage.addChild(flash);
timer.addEventListener(TimerEvent.TIMER, function(e:TimerEvent):void {
//we've told AS3 to run this every 50 milliseconds
flash.visible = !flash.visible; //toggle visibility
//if(Timer(e.currentTarget).currentCount % 2 == 0){ } //or you could use this as a fancy way to do something every other tick
});
timer.addEventListener(TimerEvent.TIMER_COMPLETE, function(e:TimerEvent):void {
//the timer has run 10 times, let's stop this flashing madness.
stage.removeChild(flash);
});
timer.start();
}
Other ways you can do this are with setInterval, setTimeout, a Tweening library,and an ENTER_FRAME event handler.

Actionscript 3.0 repeating movie three times then running close frames

I have an animation that I want to loop three times and then finish the final frames and then stop. I have tried this code to start with:
var stopNum = 0;
function looper(loopLimit) {
if (stopNum>=loopLimit) {
stop();
} else {
gotoAndPlay(2);
}
this.stopNum++;
}
And this code to stop:
if (!loopCount) {
var loopCount:Number = 0;
}
loopCount++;
if (loopCount >= 3) {
this.stop();
}
I have remaining frames to play from this point and then the entire animation stops. The problem is the frames loop three times but include all the frames including the closing frames.
Try using some events available from Flash 10 like so:
Event.FRAME_CONSTRUCTED
and
Event.EXIT_FRAME
Throwing some idea though, e.g. If your animation ends, then use Event.EXIT_FRAME and keep counter which will tell you that how many times animation is played.
Off the top of my head, I'd use an event listener to check for when the playhead advances for the moiveclip (as mentioned by Rajneesh). Within the event listener, I'd check for what frame it is at, and if it is at the end of my 'end loop frame' and then I'd check if I need to loop it. If so, then I increment a counter to keep track of how many times I've looped, and tell the movieclip to go to the start frame and play again.
Once it's looped enough times, I'd just let it run until the last frame then, on which I'd stop the animation.
I'll take a guess and assume your movieclip has 100 frames, and you only want frame 1 to 90 to loop 2 times, then have it play 1 more time, but from frame 1 to 100. Plays a total of three times from 1 to 90, then once 91 to 100, before stopping.
import flash.display.MovieClip;
import flash.events.Event;
var clip:MovieClip = this.aCircle;
var timesPlayed:int = 0;
var timesToLoop:int = 3;
var frameToStartLoop:int = 1;
var frameToStopLoop:int = 90;
function enterFrameListener(inputEvent:Event):void {
if(clip.currentFrame == frameToStopLoop){
timesPlayed++;
if(timesPlayed < timesToLoop){
clip.gotoAndPlay(frameToStartLoop);
}
// if the currentFrame made it past the above condition, then
// it means there is no more looping needed so just play till the end and stop.
} else if(clip.currentFrame == clip.totalFrames){
clip.stop();
// can remove this listener now, as it is no longer needed
clip.removeEventListener(Event.ENTER_FRAME, enterFrameListener, false);
}
}
// use an event listener to listen for the ENTER_FRAME event, which is triggered everytime the movieclip advances a frame
// (as a side note, you'll also find that this event is triggerd even if there is only 1 frame, or even if the playhead is not actually moving, check the doc for details)
clip.addEventListener(Event.ENTER_FRAME, enterFrameListener, false, 0, true);

Action Script 2 Suggestion

I am doing a project which is about interacting, mouse on screen, Hence, I want to do it by using Adobe Flash Pro and Action Script2.
here is the Task:
- a simple animations (for example: that full of spiders walking/jumping from up to down on the screen)
- once the mouse moves, the animation will Reverse (all spiders animation will reverse back and hide back to the top of screen from the place that the came).
- if the mouse doesn't move after 60 Seconds the animation will happen again till the mouse move again on the screen (Those spiders animation will happen again).
i have created a Animation Spider "Movie clip" (spider animation going down)
1- what script i should write to make animation reverse?
2- how can i tell Adobe my mouse is moved or it's not moving, so the spiders animation will happen or reverse?
by the way, I am a very beginner in action script 2.0
i appreciate any suggestion and help *is fine for me to do it in action script 3 too
Thanks.
Oh my. AS2 :)
OK first off I think it would be easier if you would create 2 different animations. One for the Spider to walk down. The other one to walk up. It is possible to reverse a MovieClip but I think if you`re a beginner, stick with the basics.
You need 3 thinks here.
1) Spider Clips. Going down and up.
2) An interval (timer in AS3)
var interval:Number = setInterval(spidersComeOut, 60 * 1000);
3) Mouse move listener
root.onMouseMove = function()
{
//swap your spider clips
//move the spider up again
//reset the interval with clearInterval(interval) and restart it again.
}
This is a very basic handler for mouse move.
Hope this will help you a little bit. This is not a complete solution. It will not work out of the box.
One thing at the end. If you are new to AS2 I would recomend to give as3 a shot. It is more difficult to start with, but there are more people out there willing to help with an AS3 problem then with as2.
Since you said you were ready to use AS3 here is solution.
I assume you have a separate movie clip containing your spiders animation which you place on the main timeline/stage.
1.place your MovieClip on the stage and give it the instance name of 'spiders'.
2.inside this MovieClip, on the first frame put this code (it will handle revesing the animation)
import flash.events.Event;
stop();
var _dir:int = 1;
addEventListener(Event.ENTER_FRAME, onEF);
function onEF(e:Event):void
{
getNextAnimationFrame();
}
function getNextAnimationFrame():void
{
var frameNum:int = currentFrame + _dir;
if (frameNum < 1 || frameNum > totalFrames)
{
removeEventListener(Event.ENTER_FRAME, onEF);
}
frameNum = Math.max(1, Math.min(totalFrames,frameNum));
gotoAndStop(frameNum);
}
function changeDirection($dir:int):void
{
_dir = $dir;
removeEventListener(Event.ENTER_FRAME, onEF);
addEventListener(Event.ENTER_FRAME, onEF);
}
3.on the main timeline (in the first frame) put this code:
import flash.utils.Timer;
import flash.events.TimerEvent;
import flash.events.MouseEvent;
var timer:Timer = new Timer(60 * 1000, 1);
timer.start();
timer.addEventListener(TimerEvent.TIMER_COMPLETE, onTime);
stage.addEventListener(MouseEvent.MOUSE_MOVE, onMove);
function onTime(e:TimerEvent):void
{
trace("it's time");
spiders.changeDirection(1);
}
function onMove(e:MouseEvent):void
{
timer.reset();
timer.start();
spiders.changeDirection(-1);
}
It would be possible to handle mouse, timer and animation in one piece of code, however the way it's build now is kind of OOP, if at some point you decided to build it properly it would be extremely easy to 'rewrite' this code as separate classes.

Having difficulty in understanding ActionScript 3 Timer class

I'm trying to make a dice game in Flash/ActioScript 3. I did all the essentials and it works smoothly. Now I want to improve the user experience. For instance, when it's computer's turn (to roll and do things according to die value) I want to animate the die. The die has 6 keyframes. So, for, say, 2 seconds the die will loop those 6 frames then it will stop on a value (depending on random generator). Somehow I can't do it as I want. How can I write a function(s) so that when I say,
animateDice()
it will do nothing but just animate the dice for a specified interval?
Update:
var timer:Timer = new Timer(10, 50);
myButton.addEventListener(MouseEvent.CLICK, onClick);
timer.addEventListener(TimerEvent.TIMER, animateDice);
function onClick(event: Event):void {
timer.start();
}
function animateDice(event: Event):void {
dice.play();
}
For instance, I don't understand why the above code doesn't work properly. It does work properly on first click, but not there after.
Update 2: I guess I'm still having problems. How do I suspend the running code until the timer stops? (Yes there is a work around---putting timer handlers inside other timers, etc. Is there an easy way?
Maybe, this will help:
First we see the die rolling (and a message box informs the user that the game will decide whom starts). Then it's either Human's or Computer's turn. When it's computer's turn, first we see the rolling die again for, say, 1 second. Then it stops and and we see the outcome. I'm a beginner and I nay be missing something, but from what I see it seems that all these simple steps (just showing the die rolling for some time) means lots and lots of lines.
If I use a simple timer for die animation, the script continues and the whole show goes away.
The timer object has three properties:
delay, or how often the event should fire
repeatCount, or how many times the event should fire
currentCount, or how many times the timer's event has fired thus far
You are creating the timer with new Timer(10, 50), which sets delay to 10 and repeatCount to 50. This means that, once you call timer.start(), timer will fire TimerEvent.TIMER every 10 milliseconds. Each time it is fired, it adds 1 to currentCount. When currentCount is greater than or equal to repeatCount (50), it stops looping the timer.
Once your timer has stopped, if you call timer.start() again, it will only fire the event once, because currentCount has not been reset to zero, and is still >= repeatCount.
If you call timer.reset() before calling timer.start(), it will set this value to zero and things should behave as expected.
var timer:Timer = new Timer(2000, 1);
myButton.addEventListener(MouseEvent.CLICK, onClick);
timer.addEventListener(TimerEvent.TIMER_COMPLETE, onTimerComplete);
function onClick(event: Event):void {
timer.reset();
timer.start();
dice.play();
}
function onTimerComplete(event:TimerEvent):void {
var roll:int = int(Math.floor(Math.rand()*6))+1;
dice.gotoAndStop(roll);
}
The timer is set to run only once, for 2000 milliseconds (which are 2 seconds). When Click occurs, the timer is reset (so that if it's not the first time it was clicked, it will run as if it was the first time) and started, and the animation starts a well. After 2 seconds, TIMER_COMPLETE will be fired by the timer, and we catch it and determine a final number for the die, then gotoAndStop to that frame.
I didn't try to compile the code, but the gist of it should work for you.
P.S, dice is the plural of 'die' :) you're skipping a great opportunity for the type of variable names we all want to use but can't!
You could try something a little more like this:
var t:Timer = new Timer(10, 50);
t.addEventListener(TimerEvent.TIMER, timerHandler);
t.addEventListener(TimerEvent.TIMER_COMPLETE, timerCompleteHandler);
t.start();
function timerHandler(e:TimerEvent):void {
gotoRandomFrame();
}
private function timerCompleteHandler(e:TimerEvent):void {
var finalNum:int = gotoRandomFrame();
// Using finalNum
}
private function gotoRandomFrame():int {
var num:int = Math.floor(Math.random() * 6) +1;
dice.gotoAndStop(num);
return num;
}
So use gotoAndStop to set your frame rather than using play