Flash :: Animated Masking A Line

Animated Masking Effect
Hello!

My boss came to me the other day and said he wanted this drawing effect on our new website.

http://innocean.com/EngMain.asp

Cool, I thought, just some frame by frame animation and it'll be done. Turns out though that he wants ALOT of these types of animations.

I've found some resources on how to do this in AS2 with SVG but nothing i can really get m head around as I've never used SVG.

Does anyone have any ideas on existing libraries that do this with AS3 or maybe a resource (tutorial or spec) where I can get more into this?

Thanks.

Edit: Got my hands on AnimationPackage and trying to figure out how the AS3 version is working. If anyone has any experiece in working with this, please let me know.

Animated Line
I would like to animate a line drawing around a photo. You know, actually have the line look like it's drawing itself.

Masking Animated Movie Clips
Hello there. A quick thanks to anyone that gives me an answer to either of these issues!

My question is really two questions, but both related to the same site.

I'm working on a site which is about half done, the address is www.xrossnetworks.com/alis.

The first question is this, as you navigate (rollOver the green glowing light to the left of the bar) to the galleries section, choose a gallery, with some browsers/flash versions the thumbnail images (that I have masked within each button MC) seem to be visible. I don't quite understand as I guess masks have been around since the very earliest flash versions. Is there an answer to this? My other masks seem to work just fine, only these ones that don't.

The second part of my question is this. Although I have embedded the fonts I've used (only two), on some computers, these fonts don't appear. I've also attached the fonts as symbols.

Thanks again. Sincerely, Nathanael.

PS. Let me know if you'd like me to paste some script or attach a file. The absolute path to the .swf is www.xrossnetworks.com/alis/public.swf

[FMX] Animated Masks & Actionscript Masking
I have tutorial that comes with FMX2004 and one from net
in this tutorials some commands works that don't work in mine fla

do you maybe have some tutorials or examples to see where I'm wrong maybe

Dynamic Masking With Animated CurveTo?
Hi guys, I've been racking for over two hours trying to get a simple square mc (myclip) to disappear off the stage with a curved mask animation?

any ideas or help with the concept of curveTo and how this whole shindig works?

Making An Animated Line
Hi again, all you wonderful, creative, intelligent, flashers!
How do I draw a line so that it is animated: I want a line to come down from the top of my page, where I will "draw" out the boxes for my link buttons. On rollover they will be filled with a colour and then linked to their respective page. I have seen lines being drawn out in animated style before, but I don't know how it's done. Is there a tut for it somewhere? Thanks ahead of time for any help. -BR

Animated Tracing Line
Hi,

I've had a little bit of experience with flash, so I know the basics (even though this is probably basic=P). Anyway, here is my problem.

I have a map, pictured below:

On this map, I must animate a line which follows the 'Sepik River' (the route followed by an explorer).

I am at a loss of how to do this. I can trace a motion guide over this route; but then all I can really do is move a small object along this route. I need a line to follow this path, tracing along the river.

Thanks for the help,

Sai

From Point To Animated Line
Hallo guys,
i need to draw some curves in diagram for my student job.
The curves should start from point, follow some path (combined from three, four parts) and finish it as the whole curve.
Could you help me with ideas how to do that. I am ocassionaly flash user, so I cannot guess it so easily
Thanx in advance.

Animated Line Drawing
The Code:

Code:
function drawLine () {
xAxis = 20;
yAxis = 50;
this.onEnterFrame = function () {
this.createEmptyMovieClip ("newLine", 2);
this.newLine.lineStyle (2, 0x000000, 100);
this.newLine.moveTo (20, 20);
this.newLine.lineTo (xAxis++, 20);
if (xAxis >= 50) {
this.newLine.lineTo (50, yAxis++);
}
};
}
this.drawLine ();
The Problem:
How do I get the first line I drew to stop at the xAxis 50 so that when the new line draws it doesn't start to form some weirdo triangle? I'm fairly new to Action Script so go easy on me.

