1. DL manuals
  2. MACROMEDIA
  3. Other
  4. FLEX 2-MIGRATING APPLICATIONS TO FLEX 2
  5. Applications

MACROMEDIA FLEX 2-MIGRATING APPLICATIONS TO FLEX 2 Applications

Summary of FLEX 2-MIGRATING APPLICATIONS TO FLEX 2

  • Page 1

    M igr ating applica tions t o f le x 2 ad ob e ® fl ex ™ 2.

  • Page 2

    © 2006 adobe systems incorporated. All rights reserved. Migrating applications to flex™ 2 if this guide is distributed with software that includes an end-user agreement, this guide, as well as the software described in it, is furnished under license and may be used or copied only in accordance with ...

  • Page 3

    3 contents about flex documentation . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 using this manual . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 accessing the flex documentation . . . . . . . . . . . . . . . . . . . . . . . . ....

  • Page 4

    4 contents events . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 84 formatters. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 89 interfaces. . . . . . . . . . . . . . . . . . . . . ...

  • Page 5

    Contents 5 chapter 9: data services . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135 about data services . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .135 migrating remoteobject components . . . . . . . . . . . . . . . . . . . . . . . . . . 137...

  • Page 6

    6 contents.

  • Page 7

    7 about flex documentation migrating applications to flex 2 provides information on updating applications written for flex 1.X to flex 2. Contents using this manual . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 7 accessing the fle...

  • Page 8

    8 about flex documentation documentation set the flex documentation set includes the following titles: viewing online documentation all flex documentation is available online in adobe® acrobat® portable document format (pdf) files from the adobe website. Typographical conventions the following typog...

  • Page 9

    9 1 chapter 1 getting started this topic describes the first steps of migrating a macromedia flex 1.X application to adobe flex 2. This topic describes steps that are meant to be accomplished quickly and resolve most of the warnings and errors that you encounter. When you complete the steps in this ...

  • Page 10

    10 getting started the basic steps are the following: ■ “step 1: find and replace” on page 10 ■ “step 2: add access modifiers” on page 14 ■ “step 3: add types” on page 15 ■ “step 4: update events” on page 16 ■ “step 6: put all actionscript components in packages” on page 17 ■ “step 7: update data se...

  • Page 11

    Step 1: find and replace 11 this section describes only the most common targets of finding and replacing. There are many other members of flex classes that have changed that are not mentioned here. For a complete list, see chapter 3, “flex classes,” on page 41 . Application namespace change the mxml...

  • Page 12

    12 getting started application and container initialization the initialize event is now dispatched later in the startup and component creation life cycle. In particular, it is now dispatched after the object’s children have been created. If your event handler assumes that the object’s children have ...

  • Page 13

    Step 1: find and replace 13 replace _root remove the use of “ _root ” from your application code if you used it to access the application instance. In flex 1.X, you could use _root to refer to the main application from anywhere in your application or one of the components. This was never a recommend...

  • Page 14

    14 getting started effects/behaviors for each effect, such as fade, sequence, and parallel, change the name property to id . Also, remove the tags; for example: for more information, see chapter 8, “behaviors,” on page 129 . Geturl() method replace the geturl() method with the navigatetourl() method...

  • Page 15

    Step 3: add types 15 the default access modifier for methods, variables, and classes is internal . This means that all classes in the same package can access them, but classes outside of the package cannot. However, the flex compiler issues a warning if you do not specify any access modifier. For mo...

  • Page 16

    16 getting started step 4: update events the event model changed in flex 2. However, you can migrate most event handlers with minimal effort. This section describes the most popular changes that you must make to your event handling code. For more information about migrating events, see chapter 6, “e...

  • Page 17

    Step 6: put all actionscript components in packages 17 step 5: import classes for package-level functions when you use package-level functions, you must import the package. For example, in flex 1.X you could call the show() method in the following way: mx.Controls.Alert.Show("this is an alert!"); in...

  • Page 18

    18 getting started step 7: update data services the remoteobject, httpservice, and webservice mxml services are now known as rpc services. The remoteobject tag is not functional unless you use adobe flex data services. You must replace use of this with another tag. You can still use the httpservice ...

  • Page 19

    Step 11: api updates 19 step 10: binding to make a user-defined variable bindable, you must now explicitly identify it by adding the [bindable] metadata tag to the property; for example: [bindable] public var catalog:array; in addition, the tag must be moved to the top level. The following example c...

  • Page 20

    20 getting started ■ expanded abbreviations. Abbreviations in property and method names have been expanded where practical. For example, the hposition property is now horizontalposition . ■ property names. Some properties have been renamed so that their function is more evident. For example, the boo...

  • Page 21

    21 2 chapter 2 actionscript 2.0 to 3.0 the actionscript language has undergone a complete redesign. It is now a more robust, type- safe, and usable language. This topic provides an overview of changes to the actionscript language. For information about using actionscript 3.0, see programming actions...

  • Page 22

    22 actionscript 2.0 to 3.0 ■ a subclass cant have a var with the same name as one visible from the superclass, and you can’t override a var. ■ you must declare a type for everything or you’ll get a compiler warning. ■ accessing methods or properties of the target of an event object won't compile unl...

  • Page 23

    Usability improvements 23 capitalization of identifiers the actionscript 3.0 naming conventions match the flex application model and the ecmascript standard. All identifiers are in “camel case.” this means that an identifier’s characters are in lowercase, except that the first letter of each word in...

  • Page 24

    24 actionscript 2.0 to 3.0 actionscript 2.0 had many instances where getter and setter methods existed rather than accessors. Now, actionscript 3.0 uses accessors wherever possible. Unless a function has arguments, it was converted to an accessor. Methods that return a boolean such as socket.Isconne...

  • Page 25

    Classes and packages 25 abbreviations actionscript 3.0 contains fewer abbreviations in method and property names. The names are as descriptive as possible. For example, the mappt() method is now mappoint() . Some abbreviations are still used in actionscript 3.0. For example, the getbounds() method w...

  • Page 26

    26 actionscript 2.0 to 3.0 using packages the package statement syntax has changed. In addition, you are now required to put custom actionscript components inside packages. If you do not put a class inside a package, then the class is only visible in the current script. For example: class foo {} is ...

  • Page 27

    Classes and packages 27 using classes this section describes changes to actionscript classes. Access modifiers the new internal access modifier refers to a different namespace in each package definition, and is not defined outside of a package definition (that is, in global code). If a class in a pa...

  • Page 28

    28 actionscript 2.0 to 3.0 using external files this section describes changes to embedding, including, and importing external resources with actionscript in your flex applications. Include in actionscript 2.0, the include keyword was preceded by an octothorp: #include . You now use the keyword with...

  • Page 29

    Initializing variables 29 doing the latter results in a “type annotation is not a compile-time constant” error. Embed the embed syntax in actionscript is [embed(params)] , and this metadata must be used over a variable. The variable should be of type class; for example: [embed(source="holdon.Mp3")] ...

  • Page 30

    30 actionscript 2.0 to 3.0 default values the following example shows the default values for variables of different types: var dog:int; // defaults to 0 var dog:uint; // defaults to 0 var dog:boolean;// defaults to false var dog:number; // defaults to nan var dog:object; // defaults to undefined var...

  • Page 31

    Initializing variables 31 about undefined in general, actionscript 2.0 allowed accessing undeclared variables whose value had not yet been set. By default, their value was undefined . In actionscript 3.0, accessing undeclared variables results in a referenceerror. You can use the hasownproperty() me...

  • Page 32

    32 actionscript 2.0 to 3.0 if you previously checked against undefined for a number, you use a similar syntax; for example: if (n == undefined) // actionscript 2.0 if (isnan(n)) // actionscript 3.0 typing actionscript 3.0 is more strongly typed than previous versions of actionscript. This section de...

  • Page 33

    Typing 33 type detection to perform type detection, you should use is rather than typeof or instanceof . The is function examines types, whereas the instanceof function looks at the prototype chain. The instanceof function has been deprecated. For example: class b { public function b() {} } class a ...

  • Page 34

    34 actionscript 2.0 to 3.0 (hintstring ? String:number) is the non-assignment expression. The variable myvar is dynamically typed to be string if hintstring is true , else its type will be number. You can use a non-assignment expression anywhere that you would use a type-assignment expression. Globa...

  • Page 35

    Global functions 35 function changes some global functions have been removed and replaced with new functions. The following table shows removed global functions and their actionscript 3.0 equivalents: deprecated features the following features are deprecated: ■ the object.Registerclass() method no l...

  • Page 36

    36 actionscript 2.0 to 3.0 miscellaneous this section describes miscellaneous changes to the actionscript language. Movieclip movieclip has been replaced by sprite as the parent class of the base object for flex controls, uicomponent. The following table lists changes to methods of movieclip: the dr...

  • Page 37

    Miscellaneous 37 arrays arrays no longer automatically update if you change the data. This means that you should no longer databind to an array unless you manually call the dispatchevent() each time an element in the array changes. Otherwise, the control to which the data is bound will not reflect t...

  • Page 38

    38 actionscript 2.0 to 3.0 constants you can use the const keyword to define constants in actionscript 3.0. First, you determine which class and instance variables qualify as constants, and then declare them with const instead of var ; for example: static const nonmodal:number = alert.Nonmodal; cons...

  • Page 39

    Miscellaneous 39 __proto__ actionscript 3.0 does not support “hacking” the prototype chain. The use of __proto__ is no longer supported. For example: actionscript 2.0: class a {} var a: a = new a; trace(a.B) // output: undefined a.__proto__.B = 10 // ok trace(a.B) // output: 10 class c { var x:numbe...

  • Page 40

    40 actionscript 2.0 to 3.0 newstring2.Prop = 1; trace(newstring2.Prop); // prints '1' actionscript 3.0: newstring = new string("hello"); string.Prototype.Sayhi = function() { trace("hi!"); } newstring.Sayhi(); newstring2 = "hello"; newstring2.Prop = 1; // warning, string is sealed... String.Prototyp...

  • Page 41

    41 3 chapter 3 flex classes this topic describes api changes to the flex class library in adobe flex 2 sdk, including class-level changes to containers, core classes, and ui components. Contents core classes . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . ...

  • Page 42

    42 flex classes core classes the uiobject and uicomponent classes have been combined. As a result, references to the uiobject class should be replaced by uicomponent. Visual flex controls are subclasses of the uicomponent class (formerly uiobject). In flex 1.5, the uicomponent class was a descendent...

  • Page 43

    Core classes 43 mx.Core.Container the class as been moved to the mx.Core package. Createlater addtocreationqueue direction the direction property has been replaced by the layout property. Fillalphas/fillcolors the application background gradient now uses the backgroundgradientalphas and backgroundgr...

  • Page 44

    44 flex classes the following table describes changes to the container class: member change description allchildrenlist rawchildren backgroundalpha deprecated. Use the background style to set this value. Backgrounddisabledcolor deprecated. Backgroundsize deprecated. Use the background style to set t...

  • Page 45

    Core classes 45 if you set the background style, flex ignores any value that is supplied for backgroundalpha , backgroundcolor , backgroundimage , or backgroundsize . If you do not specify a value for the background style, flex uses the backgroundalpha , backgroundcolor , backgroundimage , and backg...

  • Page 46

    46 flex classes mx.Core.Moviecliploaderasset the following table describes changes to the mx.Core.Moviecliploaderasset class: mx.Core.Mxmluiobject the mxmlobject class is now the imxmlobject class, to conform with the flex 2 interface naming style. Mx.Core.Repeater the following table describes chan...

  • Page 47

    Core classes 47 mx.Core.Skin* the mx.Core.Skin* classes have been renamed to use the term asset in the class name. For example, the skinsprite class is now named spriteasset, and the skinmovieclip class is now named movieclipasset. These classes now implement the iflexasset interface. Mx.Core.Uicomp...

  • Page 48

    48 flex classes createemptyobject() removed. Use the new operator and the addchild() method or other methods to add new visual objects to the display list. Createtooltip tooltipcreate currentstatechanged currentstatechange deletestyle() clearstyle() destroyobject() removed. Use the removechild() met...

  • Page 49

    Core classes 49 mouseovereffect rollovereffect mouseouteffect rollouteffect mousewheeloutside this event is now of type flexmouseevent instead of mouseevent . Notifyeffectending effectending notifyeffectplaying effectplaying popup ispopup record this event is no longer dispatched by uicomponent. Reg...

  • Page 50

    50 flex classes the alpha, scalex, and scaley properties the alpha , scalex , and scaley properties now range from 0 to 1 instead of from 0 to 100. For example, to make a uiobject 50% opaque, specify alpha=0.5 instead of alpha=50 . To stretch the object horizontally by a factor of two, specify scale...

  • Page 51

    Core classes 51 geturl() method in flex 1.5, every uiobject inherited the geturl() method from the movieclip class. This is no longer the case. You now use the navigatetourl() method in the flash.Net package, which takes a urlrequest object rather than a string for the url: navigatetourl(new urlrequ...

  • Page 52

    52 flex classes enumerated values are now constants in many cases, properties that took a predefined list of values (such as the button control’s labelplacement property taking right , left , bottom , and top ) now take class constants as well. For example, the labelplacement property can now take o...

  • Page 53

    Containers 53 mx.Core.Uitextformat the following table describes the changes to the uitextformat class: mx.Core.View the mx.Core.View class has been removed and its functionality has been distributed between the swfloader (formerly loader), scrollcontrolbase (formerly scrollview), and container clas...

  • Page 54

    54 flex classes mx.Containers.Accordion the following table describes changes to the accordion class: mx.Containers.Accordionclasses.* the accordionclasses package is now named accordionclasses. Member change description child indices the types have been changed from uint to int. Change dispatched w...

  • Page 55

    Containers 55 mx.Containers.Applicationcontrolbar the following table describes changes to the applicationcontrolbar class: mx.Containers.Box the following table describes the changes to the box class: mx.Containers.Buttonbarclasses.Buttonbarbutton this class has been moved to the mx.Controls.Button...

  • Page 56

    56 flex classes mx.Containers.Dividedbox the following table describes changes to the dividedbox class: mx.Containers.Dividedboxclasses.* the dividedboxclasses package is now named dividedboxclasses. Mx.Containers.Form the following table describes changes to the form class: mx.Containers.Formheadin...

  • Page 57

    Containers 57 mx.Containers.Formitem the following table describes changes to the formitem class: mx.Containers.Gridclasses.* the gridclasses package is now named datagridclasses. Mx.Containers.Gridrow the gridrow class now subclasses hbox instead of box. Mx.Containers.Hbox the following table descr...

  • Page 58

    58 flex classes the following table describes changes to the linkbar class: mx.Containers.Navbar the mx.Containers.Navbar class has been moved to mx.Controls.Navbar. The following table describes changes to the navbar class: mx.Containers.Panel panel containers now extend mx.Core.Container instead o...

  • Page 59

    Containers 59 mx.Containers.Tabbar the mx.Containers.Tabbar class has been moved to the mx.Controls package. The tabbar container now extends mx.Containers.Togglebuttonbar instead of mx.Containers.Navbar. The following table describes changes to the tabbar class: mx.Containers.Tabbarclasses.Tab this...

  • Page 60

    60 flex classes mx.Containers.Tile the following table describes changes to the tile class: mx.Containers.Titlewindow the following table describes changes to the titlewindow class: in flex 1.X, clicking on the close button (and only the close button) generated a click event. In flex 2, the click ev...

  • Page 61

    Controls 61 mx.Containers.Viewstack the following table describes changes to the viewstack class: when all children are removed from a viewstack, flex sets the selectedindex to -1 (was nan ). Removing children from a viewstack container now adjusts the selectedindex . If a view is removed from the f...

  • Page 62

    62 flex classes mx.Controls.Alertclasses.* the alertclasses package is now named alertclasses. Mx.Controls.Button the button class no longer inherits from simplebutton. The following table describes changes to the button class: show() the show() method now has the following signature: show(text:stri...

  • Page 63

    Controls 63 mx.Controls.Buttonbar the following table describes changes to the buttonbar class: mx.Controls.Buttonbarbutton the buttonbarbutton class has been made internal only. Mx.Controls.Calendarlayout the following table describes changes to the calendarlayout class: trueupskin selectedupskin v...

  • Page 64

    64 flex classes mx.Controls.Colorpicker the following table describes changes to the colorpicker class: mx.Controls.Combobase the following table describes changes to the combobase class: upyearbutton this property is now internal only. Upyearhit this property is now internal only. Weekdaystyledecla...

  • Page 65

    Controls 65 mx.Controls.Combobox the following table describes changes to the combobox class: mx.Controls.Datagrid the datagrid class now extends the new gridbase class, which extends the listbase class. The following table describes changes to the datagrid class: member change description alternati...

  • Page 66

    66 flex classes in flex 2, when a datagrid control’s width is not wide enough to show all columns, only the first column gets smaller. This applies to datagrid controls with a horizontal scroll policy of true or auto . In flex 1.5, datagrid controls tried to squeeze in all the columns ignoring the t...

  • Page 67

    Controls 67 mx.Controls.Datagridclasses.Datagridlistdata the following table describes changes to the datagridlistdata class: mx.Controls.Datechooser the following table describes changes to the datechooser class: member change description columnname datafield member change description background th...

  • Page 68

    68 flex classes mx.Controls.Datefield the following table describes changes to the datefield class: mx.Controls.Horizontallist the following table describes changes to the horizontallist class: weekdaystyledeclaration weekdaystylename yeardisplay this property is now internal only. Member change des...

  • Page 69

    Controls 69 mx.Controls.Hrule the following table describes changes to the hrule class: mx.Controls.Hslider the following table describes changes to the hslider class: mx.Controls.Image the following table describes changes to the image class: mx.Controls.Label the label class now extends mx.Core.Ui...

  • Page 70

    70 flex classes mx.Controls.List the following table describes changes made to the list class: mx.Controls.Listclasses.* the listclasses package name has been changed to listclasses. The class hierarchy for the list-based classes has changed, as follows: listbase +-gridbase +-datagrid +-list +-menu ...

  • Page 71

    Controls 71 mx.Controls.Listclasses.Listbase the following table describes changes to the listbase class: member change description activetabstyledeclaration selectedtabstylename alternatingrowcolors alternatingitemcolors cachedpaddingbottom this property is now internal. Cachedpaddingtop this prope...

  • Page 72

    72 flex classes mx.Controls.Listclasses.Listcellrenderer the listcellrenderer class is now named listitemrenderer. The following table describes changes to the listitemrenderer class: mx.Controls.Listclasses.Tilelistitemrenderer the following table describes changes to the tilelistitemrenderer class...

  • Page 73

    Controls 73 mx.Controls.Menu the following table describes changes to the menu class: mx.Controls.Menubar the following table describes changes to the menubar class: member change description alternatingrowcolors alternatingitemcolors cellrenderer listitemrenderer change itemclick defaulticon remove...

  • Page 74

    74 flex classes mx.Controls.Menuclasses.* the menuclasses package has been renamed menuclasses. Mx.Controls.Menuclasses.Imenudatadescriptor the following table describes changes to the imenudatadescriptor class: mx.Controls.Menuclasses.Menucellrenderer the menucellrenderer class is now named menuite...

  • Page 75

    Controls 75 mx.Controls.Popupmenubutton the following table describes changes to the popupmenubutton class: mx.Controls.Radiobutton the following table describes changes to the radiobutton class: mx.Controls.Radiobuttongroup the following table describes changes to the radiobuttongroup class: mx.Con...

  • Page 76

    76 flex classes mx.Controls.Richtexteditorclasses.* the richtexteditorclasses package is now named richtexteditorclasses. Mx.Controls.Scrollclasses.Scrollbar the following table describes changes to the scrollbar class: mx.Controls.Simplebutton the simplebutton class has been removed. Mx.Controls.Sl...

  • Page 77

    Controls 77 mx.Controls.Sliderclasses.* the sliderclasses package is now named sliderclasses. Mx.Controls.Sliderclasses.Slidertooltip the slidertooltip class is now named sliderdatatip. Mx.Controls.Textarea the following table describes changes to the textarea class: snaptoticks snapinterval thumbdr...

  • Page 78

    78 flex classes mx.Controls.Textclasses.* the textclasses package has been renamed textclasses. Mx.Controls.Textinput the following table describes changes to the textinput class: mx.Controls.Tilelist the following table describes changes to the tilelist class: maxhposition maxhorizontalscrollpositi...

  • Page 79

    Controls 79 flex 1.X: cellrenderer="prodtthumbnail" itemwidth="120" itemheight="116"> flex 2: listitemrenderer="prodthumbnail" columnwidth="120" rowheight="116"> mx.Controls.Tooltip the following table describes changes to the tooltip class: mx.Controls.Tree the following table describes changes to ...

  • Page 80

    80 flex classes mx.Controls.Treeclasses.* the treeclasses package is now named treeclasses. Mx.Controls.Treeclasses.Defaultdatadescriptor the following table describes changes to the defaultdatadescriptor class: mx.Controls.Treeclasses.Treecellrenderer the treecellrenderer class is now named treeite...

  • Page 81

    Effects 81 effects the “instance” classes (such as mx.Effects.Rotateinstance and mx.Effects.Resizeinstance) have been moved to the mx.Effects.Effectclasses package. This section describes changes to individual effects classes. In addition to the changes listed here, the effects architecture has chan...

  • Page 82

    82 flex classes mx.Effects.Effectinstance the following table describes changes to the effectinstance class: mx.Effects.Maskeffect the following table describes changes to the maskeffect class: these changes also apply to the maskeffectinstance class. Mx.Effects.Resize the following table describes ...

  • Page 83

    Effects 83 mx.Effects.Soundeffect the following table describes changes to the soundeffect class: these changes also apply to the soundeffectinstance class. Mx.Effects.Tween the following table describes changes to the tween class: mx.Effects.Tweeneffect the following table describes changes to the ...

  • Page 84

    84 flex classes events all events in the mx.Collections package were moved to the mx.Events package. In addition to the changes listed here, the events architecture has changed. For more information, see chapter 6, “events,” on page 111 . Mx.Events.Childexistencechangedevent the following table desc...

  • Page 85

    Events 85 mx.Events.Datagridevent the following table describes changes to the datagridevent class: mx.Events.Datechooserevent the following table describes changes to the datechooserevent class: mx.Events.Dividerevent the following table describes changes to the dividerevent class: member change de...

  • Page 86

    86 flex classes mx.Events.Dropdownevent the following table describes changes to the dropdownevent class: mx.Events.Eventdispatcher this class has been moved to flash.Events.Eventdispatcher and is no longer used as a mixin. Mx.Events.Flexevent the following table describes changes to the flexevent c...

  • Page 87

    Events 87 mx.Events.Listevent the following table describes changes to the listevent class: mx.Events.Listitemselectevent the following table describes changes to the listitemselectevent class: mx.Events.Lowlevelevents this class has been removed. Mx.Events.Menuevent the following table describes ch...

  • Page 88

    88 flex classes mx.Events.Mouseevent the mouseevent class is now called flexmouseevent. Do not confuse this with the flash.Events.Mouseevent class, which still exists. The following table describes changes to the mx.Events.Mouseevent class: mx.Utils.Events.Objectevent the objectevent class is now na...

  • Page 89

    Formatters 89 mx.Events.Treeevent the following table describes changes to the treeevent class: mx.Events.Uieventdispatcher this class has been removed. Formatters this section describes changes to formatters. Mx.Formatters.Dateformater the dateformatter pattern string can contain other text in addi...

  • Page 90

    90 flex classes the following table describes the changes to the numberbase class: mx.Formatters.Switchsymbolformatter the following table describes the changes to the switchsymbolformatter class: interfaces the following table describes changes to flex interfaces: member change description dsymbolf...

  • Page 91

    Managers 91 managers this section describes changes to flex classes in the mx.Managers package. Mx.Managers.Depthmanager this class has been removed. Ifocusmanager removed. Refer to mx.Managers.Focusmanager instead. Ifocusmanagercontainer mx.Managers.Ifocusmanagercontainer ihistorystate mx.Managers....

  • Page 92

    92 flex classes mx.Managers.Dragmanager instead of setting event.Handled inside the dragenter event listener, you must call the dragmanager.Acceptdragdrop(event.Target) method. You cannot set the action property of the event object. Instead, you must call the setfeedback() method. For example, chang...

  • Page 93

    Managers 93 mx.Managers.Popupmanager the following table describes changes to the popupmanager class: mx.Managers.Systemmanager the systemmanager class now implements the isystemmanager interface. The following table describes changes to the systemmanager class: member change description closebutton...

  • Page 94

    94 flex classes media controls this section describes changes to media controls in flex 2. Mx.Controls.Mediadisplay the mediadisplay control has been replaced by the mx.Controls.Videodisplay control. The api is the same, but it does not support mp3 files. Mx.Controls.Mediacontroller the mediacontrol...

  • Page 95

    Service tags 95 mx.Print.Printjobtype the following table describes the changes to the printjobtype class: resources this section provides information about changes to classes in the mx.Resources package. Mx.Resource.* the mx.Resource package is now named mx.Resources. Service tags this section desc...

  • Page 96

    96 flex classes mx.Servicetags.Remoteobject the remoteobject class was moved to mx.Rpc.Remoting.Remoteobject. It now extends the mx.Rpc.Abstractservice class. The following table describes changes to the remoteobject class: all remoteobject sources need destination entries in the flex-services.Xml f...

  • Page 97

    Skins 97 callback urls callback urls are no longer necessary in flex 2. Use messaging channels with endpoint mappings instead. Skins this section describes changes to flex classes in the mx.Skins package. For more information, see “using skinning” on page 124 . Mx.Skins.Halo.Rectborder this class is...

  • Page 98

    98 flex classes states this section provides information about changes to classes in the mx.States package. Mx.States.Addchild the following table describes changes to addchild class: mx.States.Seteventhandler the following table describes changes to seteventhandler class: mx.States.Setproperty the ...

  • Page 99

    Validators 99 utilities this section provides information about changes to classes in the mx.Utils package. Mx.Utils.Xmlutil the following table describes changes to xmlutil class: validators this section provides information about changes to classes in the mx.Validator package. Mx.Validator.Validat...

  • Page 100

    100 flex classes.

  • Page 101

    101 4 chapter 4 data providers this topic describes migrating data providers, including the dataprovider property of flex controls and the ways you access and manipulate the data represented by the dataprovider property. For detailed information on using data providers in flex 2, see chapter 7, “usi...

  • Page 102

    102 data providers the following information briefly describes major migration issues: ■ because the dataprovider interface has been replaced by methods of the collection classes, controls that have dataprovider properties do not include any of the dataprovider interface methods, such as getitemat()...

  • Page 103

    103 ■ the tree , menu , menubar , and popupmenubutton controls, now use a data descriptor class to access and manipulate control-specific information, such as menu item type, that is contained in the data provider. Tree controls require a class that implements the itreedatadescriptor interface, and ...

  • Page 104

    104 data providers.

  • Page 105

    105 5 chapter 5 binding this topic describes the steps required to convert properties in your applications to be usable as the source for a data binding expression in adobe flex. For more information binding, see chapter 5, “using metadata tags in custom components,” in creating and extending flex 2...

  • Page 106

    106 binding the tag must be a top-level tag in flex 1.5, you could place the tag in a flex container. In flex 2.0, the tag must be a top-level tag in the mxml file. For example: flex 1.X: flex 2: binding from a property to make properties usable as the source for a data binding expression in flex 2,...

  • Page 107

    Binding from a property 107 the flex compiler automatically generates an event named propertychange for all public properties so the properties can be used as the source of a data binding expression. In this case, specifying the [bindable] metadata tag with no event is the same as specifying the fol...

  • Page 108

    108 binding the following is a flex 2 example of a getter/setter pair that uses the [bindable] metadata tag: // define private variable. Private var _maxfontsize:number = 15; [bindable(event="maxfontsizechanged")] // define public getter method. Public function get maxfontsize():number { return _max...

  • Page 109

    Binding from a property 109 dispatching binding events from a custom component to dispatch an event to trigger data binding for a property, the property’s class must either extend eventdispatcher or implement the ieventdispatcher interface. Be sure to update the object that is passed to the dispatch...

  • Page 110

    110 binding binding with flex component properties you can no longer use all properties of flex components as the source of a data binding expression without extending those controls. Properties of flex components that can be used as the source of a data binding expression contain the following desc...

  • Page 111

    111 6 chapter 6 events this topic describes changes to the adobe flex 2 event model for developers who are migrating flex applications. Contents about events . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . .112 component startup...

  • Page 112

    112 events about events the following list is a general overview of the changes to the event model. Review all event handling in your flex application by using these guidelines. ■ all event objects are either of type event or a subclass of event. You should explicitly declare or cast them to their a...

  • Page 113

    Migrating the event object 113 migrating the event object this section describes migration issues related to accessing the event object. Using the event object the event object is no longer of type object. It is now of type flash.Events.Event. Specify a stricter type in functions, as follows: privat...

  • Page 114

    114 events if you try to call another method on the target (for example, the getstyle() method), flex returns an error. The getstyle() method is a method of uicomponent, a subclass of displayobject. Therefore, you must cast event.Target to uicomponent before calling the getstyle() method, as the fol...

  • Page 115

    Using function listeners 115 to find the appropriate static constant for your event type, see the events section of the control’s entry in adobe flex 2 language reference. Using function listeners when migrating, convert all object event listeners to function event listeners. You can no longer pass ...

  • Page 116

    116 events you must also change your code if you created a custom event handler class and defined a handleevent() method that listened for all events. Flex implicitly registered this method as a handler for all events. Functions named handleevent() no longer catch all events by default as they did i...

  • Page 117

    Keyboard events 117 maintaining scope previously, you used the mx.Utils.Delegate class to provide access to the document scope within an event handler. You would pass the delegate object into a call to the addeventlistener() method so that the listener would execute in that scope. This is no longer ...

  • Page 118

    118 events.

  • Page 119

    119 7 chapter 7 styles and skinning this topic describes styleable objects; new skinning workflow; and css rules. For information about changes to individual classes such as programmaticskin, see chapter 3, “flex classes,” on page 41 . Contents using styles . . . . . . . . . . . . . . . . . . . . . ...

  • Page 120

    120 styles and skinning using the stylemanager when you use the stylemanager to apply styles to entire classes, you must now access the class with the getstyledeclaration() method. For example: flex 1.X: stylemanager.Styles.Button.Setstyle("color","red"); flex 2: stylemanager.Getstyledeclaration("bu...

  • Page 121

    Using styles 121 changed style properties the following table shows changes to the css style property names: missing style properties if you applied a style property to a component that did not support that style property, flex would fail silently. Now, flex enforces style setting and throws compila...

  • Page 122

    122 styles and skinning the following are the valid color value formats in css: .B1 { color: red; } .B2 { color: #66cc66; } .B3 { color: rgb(22%,22%,77%); } .B4 { color: rgb(255,0,0); } .B5 { color: "0xffff00"; } the following are the invalid color value formats in css: .B6 { color: 0xffff00; } /* r...

  • Page 123

    Using styles 123 for example: // the following class selector fails in flex 2 if // there is no associated class: myclass { color: red; } // the following class selector works fine in flex 2: .Myotherclass { color: red; } you must include the period when you use the getstyledeclaration() method. Glo...

  • Page 124

    124 styles and skinning using units flex no longer supports using the plus (+) and minus (-) unit modifiers. Flex no longer supports the em and ex unit types. Using skinning previously, you defined graphical skins as symbols in a fla file, exported the fla file as a swc file from the flash ide, and ...

  • Page 125

    Using skinning 125 skinning assets the assets that flex includes for you to use as a basis for reskinning components are changed. Drawing programmatic skins the drawing methods are moved to the graphics class, which is accessible through the graphics property. For example, in flex 1.X: function draw...

  • Page 126

    126 styles and skinning using embedded fonts you mjust use some differences in the syntax for embedded fonts. In addition, the default font manager is changed. The default font manager is actually both the batik font manager and the jre font manager. You set them in the list of font managers in the ...

  • Page 127

    Themes 127 in flex 1.5, you could use the following syntax to embed a bold italic font face: @font-face { src: url("gothicbi.Ttf"); font-style: italic; font-weight: bold; font-family: myfont; } .Mystylebolditalic { font-family: myfont; } in flex 2, you still use the @font-face rule to embed the font...

  • Page 128

    128 styles and skinning.

  • Page 129

    129 8 chapter 8 behaviors this topic describes the new architecture for behaviors in macromedia flex and syntax changes from flex 1.5. For detailed information, see chapter 17, “using behaviors,” in the flex 2 developer’s guide and chapter 15, “creating effects,” in creating and extending flex compo...

  • Page 130

    130 behaviors overview flex implements effects using an architecture in which each effect is represented by two classes: ■ factory class creates an object of the instance class to perform the effect on the target. You create instances of the factory class in your application, and configure it with t...

  • Page 131

    New behaviors syntax 131 new behaviors syntax this section describes the syntax changes to behaviors. The name property is now the id property you now use the id property with effects, instead of the name property: flex 1.5: flex 2: the tag is no longer necessary the tag is no longer necessary in fl...

  • Page 132

    132 behaviors use binding in mxml to specify the effect in flex 1.5, you assigned the effect to an effect trigger property with no data binding: in flex 2, you use data binding to assign an effect to a target: creationcompleteeffect="{mywl}"/> creationcompleteeffect="{mywl}"/> the show property is n...

  • Page 133

    New behaviors syntax 133 change to the range of several effect properties for the zoom, fade and dissolve effects, the range of the alpha , scalex , scaley , zoomheightfrom , zoomwidthfrom , zoomheightto , and zoomwidthto properties have changed. You used to set these values as percentages using int...

  • Page 134

    134 behaviors new events for effect classes you can now associate event listeners with effects, rather than with effect targets. All effect classes now support the following event types: effectstart dispatched when the effect starts playing. The type property of the event object for this event is se...

  • Page 135

    135 9 chapter 9 data services this topic describes how to migrate httpservice, webservice, and remoteobject components. Contents about data services . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 135 migrating httpservice components . . . . ...

  • Page 136

    136 data services flex 2 separates the definitions of services into a new file, services-config.Xml. This file contains definitions of the services and security constraints that were previously in the flex- config.Xml file. Optionally, it can include other configuration files by reference. The servi...

  • Page 137

    Migrating remoteobject components 137 channels are defined in the channels section of the services-config.Xml file. There are several predefined channels that you can assign to your rpc service destinations. For more information about channels, see chapter 43, “configuring data services,” in the fle...

  • Page 138

    138 data services the syntax for statefulness has changed. In flex 1.5, you set the type to either stateless- class or stateful-class . In flex 2, you set the scope attribute to application , session , or request . The default was stateless-class , and is now request , which is equivalent to statele...

  • Page 139

    Migrating remoteobject components 139 named remoteobject this section describes how to migrate your named remoteobject tags from flex 1.5 to flex 2. Flex 1.5 syntax in flex 1.5, you used the named attribute to identify which named remoteobject to use. Mxml tag: flex-config.Xml file: samples.Explorer...

  • Page 140

    140 data services migrating httpservice components this section describes how to migrate your httpservice from flex 1.5 to flex 2.0 syntax. For httpservice tags, you specify the url of the service in the url property of the tag. The following examples shows and httpservice tag that contacts a servic...

  • Page 141

    Migrating httpservice components 141 flex 1.5 syntax in flex 1.5, you added a url pattern to the whitelist that matched the url of the httpservice tag. Mxml tag: flex-config.Xml file: http://myserver.Com/services/* flex 2 syntax in flex 2, the mxml tag syntax is almost the same, but you must also se...

  • Page 142

    142 data services named httpservice this section describes how to migrate named httpservice tags from flex 1.5 to flex 2 syntax. Flex 1.5 syntax in flex 1.5, a named httpservice was defined as a named whitelist entry in the service-proxy> section. You used the servicename attribute of the httpservic...

  • Page 143

    Migrating webservice components 143 migrating webservice components the default value of the useproxy property is false . The webservice tags are now configured in the section of the services-config.Xml file or a file that it includes by reference. They were previously described in the section of th...

  • Page 144

    144 data services mxml tag: useproxy="true"/> services-config.Xml file: {context.Root}/services/contactmanagerws?Wsdl {context.Root}/services/contactmanagerws named webservice this section describes how to migration your named webservice tags from flex 1.5 to flex 2. Flex 1.5 syntax in flex 1.5, you...

  • Page 145

    Migrating secure data services 145 flex 2 syntax in flex 2, you refer to named webservices with the destination attribute of the tag. In the configuration file, you define the location of the wsdl file and the endpoint as part of the service destination. Mxml tag: services-config.Xml file: {context....

  • Page 146

    146 data services flex 1.5 syntax in flex 1.5, you specified run-as credentials as user and password attributes to pass through credentials to a service. Flex-config.Xml file: http://somewhere.Com/webservice.Wsdl http://somewhere.Com/myservice flex 2 syntax in flex 2, you set the remote-username and...

  • Page 147

    Migrating secure data services 147 migrating services that use basic authentication for basic authentication, you must change the value of the security constraint’s url-pattern in the web.Xml file. This section assumes that you have already migrated the service’s destination, as described in previou...

  • Page 148

    148 data services flex 2 syntax in flex 2, you specify the uri of the channel endpoint for which you want to require authentication as the url-pattern . You use the value of the channel definition’s endpoint uri in the services-config.Xml file. The boldface text in the following example shows a uri ...

  • Page 149

    Migrating secure data services 149 flex 1.5 syntax in flex 1.5, you specified the type of authentication and the role in the named service definition in the flex-config.Xml file: true sampleusers flex 2 syntax in flex 2, you define the security constraint in the services-config.Xml file: ... // dest...

  • Page 150

    150 data services login commands for custom authentication, flex uses a custom login adapter, known as a login command, to check a principal’s credentials and let that principal log into the application server. A login command must implement the flex.Messaging.Security.Logincommand api. Flex 1.5 and...

  • Page 151

    Mapping java types for remoteobject 151 object.Registerclass() is not available in flex 2. Actionscript 3 provides the flash.Net.Registerclassalias. To simplify using this class flex 2, you can specify a remote class in the [remoteclass(alias="remoteclassname")] metadata tag above the class definiti...

  • Page 152

    152 data services accessing request/response data with remoteobject a java object that you call using the tag has access to request, response, and servlet data. For flex 1.5, from within a java object, you can call the following methods: in flex 2, this api no longer exists. The flex.Messaging.Flexc...

  • Page 153

    153 1 0 chapter 10 configuration and command line tools the flex-config.Xml file has undergone significant changes for adobe flex 2. In addition, the mxmlc, compc, and fdb utilities are also changed. This topic describes these changes. Contents configuration files. . . . . . . . . . . . . . . . . . ...

  • Page 154

    154 configuration and command line tools configuration files the flex server relied on configuration files in the web-inf/flex directory. The following table describes changes to those configuration files: configuration file flex 1.5 flex 2 flash-unicode- table.Xml lists convenient mappings of the f...

  • Page 155

    Security 155 the following configuration files were renamed since flex 2 beta 2: security this section describes changes to flex security. Flex changes you do not define the security of web services and other data services in the flex-config.Xml file. You now define them in the services-config.Xml a...

  • Page 156

    156 configuration and command line tools command-line compilers the mxmlc and compc compilers are changed for flex 2. This section describes these changes. Mxmlc the mxmlc utility compiles swf files from your mxml and actionscript files. The mxmlc options that are no longer available include the fol...

  • Page 157

    Command-line compilers 157 in addition, because the data services subsystem changed, mxmlc no longer takes the following options: ■ gatewayurl ■ gatewayhttpsurl ■ proxyurl ■ proxyhttpsurl ■ proxyallowurloverride ■ remoteallowurloverride ■ webserviceproxydebug the maximum value for the default-script...

  • Page 158

    158 configuration and command line tools fdb debugger this section describes changes to the fdb debugger. For more information on using fds, see chapter 12, “using the command-line debugger,” in building and deploying flex 2 applications. Swd files the fdb debugger no longer uses swd files. Instead,...

  • Page 159

    Fdb debugger 159 run command on windows, you can enter either run foo.Swf , in which case fdb launches flash player, or run , in which case fdb displays the “waiting for player to connect” message; at that point, you must manually launch flash player. On the macintosh, the run foo.Swf command is no ...

  • Page 160

    160 configuration and command line tools.

  • Page 161

    161 1 1 chapter 11 customizing components this topic describes modifications to the process of creating components in actionscript in adobe flex. This topic only contains an overview of the major changes to the process from flex 1.5 to flex 2.0. For detailed information on creating custom components...

  • Page 162

    162 customizing components specifying the package define your custom components within an actionscript package. The package reflects the directory location of your component within the directory structure of your application. Package mycomponents { // class definition goes here. } defining the class...

  • Page 163

    Renamed invalidatestyle() 163 overriding a method if the method is overriding a method in a superclass, add the override keyword as the first attribute: override public function createchildren():void if the getter/setter is overriding a getter/setter in a superclass, add the override keyword as the ...

  • Page 164

    164 customizing components.

  • Page 165

    165 1 2 chapter 12 additional migration issues this topic describes miscellaneous migration issues, including charting and runtime shared libraries (rsls). Contents historymanager . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 165 ch...

  • Page 166

    166 additional migration issues skins skins are now called renderers. For example, the candlestickskin class is now candlestickrenderer. Renderers some functionality for the axisrenderer was moved to other axis objects. The labelfunction property, which was a property of axisrenderer, is now a prope...

  • Page 167

    Charting 167 in flex 2, you set the value of the series’ itemrenderer property to a skin class that draws the chartitem’s icon: in addition, you can no longer use the assetrenderer to use graphics in your charts. Instead, you must use a class that implements the idataobject interface. Binding in man...

  • Page 168

    168 additional migration issues legends you now enclose the data provider for legend controls in curley braces; for example: flex 1.X: ... Flex 2: ... Interfaces all chart interfaces now follow the i* naming scheme, as the following table shows: flex 1.X name flex 2 name boxrenderer iboxrenderer are...

  • Page 169

    Cell renderers 169 cell renderers in flex 1.5, a cell renderer had to implement the setvalue() method to access the data passed to the cell renderer: backgroundalpha="0"> function setvalue(str:string, item:object) { // set values of the cell renderer controls. } backgroundalpha="0"> function setvalu...

  • Page 170

    170 additional migration issues validators in flex 1.5, validators were usually triggered in response to an update of the destination of a data binding expression. You typically assigned the validator to the destination of a data binding expression, and triggered the validation when the destination ...

  • Page 171

    Validators 171 in actionscript, you can use the following constants: ■ creditcardvalidatorcardtype.American_express ■ creditcardvalidatorcardtype.Diners_club ■ creditcardvalidatorcardtype.Discover ■ creditcardvalidatorcardtype.Mastercard ■ creditcardvalidatorcardtype.Visa deprecated methods, propert...

  • Page 172

    172 additional migration issues embedding resources in flex 1.5, embedded resources were bound to strings that were used to reference the individual images by name. Although the preferred method of embedding resources in flex 2 uses class variables, you can still use string variables for some level ...

  • Page 173

    173 1 3 chapter 13 migration patterns this topic describes some common patterns in migrating actionscript in adobe flex applications. Contents instantiating flex controls. . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . . 174 using mixins. . . . . . . . ...

  • Page 174

    174 migration patterns instantiating flex controls in flex 1.X, you created a flex control in actionscript by first including a reference to that control, and then using the createemptyobject() , createchild() , createchildren() , createchildatdepth() , or createclasschildatdepth() method. These met...

  • Page 175

    Using mixins 175 using mixins you can no longer attach a function to a class, unless that class has prior knowledge of that function. For example, you can no longer do this: uicomponent.Prototype.Dosomething = myfunction or this: datagridinstance.Dosomething = myfunction you can still declare a func...

  • Page 176

    176 migration patterns variable enumeration and object introspection in flex 1.X (actionscript 2.0), using a for-in loop on an object let you enumerate over all properties on an object. In flex 2 (which uses actionscript 3.0), only dynamically added properties are enumerated by for-in loops. Declare...

  • Page 177

    Variable enumeration and object introspection 177 // list accessors as properties: for each (var a:xml in classinfo..Accessor) { ta1.Text += "property " + a.@name + "=" + button1[a.@name] + " (" + a.@type +")"; } // list the object's methods: for each (var m:xml in classinfo..Method) { ta1.Text +=...

  • Page 178

    178 migration patterns using the drag-and-drop feature when you convert drag-and-drop code, be aware of the following changes: ■ the dodrag() method takes an additional required attribute, mouse_event . This attribute is the mouseevent object that contains the mouse information for the start of the ...

  • Page 179

    Using the drag-and-drop feature 179 flex 2: import mx.Managers.Dragmanager; // import events package for mouseevent: import mx.Events.*; // specify types for all arguments: function dragit(event:mouseevent, text:string, format:string) { var ds:mx.Core.Dragsource = new mx.Core.Dragsource(); ds.Adddat...

  • Page 180

    180 migration patterns other issues in addition to the changes shown here, you might also encounter the issues described in this section when you convert drag-and-drop code. Accessing event targets because a textarea control uses a flash textfield control, and mouse events are dispatched by flash pl...

  • Page 181

    Using the drag-and-drop feature 181 controlling the feedback indicator to control the feedback indicator that accompanies a drag proxy, you now use the new showfeedback() and getfeedback() methods of the dragmanager class. The indicator shows what happens if you try to drop the item; for example, a ...

  • Page 182

    182 migration patterns using timer the setinterval() and clearinterval() methods were deprecated in favor of the timer class. You can still use these methods; they are in the flash.Util package. When you use timers, keep the following in mind: ■ when a timer is first created with the new operator, i...

  • Page 183

    Accessing request data 183 using the preloader the application container supports an application preloader that uses a download progress bar to show the download progress of an application swf file. By default, the application preloader is enabled. The preloader keeps track of how many bytes are dow...

  • Page 184

    184 migration patterns in flex 2, you must use the application.Application.Parameters property to get the values of these variables. The parameters property is an object, which is a dynamic class that you can use to store name and value pairs pass in as flashvars variables. The following example set...