<< Chapter < Page | Chapter >> Page > |
Extend the VBox class
This class extends VBox instead of extending Sprite as is the case in the previous program. Although this program will compile and run by extending Sprite , nothing appears on the output screen.
Apparently the reason is that Flex requires user interface display objects to be subclasses of the class named UIComponent , and the Sprite class is not a subclass of that class. This is the first major difference between this program and the previous one.
Some window dressing
The code at the beginning of the constructor in Listing 5 sets the height, width, background color, and transparency of the VBox container so that it can be seen in the display. As indicated in the comments, this is window dressing and is not a requirement for the program to executeproperly. The cyan rectangle in Figure 2 is the VBox container.
A new BitmapData object
The last statement in Listing 5 instantiates a new BitmapData object identical to the one instantiated in the previous program.
Draw a yellow cross on the background
The code is listing 6 is identical to the code in Listing 2. This code draws the yellow cross on the red background that you see in Figure 2.
var yellow:uint = 0xFFFF00;
for(var cnt:uint = 0; cnt<100; cnt++){
bitmapData.setPixel(cnt, cnt, yellow);bitmapData.setPixel(100 - cnt, cnt, yellow);
} //end for loop
Encapsulate the bitmap data in a Bitmap object and add it to the display
This is where the second major difference between the two programs arises. Although both programsencapsulate the bitmap data in the Bitmap object using the same code, the code required to add the Bitmap object to the output display is very different.
var bitmapObj:Bitmap = new Bitmap(bitmapData);var uiComponent:UIComponent = new UIComponent();
uiComponent.addChild(bitmapObj);addChild(uiComponent);
} //end constructor} //end class
} //end package
Call the addChild method
In the previous ActionScript program, it was possible to simply call the addChild method to add the Bitmap object to the output display. However, that is not possible in a Flex application. If you try to do so, your programwill throw a runtime error indicating an incompatible type.
Two requirements
In order to add a child to a VBox object, that child:
While a Bitmap object is a subclass of DisplayObject , it does not implement the IUIComponent interface. Therefore, it is not compatible with being added directly to the VBox object.
Use a UIComponent object as an intermediary
One way to handle this is to add the Bitmap object to a new UIComponent object and then add the UIComponent object to the VBox object.
That is what I did in Listing 7. The result is shown in Figure 2 with the red Bitmap object contained in the cyan VBox object.
This is the second major difference between the two programs.
The end of the program
Notification Switch
Would you like to follow the 'Object-oriented programming (oop) with actionscript' conversation and receive update notifications?