Thanks in advance,
Shaun McKinnon

Animated Line Drawing
I just recently purchased Flash cs4 so I am very new at it, but I want to learn, I am trying to animate a line drawing (building a house) I do ok at motion tween with balls or blocks but I cannot figure out how to tween a line. I need to be able to make the line grow. Any help or guidance please

Create An Animated Line
I have a question i cant find the answer for. I have seen people having lines moving in all directions. For example a circle who is moving from basically nothing and the line is created and then to a circle. I cant figure out how that is done. It would be great if somone had a tutorial for that or can tell me how it can be done

Chasing Animated Line
I am looking for an example of an animation technique I have seen before.

The effect involves a growing line, which is followed by the screen as it grows.

Anyone know what I'm talking about?

cheers
MF

[as] Line Between Two Animated Points
Hi there,

I thought this would be easy as nothing, but it turned out the other way around. Ive got two (actually more, but just to make it simple) boxes animated around on the stage (through AS) and trying to have a line going from box01 to box02 no matter where on the stage the boxes are in relation to each other. Can it really be this hard, or is it just me?

All suggestions appreciated!

TIA,

Øyvind

Animated Line Tutorial?
Aloha from Hawaii

I have a group on cartographers who are looking to animate lines over a base maps - for example, an animated Amtrak train route across and satellite image of the Continental US.

can anybody point us toward and Actionscript solution to this?
- non-Actionscript methods (frame by frame, masking) are extremely tedious

Many mahalos and Happy New Year

bill - hawaii

Animated Masking For Dynamic Text Boxes
Hi i have tried using the masking of dynamic text field tutorial but seem to be having problems.

The mask comes as a square. or a rectangle.

Also is it possible to have an animated mask for dynamic text fields. I have gone through a lot of threads and people say they have done it but don't explain how they achieved it.

thanks

Line Masking
why the poop wont flash let you make a mask out of a line or a group of lines? and breaking or grouping i can do to trick it into it? thanks.
Valmont

New To Flash/Animated Line Drawing
Hi Guys and thanks for you help in advance.

I'm quite new to flash and still finding my way so bear with me while I try to explain.

I'm trying to create a movie that contains an image and I would like the image (a photograph) firstly drawn around with some thin black lines then later filled in piece by piece. Now I have the filling in bit sussed by using masks but how do I animate a line as if it's being drawn so in other words drawing a line when the movie opens from point a to point b to point c etc.

I know it’s got to be quite straightforward but I just can’t figure it out, again thanks in advance.

James

Cool Animated Line Drawing
hello, I am looking for a way to create an animation in flash like this link:

http://www.edwardporter.com/flash/Comp1.mov

ok, so maybe this animation is not that cool. But line 'draw-ons' like this are quite common and I cannot find an easy way to do this in flash. I have tried masks, but (as far as I can tell) the line path is too complex for a mask. I have tried animating it using shape hints, but flash just gets hopeless confused as to how I want the line to animate on. I could export this as an swf out of AfterEffects, but the file size seems way too big for what the animation is. I have begun to realize that maybe this type of animation is often achieved using actionscript.

I am looking for a step-by step explanation of doing this in actionscript. I'm an actionscript beginner, but ready to learn! I am using flash cs3.

thank you for your help and consideration,

Jeff Lebowski

Drawing Curved Animated Line
I am fighting with my little bit of knowledge on how to animate a curved line. It's from one corner of the marquee to the other corner with a slight curve in the middle to soften the line. I want it to draw from the one corner to the next with that curve intact. Can anyone give me some advice on how to do it?

Thank you,

R

Can I Draw A Animated Line By ActionScript?
Can I draw a animated line by ActionScript? i made three buttons. 1 is blue, 2 is orange & 3 i green.what i want....when i click on 1 button after that i click on any other second button,at that time i want to animated line bitween two button which i clicked. curve line must be move 1st button to 2nd button.if there is more then 50 buttons then how can is work.

