<< 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.

Draw a yellow cross on the background.

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.

Encapsulate the bitmap data in a bitmap object and add it to the display.

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:

  • Must be a subclass of the DisplayObject class and
  • Must implement the IUIComponent interface.

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

Get Jobilize Job Search Mobile App in your pocket Now!

Get it on Google Play Download on the App Store Now




Source:  OpenStax, Object-oriented programming (oop) with actionscript. OpenStax CNX. Jun 04, 2010 Download for free at http://cnx.org/content/col11202/1.19
Google Play and the Google Play logo are trademarks of Google Inc.

Notification Switch

Would you like to follow the 'Object-oriented programming (oop) with actionscript' conversation and receive update notifications?

Ask