In the applet below, we show how to dynamically use the customization methods of the TriangleBoard class. We placed on the Stage three instances of the ColorPicker component. The instances call the appropriate methods of the TriangleBoard class on ColorPickerEvent.CHANGE event. The fla file corresponding to the applet is as3_class_intro_3.fla in the zip package. Again the fla file and TriangleBoard.as file must be in the same directory for the fla file to compile.
Download
- Download all files related to this tutorial in one zip file: as3_class_intro.zip
The Code
Below is the complete code that we placed on the MainTimeline of as3_class_intro_3.fla. Our three instances of the ColorPicker component on the Stage have instance names: cpBack, cpTriangle, cpDot. Since we want to use the ColorPickerEvent.CHANGE event, We have to import the corresponding event class. Unlike most other classes, components event classes are not automatically imported into a script on the MainTimeline. We don't have to import the TriangleBoard class as the class is in the same directory as the fla file.
import fl.events.ColorPickerEvent;
var board:TriangleBoard = new TriangleBoard(320,320);
this.addChild(board);
board.x = 15;
board.y = 10;
cpBack.addEventListener(ColorPickerEvent.CHANGE,backChange);
function backChange(e:ColorPickerEvent):void {
board.changeColorBack(cpBack.selectedColor);
}
cpTriangle.addEventListener(ColorPickerEvent.CHANGE,triangleChange);
function triangleChange(e:ColorPickerEvent):void {
board.changeColorTriangle(cpTriangle.selectedColor);
}
cpDot.addEventListener(ColorPickerEvent.CHANGE,dotChange);
function dotChange(e:ColorPickerEvent):void {
board.changeColorDot(cpDot.selectedColor);
}
btnReset.addEventListener(MouseEvent.CLICK, resetAll);
function resetAll(e:MouseEvent):void {
board.resetBoard();
}
On the next pages, we show an applet in which we create two instances of the TraingleBoard class.
