Stickman - Drawing a line between two points

TUTORIAL INFO
Version Flash 4 Difficulty Intermediate Created 27th April 2000

OTHER LANGUAGES
Français

DOWNLOAD
ZIP	FLA

In response to a discussion on Were Here forums, where somebody asked how to draw a line between two points. I pointed out that you don't need to use complicated maths to do it, and created this file (which you can download in .zip format) to demonstrate -- it's a different way of achieving the 'distance' effect, here.

This looks familiar...

This is not a new technique: in fact I learned it when working out the mouse-following line technnique, which I originally saw on Infinovation. I don't know if they came up with the idea themselves or found it elsewhere...

What's the trick?

It's surprisingly simple, in fact. You start with a diagonal line that is 100 pixels high and wide (/line) -- as it appears when you first see the above .swf file. There's control movie running constantly, which sets the four endpoint variables (/:RedCircleX, /:RedCircleY, /:BlueCircleX, /:BlueCircleY) according to the poisition of /RedCircle and /BlueCircle (which are of course moved using Set Drag).

The control movie then sets the _x and _y properties of /line to equal /:RedCircleX and /:RedCircleY, which places one endpoint at the centre of the red circle.

Next, we subtract /:BlueCircleX from /:RedCircleX to give us the variable xscale and /:BlueCircleY from /:RedCircleY from give the variable yscale. This gives us the horizontal and vertical distances between the two circles. By setting the _xscale property of /line to xscale and the _yscale property to yscale, we distort the line such that the other endpoint now lies at the centre of the blue circle.

Why the Duplicate Movie action?

Flash has a couple of quirks that we can avoid by duplicating the line every frame.

First, if you scale a movie close to zero then it gets 'stuck' and will not scale up again (this is a bug). Secondly, if you scale a movie by a negative number, then again by a negative number, the two negatives cancel and become a positive -- and the line begins to flip between negative and positive every other frame (I'm not sure if this is a bug, or intentional).

Using Duplicate Movie every frame replaces the distorted instance of /line with a 'fresh' version that is 100x100 pixels.

That's all, folks!

I hope that's clear. Feel free to mail me at the address below if you need help.