In continuation with the tutorial ...
This part has already been included in the book available for download here ...
Take the following code in a package properly reviewed:
package test ( flash.events.Event import; mx.containers.Panel import; mx.controls.Label import; mx.events.ChildExistenceChangedEvent import; mx.events.FlexEvent import; public class Test extends Panel ( / / put the image as embed (being acquired and defined in our applicativo / / with variable immediately below (iconImg) available in the form of class. [Embed ( "flexBtn.png")] var iconImg private: Class; / * This property will be available as elitura / write for example: meuPainel.nomePessoal * / [Bindable]
var private _nomePessoal: String; / / Available as dataCriacao in read-only mode; meuPainel.dataCriacao var private _dataCriacao: String; / / variable temporarily used to know the hours / minutes / seconds used in low Date; var private data: date = new Date;
public function test () ( / / define the panel this. width = 270; this. height = 270; this. x = 0; this. y = 0; / / add the eventListner ,0, true ); this. addEventListener (FlexEvent.CREATION_COMPLETE, created, false, 0, true);
) { created private function (evt: FlexEvent): void (
/ * set the exact time of the creation of the panel, using the date in this if d variable data * / +dados.getSeconds(); _dataCriacao = dados.getHours () + ":" + dados.getMinutes () + ":" + dados.getSeconds ();
/ / add the icon to the panel this. titleIcon = iconImg; / / check if the nomePessoal was defined if (! _nomePessoal) ( / * if the name has not been given, we give a temporary name, the case will be given as: Test Panel "number" where the number is a random value between 0 and 15, this number is achieved through Math.floor (Math.ramdom () * 15) * / _nomePessoal = "Test Panel" + Math.floor (Math.random () * 15); ) / * we use a label that indicates the nomePessoal and time of the creation of the panel, this Label disappear as soon as children are added to the panel, so that we use a evenListner * / Label; var LBL: label = new Label;
lbl.name = "status"; lbl.x = 0; lbl.y = 0; / / define the text lbl.text = _nomePessoal + "created:" + dataCriacao; / / add to the panel as a child this. addChild (LBL); / / event Lištná to know when a child was added to the panel for / / we can remove the label placed on top. , 0, true ); this. addEventListener (ChildExistenceChangedEvent.CHILD_ADD, remove, false, 0, true);
/ / dispatches the event finished custom Event( "btnsProntos" )); this. dispatchEvent (new Event ( "btnsProntos"));
/ / remove the eventListner terminao since it will only be triggered once. this. removeEventListener (FlexEvent.CREATION_COMPLETE, created); ) { private function removes (evt: ChildExistenceChangedEvent): void (
/ / function to remove the label with the name and time of creation, this happens when / / added a son to the panel. / / remove the child 0 (LBL child is used up, the number is zero because nothing / / more was added to the panel) this. removeChildAt (0); / / remove the event Lištná otherwise added if more than one child / / This function will always remove the last inserted this. removeEventListener (ChildExistenceChangedEvent.CHILD_ADD, removes); ) / * as just want the property of dataCriacao is read-only, we only the function to read this value, with the get, called getter * / public function get dataCriacao (): String ( _dataCriacao return; ) / * as _nomePessoal want the property is either to read or to write, I have to say to our class that can make or receive content from and that variable, doing this with the functions get and September ** / public function get nomePessoal (): String ( _nomePessoal return; ) / / Get a string as name { public function in September nomePessoal (name: String): void (
_nomePessoal = name; ) ) ) In the example above has used a more complex class, but as it is properly discussed will be quite easy to understand. In this example we can understand the following, a panel is used as a base, (extends) and their properties ... after that is automatically added exemplifying an titleIcon attributes inherited from the father (Panel).
What were then added some new attributes to our staff Panel, as the nomePessoal and dataCriacao, where both can be accessed to read its values:
trace (meuPainel.nomePessoal); trace (meuPainel.dataCriacao); nomePessoal and can be defined:
meuPainel.nomePessoal = "name of my staff panel"; This read / write these values is only possible due to getter'se setter's that are available in our class's, which is used to get in:
trace (meuPainel.nomePessoal);
and September:
meuPainel.nomePessoal = "name of my staff panel";
In this example we also see over the use of some mathematical functions (floor and ramdom) that can be accessed by the Math class. Then add a label to the panel when it is created with the nomePessoal and time of its creation, and to add a eventListener this label will disappear when a child is added to the panel. Not forgetting that have removed eventListeners not to cause conflict.
To test this class just do:
mx.controls.Button import;
teste.teste import;
mx.controls.Alert import;
var private myPanel: test = new test;
private function init (): void (
myPanel.addEventListener ( "btnsProntos," finished);
/ / = myPanel.nomePessoal "Panel GRÜN" may or may not set the personal name of our panel.
addChild (myPanel);
)
private function finished (evt: Event): void (
Alert.show ( "Panel icon and complete.")
)
addChildMe private function (): void (
var temp: = new Button Button;
myPanel.addChild (temp);
)
Here you call the function init, our panel is created on stage, with the name and time of creation is ... call the function addChildMe a button will be added to our panel and that there existed label will be automatically removed. And ready at last have your class is created that no less a custom panel, and without making so much already used methods and parameters hereditary, and the composition that was previously explained ..
Continued ...
Hug.
A Comment
face these very same forces earned this tutorial helping me too ...