background image

22

Creating Advanced Components

You can also handle the 

textChanged

 event if you want to determine when the ModalText.text 

property is modified, as the following example shows:

<mx:Script>

<![CDATA[

function handleText(event)
{

myText.text = "ModalText.text changed";

}

]]>

</mx:Script>

<mx:TextArea id="myText" />
<ModalText labelPlacement="left" 

textChanged="handleText(event);"

 />

Note that to trigger the event, you have to modify the ModalText.text property directly; entering 
text into the TextInput control does not trigger the event. 

Troubleshooting

This section describes some common problems and their solutions when creating components for 
Flex in Flash.

I get an error "don't know how to parse ..." when I try to use the component from MXML.

This means that the compiler could not find the SWC file, or the contents of the SWC file did 
not list the component. Ensure that the SWC file is in a directory that Flex searches, and ensure 
that your 

xmlns

 property is pointing to the right place. Try moving the SWC file to the same 

directory as the MXML file and setting the namespace to "*" as the following example shows:

<mx:Application xmlns:mx="http://www.macromedia.com/2003/mxml" 

xmlns="*"

>

I get an error "xxx is not a valid attribute ..." when I try to use the component from MXML.

Ensure that the attribute is spelled correctly. Also be sure that it is not private.

I don't get any errors, but nothing shows up.

Verify that the component was instantiated. One way to do this is to put a Button control and a 
TextArea control in the MXML application and set the 

.text

 property to the ID for the 

component when the button is clicked. For example: 

<!-- This verifies whether a component was instantiated. -->
<zz:mycomponent id="foo" />
<mx:TextArea id="output" />
<mx:Button label="Print Output" click="output.text = foo" /> 

I tried the verification test and I got nothing or "undefined" in the output. 

This means that one of your dependent classes was either not loaded or was loaded too late. Print 
various classes to the output to see whether they are being created. Any components created with 
the 

createClassObject()

 method as subcomponents of your component must be placed in 

your component symbol.

The component is instantiated properly but does not show up (#1)

.

In some cases, helper classes are not ready by the time your component requires them. Flex adds 
classes to the application in the order that they need to be initialized (base classes, and then child 
classes). However, if you have a static method that gets called as part of the initialization of a class, 
and that static method has class dependencies, Flex does not know to place that dependent class 
before the other class, because it does not know when that method is going to be called.

Содержание FLEX-CREATING ADVANCED COMPONENTS

Страница 1: ...Creating Advanced Components...

Страница 2: ...y website mentioned in this guide then you do so at your own risk Macromedia provides these links only as a convenience and the inclusion of the link does not imply that Macromedia endorses or accepts...

Страница 3: ...ateChildren method 9 Implementing the commitProperties method 10 Implementing the measure method 10 Implementing the layoutChildren method 12 Implementing the draw method 12 Defining getters and sette...

Страница 4: ...4 Contents...

Страница 5: ...About creating components Most new controls extend an existing class If you want to create a component that is based on the Button control for example you can subclass the mx controls Button class How...

Страница 6: ...d defines events and event handlers for the component When you extend an existing component class you can inherit from only one class ActionScript 2 0 does not allow multiple inheritance To edit Actio...

Страница 7: ...lasses broadcast their events just before drawing If you are familiar with Flash this event is analogous to the enterFrame MovieClip event The UIObject class posts events to its listeners just before...

Страница 8: ...ify a Button s behavior it is simpler to extend the Button class as a custom MXML component For more information see Developing Flex Applications About the component instantiation life cycle When you...

Страница 9: ...ct method to instantiate a subobject of your component The createClassObject method has the following signature createClassObject className instanceName depth initObject The following table describes...

Страница 10: ...e ViewStack selectedIndex property the ViewStack container does not display a new page right away Instead it privately stores a pendingSelectedIndex property When it is time for Flash Player to update...

Страница 11: ...s how wide its label is in order to compute the value of the _measuredPreferredWidth property Note Although you can let Flex determine these values for you your application startup time will decrease...

Страница 12: ...accordingly function layoutChildren Void text_mc setSize layoutWidth mode_mc width layoutHeight if labelPlacement left mode_mc move layoutWidth mode_mc width 0 text_mc move 0 0 else mode_mc move 0 0 t...

Страница 13: ...edia recommends that you use initial capital letters for the second word and each word that follows For example public function get initialColorStyle Number The variable that stores the property s val...

Страница 14: ...geProp1 when the property is modified ChangeEvent changeProp1 var prop1 Number You can also instruct your component to generate an event when a getter or setter method is called as the following examp...

Страница 15: ...the architecture mx core UIObject and mx core UIComponent These classes define low level component events such as draw resize move load and others that are fundamental to all components Subclasses of...

Страница 16: ...a subobject you use the createClassObject method as the following example shows function createChildren Void createClassObject TextInput text_mc 0 preferredWidth 80 editable false text_mc addEventLis...

Страница 17: ...alls the commitProperties method You should call the invalidateSize method infrequently because it measures and redraws everything on the screen and this can be a computationally expensive action Some...

Страница 18: ...lity When developers add the MyButton component to an application they can use the Accessibility panel to make it available to screen readers Adding versioning When releasing components you should def...

Страница 19: ...xt example The following code example implements the class definition for the ModalText component The ModalText component is a text input whose default is the noneditable mode but you can switch to ed...

Страница 20: ...SkinName falseDownSkin modeDownSkinName mode_mc addEventListener click this e Implement the measure method The default width is the size of the text plus the button The height is dictated by the butto...

Страница 21: ...tchEvent type placementChanged function get labelPlacement String return __labelPlacement private var __text String ModalText ChangeEvent textChanged Inspectable defaultValue ModalText function set te...

Страница 22: ...ML Ensure that the attribute is spelled correctly Also be sure that it is not private I don t get any errors but nothing shows up Verify that the component was instantiated One way to do this is to pu...

Страница 23: ...ck the values of the preferredWidth and preferredHeight properties Other code might have set those values to zero If so set a breakpoint in the setters for the width height preferredWidth and preferre...

Страница 24: ...24 Creating Advanced Components...

Отзывы: