| << Chapter < Page | Chapter >> Page > |
In one case (QuizA) , access is by way of the named reference variables that were declared in Listing 2. In the other case (QuizB) , access to each component object's reference is by way of an element of the array thatwas created in Listing 3.
The vboxCompleteHandler for QuizA
The vboxCompleteHandler method for the class named QuizA is shown in Listing 10.
private function vboxCompleteHandler(
event:mx.events.FlexEvent):void{this.height =
theQuestion.height+ choice00.height
+ choice01.height+ choice02.height
+ checkButton.height+ result.height
+ 36;//six spaces per compnent}//end vboxCompleteHandler
//==================================================//}//end class
}//end package Registered by the code in Listing 6
This is the event handler method that was registered on the VBox container by the code near the bottom of Listing 6. The purpose of this eventhandler is to execute when the VBox construction is complete and to set the height of the VBox container to the heights of the six individual components plus six pixels per component to account for the space betweencomponents.
Listing 10 accesses the individual height values by way of the six reference variables declared in Listing 2.
The vboxCompleteHandler for QuizB
The vboxCompleteHandler method for QuizB is shown in Listing 11.
private function vboxCompleteHandler(
event:mx.events.FlexEvent):void{this.height = 0;for(var cnt:int = 0;cnt<components.length;cnt++){
this.height += components[cnt].height + 6;
}//end for loop}//end vboxCompleteHandler
//==================================================//}//end class
}//end package Same purpose as before
This event handler method has the same purpose as the event handler method with the same name in Listing 10.
Once again, because the references to the components are stored in an array, a for loop can be used to access and get the height of each of the components and to compute the overall height as the sum of those heights plussix pixels for each component.
The end of the program
Listing 10 and Listing 11 each signal the end of the class and the end of the program.
I encourage you to run this program from the web. Then copy the code from Listing 12, Listing 13, andListing 14. Use that code to create a Flex project. Compile and run the project. Experiment with the code, making changes, and observing theresults of your changes. Make certain that you can explain why your changes behave as they do.
I will publish a list containing links to ActionScript resources as a separate document. Search for ActionScript Resources in the Connexions search box.
Complete listings of the Flex MXML and ActionScript source code discussed in this lesson are provided in Listing 12 through Listing 14.
<?xml version="1.0" encoding="utf-8"?><!--TestGenerator01
This application illustrates the concept of exposingthe interface and hiding the implementation. Two
classes are defined from which custom components areinstantiated. Components instantiated from both classes
have the same user interface but they have radicallydifferent implementations.--><mx:Application
xmlns:mx="http://www.adobe.com/2006/mxml"xmlns:cc="CustomClasses.*"><mx:Label text="ENCAPSULATION DEMO"/><mx:Label text=" Copyright 2009 R.G.Baldwin" /><!--The following code instantiates an object of the class
named QuizA for a multiple-choice quiz question with threechoices.--><cc:QuizA
question="Which of the following is not the name of one of the
seven dwarfs?"choice0="Dopey"
choice1="Sneezy"choice2="Harold"
answer="2"/><!--The following code instantiates an object of the class
named QuizB for a multiple-choice quiz question with threechoices. Note that the interface is exactly the same as
for the class named QuizA. However, the implementation ofQuizB is radically different from QuizA.--><cc:QuizB
question="Which of the following is not the name of one of the
seven dwarfs?"choice0="Dopey"
choice1="Sneezy"choice2="Harold"
answer="2"/><!--The purpose of the follow code is to control the
appearance of the GUI components.--><mx:Style>RadioButton {
fontWeight: bold;fontSize: 14;
}Label{
fontWeight: bold;fontSize: 18;
color: #FFFF00;}
Button{fontWeight: bold;
fontSize: 14;}
TextArea{fontWeight: bold;
fontSize: 14;}</mx:Style></mx:Application> 
Notification Switch
Would you like to follow the 'Object-oriented programming (oop) with actionscript' conversation and receive update notifications?
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|