i want to mak like this http://www.emirates.com/routemap.htm but i need animated line bitween 2 destination.

if u have any idea?plz let me know in details.

Thank u.

Cool Animated Line Drawing
hello, I am looking for a way to create an animation in flash like this link:

http://www.edwardporter.com/flash/Comp1.mov

ok, so maybe this animation is not that cool. But line 'draw-on's like this are quite common and I cannot find an easy way to do this in flash. I have tried masks, but (as far as I can tell) the line path is too complex for a mask. I have tried animating it using shape hints, but flash just gets hopeless confused as to how I want the line to animate on. I could export this as an swf out of AfterEffects, but the file size seems way too big for what the animation is. I have begun to realize that maybe this type of animation is often achieved using actionscript.

I am looking for a step-by step explanation of doing this in actionscript. I'm an actionscript beginner, but ready to learn! I am using flash cs3.

thank you for your help and consideration,

Jeff Lebowski

Random Animated Bezier Line From One Mc To Another
Been working on trying to get this line wobble script to work in a different way, but no success thus far. I would like to keep the curves going all the way to the destination mc. your help is greatly appreciated. Thanks!!

Action Script:

var x = 300;
var y = 50;
var boo = this;
cliparray = [];
for (var i = 0; i < 10; i++) {
var clop = attachMovie("t", "t" + i, i + 100);
clop._x = 200 + x;
clop._y = i * clop._height + y;
clop.mytext.text = "target " + i;
cliparray.push(clop);
}
delete i;
function myfunction(a) {
for (var i = 0; i < a.length; i++) {
var clip = this.createEmptyMovieClip("paper" + i, i);
clip._x = x;
clip._y = y;
var clap = clip.createEmptyMovieClip("mc", 1);
clap.ivar = i;
clap.a = a;
clap.startx = 0;
clap.starty = 0;
clap.vely = Math.random() / 10;
clap.velx = Math.random() / 10;
clap.cc = 20 + random(30);
clap.anglex = 0;
clap.angley = 0;
clap.targetx = a[i]._x - x;
clap.targety = a[i]._y - y;
clap.count = random(20);
clap.onEnterFrame = move;
clip.onEnterFrame = draw;
}
}
myarray1 = [this["t" + 0], this["t" + 1], this["t" + 2]];
myarray2 = [this["t" + 7], this["t" + 8], this["t" + 9]];
myarray3 = [this["t" + 2], this["t" + 3], this["t" + 4], this["t" + 5], this["t" + 6], this["t" + 8], this["t" + 9]];
for (var i = 1; i < 4; i++) {
this["btn" + i].ivar = i;
this["btn" + i].onPress = mypress;
}
function mypress() {
for (var obj in cliparray) {
cliparray[obj].gotoAndStop(1);
}
myfunction(boo["myarray" + this.ivar]);
}
function move() {
this._x = Math.sin(this.angleX += this.velx) * this.cc + this.startx;
this._y = Math.sin(this.angleY += this.vely) * this.cc + this.starty;
this.count++;
if (this.count >= 80) {
this.onEnterFrame = gettarget;
}
}
function gettarget() {
//I believe this is where the lines stop curving and goes to straight or barely curved line to destination mc.
//would like to keep the random curve/ wave going to the destination mc
this._x += (this.targetx - this._x) / 20;
this._y += Math.sin(this.angle) * (this.targety - this._y) / 20;
this.angle += (360 - this.angle);
if (Math.abs(this.targetx - this._x) < 5) {
this._x = this.targetx;
this._y = this.targety;
delete this.onEnterFrame;
this.a[this.ivar].gotoAndStop(2);
this._parent.onEnterFrame = fade;
}
}
function fade() {
this._alpha -= 5;
if (this._alpha < 0) {
this.removeMovieclip();
}
}
function draw() {
//this.clear()
this.lineStyle(0, 0x97CEF7, 100);
this.lineTo(this.mc._x, this.mc._y);
}

Draw An Animated Line Between Points
I'm looking to develop an application that will draw an animated line between points. Some of the points will be pre-defined, and others will be set based on input from the user.

