Sidebar Sidebar
Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

flash question

N

njmitchel0

macrumors member
Original poster
May 21, 2008
84
2
new question:
very new to flash and im trying to make this intro and ive searched a bunch of tutorials, but i cant seem to find what im looking for..maybe im not searching the correct term, this is what im trying to do...
i have a map and i want the dashes to appear one after another in sequential order so it shows movement. it seems like it would be extremely simple, but i cant seem to figure it out. please help and thanks

------------------------------------------------

Im trying to create a flash banner for a site. I am not at all familiar with flash so I really dont know what kind of tutorial I should be looking for. Im trying to make a banner with images rising from the bottom and what not...nothing too over the top. Can tell me what this is called so I can find a suitable tutorial....thanks
 
FlashEFF is a nice plugin for Flash.
It's very simple to create impressive animation effects with little or no coding.
I believe it is AS3 only (Flash CS3 or later)
 
njmitchel0 said:
new question:


Im trying to create a flash banner for a site. I am not at all familiar with flash so I really dont know what kind of tutorial I should be looking for. Im trying to make a banner with images rising from the bottom and what not...nothing too over the top. Can tell me what this is called so I can find a suitable tutorial....thanks
Click to expand...

Did you look through any tutorials on Tweening?
It sounds like thats what you want, but could you describe in a little more detail as what exactly it is you're trying to do? Maybe a picture or example?

..images rising from the bottom and what not...nothing too over the top
Click to expand...

is still kinda vague.
 
i want to make it to that each individual dash is appearing one after another...to show movement
2vsj6z9.jpg
 
njmitchel0 said:
i want to make it to that each individual dash is appearing one after another...to show movement
2vsj6z9.jpg
Click to expand...

Ah! I think I see what your getting at.

Well, this is probably not the best way, but just off the top of my head, its looking like you'll have to do things frame by frame.

Basically the idea is

Frame 1: draw first dash
Frame 2: draw second dash, maybe scoot both dashes a bit in the direction you're trying to show movement....

and so on and so on. You don't have to go by each individual frame necessarily, the time format on the timeline is in milliseconds, which may make things a bit quick going from
frame 1->2->3, so its really up to you when you want dashes to appear.

I'd google "frame-by-frame animation"

Keep in mind this technique isn't exclusive to Flash, so you'll likely get some seemingly irrelevant information but the idea behind it is the same across all media.
 
Frame by frame sequences on the timeline are fairly simple to construct:
draw the animation one frame at a time.
Unfortunately, this usually results in some difficulty with regard to the duration of the animation, and drawing it frame by frame can be very tedious.

One methiod is to draw the animation in Illustrator, with the object for each frame on its own layer.
ie: if there are 26 dashes, you would have 26 layers.
Import the AI file into Flash as keyframes (frames 1-26), and you have your sequence.

Another method is to draw the animation as a flat AI file, or png file with transparency and no background.
Import the file into a movieclip in Flash and use the eraser tool to create the animation one frame at a time, working backwards from the last frame.
ie: place the vector file on frame60, erase the last dash, option-drag the keyframe backwards to frame59, and repeat this process until the entire drawing is erased.
Remove the leftover blank keyframes.

Another method is to animate a mask to reveal the dashes over time.

Another method is to use actionscript to push the each dash into an array, then use a Tweening class to animate the array.
(the layered AI file imported into a MovieClip as keyframes would be used in this case)
This would give you the most control over the appearance and duration of the animation.
http://blog.greensock.com/v11/
Here's an example:
PHP: 
// import the classes for this project
// greensock tweening platform is commonly used fro actionscript animation
// you can download it for free.
import flash.display.MovieClip;
import flash.display.Sprite;
import com.greensock.*;

// create a container for the animation
var mcContainer:Sprite = new Sprite();

// "MC" is the class name for a MovieClip in the library that contains the imported frame sequence
// create a temporary instance of the class in order to find the total number of frames.
var temp:MC = new MC();

// each frame will be pushed into the dashArray
var dashArray:Array = new Array();

// call a function that populates the array, then tweens the dashes
// pass in the totalFrames property of MC
buildArray(temp.totalFrames);

// first, loop through the frames of MC, instantiating a new copy each time.
// playhead is advanced 1 frame on each pass.
// object is pushed into the array
// object is added to the container
function buildArray(n:int):void
{
	var d:MC;
	for (var i:int = 0; i < n; i++)
	{
		d = new MC();
		d.gotoAndStop(i+1);
		dashArray.push(d);
		mcContainer.addChild(d);
	}
	// we no longer need mc; set it to null for GC;
	temp = null;

	// add the container to the stage
	addChild(mcContainer);

	// tween the contents of the array
	// in this case, each dash animates from alpha 0, with a duration of .1 seconds,
	// with .2 seconds between each dash animation
	TweenMax.allFrom(dashArray, .1, {alpha:0}, .2);
}
 
snickelfritz said:
Another method is to animate a mask to reveal the dashes over time.
Click to expand...

I'm going to guess that for a flash newbie this is the easiest plan of attack. Just look up how to create a mask and you're good. I don't remember if you can make a mask layer animation follow a path like a regular object can, but if so that would make the effect pretty believable.
 
Masks are a simple way to simulate animations.
One thing to be aware of is that Flash Player does not handle masks very efficiently, so keep the overall mask area as small as possible.
(objects hidden by a mask are still rendered by Flash Player)

Personally, I prefer the frame by frame erasure method.
It's simple enough for a beginner, and the resulting sequence is very versatile.
For example, a timer can be used to advance the playhead one frame at a time, which would work nicely for controlling the duration of this type of animation.
To change the speed of the animation, simply change the value of the speed variable.(AS3 Timers are in milliseconds, so a value of 500 is equal to a half second)
PHP: 
mc.gotoAndStop(1);

var speed:Number = 500;
var timer:Timer = new Timer(speed);
timer.addEventListener(TimerEvent.TIMER, go);
timer.start();

function go(e:TimerEvent):void
{
	if (mc.currentFrame < mc.totalFrames)
	{
		mc.nextFrame();
		trace("timer running");
	}
	else
	{
		timer.stop();
		trace("timer stopped");
	}
}
 
You must log in or register to reply here.
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.
Top Bottom
Back