Tuesday, 1 September 2009

Drawing lines in Actionscript 3 - part 2

This is a continuation of the previous Drawing lines in AS3 tutorial. This time you will be able to change the colour of the lines using the colour picker component in Flash. Be sure you have completed the previous tutorial before attempting this one, as additional code will be added to the Drawing line file.


Drawing lines in Actionscript 3 - part 2

Step 1

Open your Drawing line file.
Select Window > Component and you should see the following component window appear.



Drag the colour picker component onto the stage. I placed my colour picker at the bottom left side of the stage, but you can place your picker wherever you want.


Step 2

Select the colour component and give the following instance name ‘colourPicker’ as shown below:




Step 3

On the timeline select the ‘Actions’ layer then choose the first frame and hit F9 to open up the Actions panel. Now enter the following code shown in red colour. Most of the code should look familiar to you. Some of the code from the previous tutorial has been left out.

function MouseDown(event:MouseEvent):void{
var theColor:Number = colorPicker.selectedColor;
drawingLine.graphics.lineStyle(3,theColor);
drawingLine.graphics.moveTo(mouseX, mouseY);
stage.addEventListener(MouseEvent.MOUSE_MOVE, MouseMove);
}

Code:
The code in the red colour stores the current colour in the palette and changes to the selected colour when the user chooses a different colour from the colour palette.


Step 4

Test your Drawing lines application Ctrl + Enter. Now try changing the colours of the lines by using the colour picker.



Checkout Drawing lines in AS3 part 3 where you will learn how to change the line thickness.

1 comments:

mikelly 17 April 2010 at 21:05  
This comment has been removed by the author.

  COPYRIGHT © 2014 · ILIKE2FLASH · Theme by Ourblogtemplates

Back to TOP