I'm new to flash and/or any related products, so I'm just looking for some general directions on where to begin. What I'm wondering is

a) what product or products would I use to put together such an application, and
b) is this a complicated/difficutl thing or something fairly strightforward

Animated Line Graph Control?
Can anyone tell me what vendor provides an animated line graph control like on farecast.com?

Please see the following site and click on the "Graph" tab:
farecast.com Line Graph Control

Thanks!
Chirag

Animated Looping Line Of Text
Hi everyone,

I need to have a message that will positioned at the bottom of my flash movie - just a long line of text that will move in from the right of the movie and disappear on the left as more text comes in from the right. I need this small animation to continually loop. All I've done at the moment is typed the line of text in a wide text box but I'm not sure how to animate it. Should I make it a movie clip?

Sorry to be so vague - I'm a bit brain dead this morning so would really appeciate it if someone wouldn't mind briefly outlining how I'd go about this.

Thanks in advance.

Dynamic Mask From Animated Line?
I want to create a mask from an animated line. I found out pretty quick that you can't use a line to mask, only fills. So, can I convert the line to a fill as it's being drawn? Or do I need to put multiple instances of a shape along my line at intervals?

I keep seeing requests for an animation of writing. I figured it would be easier to have the text in one layer and use the animated line as the mask. It sounded good in theory.

Any one have any ideas.

I've attached my test that shows the line being drawn. I was playing around with some different objects to use as masks and that's how I saw that lines can't be used as masks. I wish they could.

Masking Of A Curved Line
Hi

I want to make a curved line on a world map which will look like originating from one country and will end up on another country, making a route between two countries. I have tried but have failed. I guess it will be a mix of masking and motion tweening. Could someone please urgently guide me to correction direction??? Thanx in advance guys

Line Drawing. Masking.
Hi, i want to create the motion of a shape being drawn with a pencil in flash, just like you would on a piece of paper with a pencil. the motion i need will be from the beginning of the circle to when the circle is completed, just like a picture is being drawn in real time.

PLEASE PLEASE PLEASE HELP ME!

Advanced Line Masking?
So I'm making a webpage intro that has three curved lines, all coming in one by one. The client also wants a "highlight" or "pulse" to run across the lines. I made a copy of the lines and created a mask so that a small white pulse would appear to go across each curved line. The problem is is that it looks like poo. The edges of the 'pulse' are sharp, and I cannot get them to actually look like a reflection of light. Is there any way of doing this with a gradient or something so that it actually looks like a light reflection? Thanks

Line Drawing & Masking Effects - How To's
I am looking for some opinions on the best way to do the effects on the left side of this page - the way the man is brought in (looks like he is drawn) then filled in (as vector art) and then the line moves over him to bring him in as a photo.

I have some ideas of how to do this -
shape tweens for the outline drawing and then masks to make the transition into the raster art.

Does anyone think or know there is a better way?

<b>The page </b> http://www.tommyshanesteiner.com/news.htm

thanks

Unveiling A Line With Masking Along A Path
Ok, here is what I have,
I have a basic square and a wavy line graphic on the stage. Now all I want is to animate a mask unveiling the line. Kinda like the line draws itself. I'm just not sure of how to go about it. I would love to do this with actionscript, but not sure about that either.
Anyhelp would be greatly appreciated.
THanks
(Texas jr. Flasher)

"multiple Animated Masks, Masking One Object"
I am pulling my hair out over this, I want multiple animated masks to increase in size revaling an image. I have seen this done several times, and cant figure out if they shape tween'd on one layer or if they were motion tweens on multiple layers and somehow all linked to the bottom layer. please help before I shoot my self

Animated Masking A Dynamic Image Is Causing Dynamic Image To Disappear Intermedently.
You can find the file here of what I am trying to do:
http://www.yourfilelink.com/get.php?fid=462218

Please tell me if you are having problems downloading it.

This has always irritated me and I can't seem to find a way around it.

I dynamically load an image to a movie instance and the movie instance is masked. The masking is animation on it, so that it looks like the image is animated via masking. It works if the masking animation is one long shape motion tween, but if I make the masking animation frame by frame, the image being masked disappears and reappears only when it is a long shape tween of the mask.

Please refer to the downloadable sample to understand what I mean. Is there a way around this?

I have seen page flip samples that is able to do what I am trying to do, but they used really advanced actionscripting to do this. I am using timeline.

Create Non-animated Equivalent Of Animated Flash 8 Animation
Hi, I'm working with a template that includes Flash. It's bad enough I've never touched Flash before this project, but I have to actually work with someone else's engineering of one (I'm retrofitting a purchased template)! LOL

Anyway, all I want to do is to save a completely non-animated version of the animated version I've managed to perfect. The plan is to use it on sub-pages of our presentation so that people only have to experience the animation when they land on the page. Not when they're navigating around. I've already tried a couple of things including saving an image map version. All that did was present me with an error message that certain components weren't included, which is tentatomount to being non-usuable to me for now.

So, is there a way to tell Flash, "Hey, this looks great, now give me a static version of it with working links and everything!".

Thanks if anyone can help!

Dave

Animated SWF Is Not Animated When Included In Another Movie As A Clip
I have an SWF that, when run by itself, is an animation of a graphic equalizer display. But when I bring it into a new movie as a movie clip (I want to change the alpha, throw up some text, clear the txt, change the alpha, etc), the animation does not work, and all I get is the static images.

FLA is at http://www.black-diamond.com/flash_src/equalizer.fla if anyone wants to take a look at it. The one I am trying to bring it into is at http://www.black-diamond.com/flash_src/test3333.fla (the corresponding .swf to see what happens is at http://www.black-diamond.com/flash_src/test3333.swf ).

Any suggestions greatly appreciated.

Thanks.

(Reposted because last title wasn't descriptive enough)

Masking Issue - Image 'pops' Out Of Masking
ok i been attempting to fix this tiny, but obvious glitch for hours...

3 layers on timeline

bottom layer has 6 different images at regular intervals (every 26 frames).

middle layer is masking the bottom layer. it contains a movie clip of animation of a square shrinking to basically nothing then expanding again (with a 3 frame pause before it expanding again). Basically like a shutter closing then opening.

the top layer is empty except for the action script calls in key frames at intervals to start the animation of the mask. just uses gotoAndPlay('label') to the movie clip in middle/mask layer.

PROBLEM:
The change of pictures if offset in the timeline so the change occurs during the closing of the shutter (mask hiding all of the image).
so the mask movie clip is in layer 2 frame 1.
the first image is in layer 3 frame 7.

for some reason the very first image just pops over the closed shutter i.e. it is visible even though it should hidden. The subsequent 5 image changes behave as they are supposed to.

whiskey tango foxtrot....

edit note:
this movie clips is then placed on the main time line and itself one of a few a masked layers.

[MX04] Dynamically Created Textbox Won't Go To Next Line When Text Exceeds First Line
Hey all,

I've dynamically created a textbox and then applied a new text format with the following code:

Code:
{
createTextField('welcome',4,-100,-25,160,100);

welc = new TextFormat()
welc.font = "Sydnie";
welc.selectable = false;
welc.size = 12;
welc.color = 0xfffafa;
welc.multiline = true;

welcome.text ="Text that exceeds one line."
blackbox.welcome.setTextFormat(welc);
}
How do I make the textbox go to the next line when the first is full and not go beyond it's right border?

Thanks for your time,
Greenham.

Attach A Line To Two Movie Clips. So The Line Moves And Adjusts To The Positionning
Hey

ok I'm working on a project, I have two movie clips moving to different locations, and I want a line connecting both clips.

The line will need to adjust dynamically to the mouvement of both clips.

Can someone give me a heads up on how to accomplish such task.

If more information is needed, post areply saying so, and I will add more information about what I am trying to accomplish.

Thanks
Jean

[F8]Text/Paragraph/String - Line By Line Write Effect
howdy - ive seen some nice text effects recently, and im looking for some resource on recreating them. Ideally im after a nice function / prototype for outputting a line of dynamic text, to a textfield in a nice way, rather than just dumping it on screen. So either letter by letter, or line by line, without having to do all the rubbish faux-effects by masking and tweening.

any ideas?

cheers.

Reading Textfield Line By Line ? Selecting Multiple Textfields At Once ?
OK i need some serious help/advice !

I`m trying to make a sort of program like word , i want to have a text field , but the problem comes when i want to create like borders around each line of text and have DIFFERENT background colors for each line.
So i was thinking if i can read line by line and get get the height of each line by examining char by char for it's size and get the biggest one ( since my text may have different fonts sizes ect on a single line) and then have like BLOCKS that are behind each line and adjust their sizes accoring to the line size and change their color also.

Also another thing that I would also want to do , i want to create a table which i did , but now how do i put the table into my text ...and not just lie on top blocking text behind it ..how do i like "push" the text around it ?? ANY IDEAS would help...thats why i thought maybe create lots of textfields just stacked from top to bottom..but then i will have the problem of selecting them all at once like in a REAL word processing problem...and also if the text becomes too big it will need to "flow" into next textfield...

Is there ANYWAY to do this ??! HELP ME!!!!

THANK YOU

Multi-line Text Field Auto Line Break
When a Dynamic Multiple line text field is used in Flash CS3, it has a very annoying feature that auto inserts a line break at the end of inserted text. It also auto inserts a line break if no text is entered too.

I'm having a problem with this because the text is being saved from flash to a text file on the desktop. With every multi-line text field there's a nasty looking line break.

Any way of "turning off" this auto-line-break-at-the-end feature?

Txt File Double Spacing Off Line, Single On Line
Has anyone else seen this?

When I'm setting up a .txt file for import (the swf is v5 code, authored in MX), I'm noticing that if the .txt file has a single line break between paragraphs, this represents as a single empty line when the swf file is viewed on-line, but it shows as a double blank line when the same file is opened off-line.

Does anyone know a trick to getting imported txt files to display the same way on- and off-line?

(Or am I going mad and no one else has noticed this...)

Flash Getting PHP To Feed It A Text File Line By Line
Maybe someone can point me in the right direction.

I want Flash to access the text file, separated my newlines, that can get quite large. I want Flash to access each of those lines one by one and process them with Actionscript.

I am getting the idea that I should use PHP to open the text file and store the lines in an array. But how can I access each array element in Flash?

Does anyone have any suggestions about this? Have you seen where this has been done before?

Is It Possible To Get Data Printed To The Screen Line By Line As A Ping Does?
I have a Flash web app using AMFPHP remoting that calls a unix script that runs either a ping or a traceroute command based on some parameters I pass it.

The methods in my remoting method table for ping and traceroute are:

PHP Code:

function doLsPing($addr)
{
    $ping = shell_exec("/path/to/my/pingScript.sh " . $addr);
    return $ping;
}

function doLsTraceroute ($addr)
{
    $traceroute = shell_exec("/path/to/my/tracerouteScript.sh " . $addr);
    return $traceroute;
}

The unfortunate behavior I am getting is that the returns, naturally, just send me the completed data from the ping and traceroute in one big lump. Of course I would like to have the data returning to me line by line as the data is collected...like it would if you ran the script in a shell or terminal window.

You can see the danger in getting the one-big-lump-of-data scenario. If you ran a traceroute on an address that did not exist and say the traceroute did 30 hops then you could potentially be waiting a loooooooong time without anything printing to the screen. Plus the user, if familiar with ping and traceroute, would be expecting to see the results printing to the screen line by line as the command ran.

Now the caveat to this is, my PHP skills are nil to none, so maybe I am just missing something that I could use rather than just a 'return'.

Any help here would be most appreciated!