1) Fix name spaces:
Search: xmlns:mx="http://www.adobe.com/2006/mxml"
Replace xmlns:fx="http://ns.adobe.com/mxml/2009" xmlns:mx="library://ns.adobe.com/flex/mx"
2) fix MetaData
Search: mx:Metadata
Replace: fx:Metadata
3) fix Script
Search: mx:Script
Replace: fx:Script
4) fix Component
Search: mx:Component
Replace: fx:Component
5) fix Bindings
Search: mx:Binding
Replace: fx:Binding
6) Declarations wrapping
All non-visual elements need to be wrapped into the Declarations Tag.
Create a Flex Template, to make this process really easy.
Declarations_multiline
<fx:Declarations>
${line_selection}
</fx:Declarations>
Declarations_singleLine
<fx:Declarations>
${word_selection}
</fx:Declarations>
Then it is just a matter of selecting the non-visual elements, hitting cntl-space and choosing the correct Declarations template
7) Adding the halo skin back into the workspace
- Copy the Halo theme into the workspace into a folder called "themes"
c:\p.f\adobe\Flashbuilder\sdk\framework\theme\Halo.swf - Flex Build Path -> Source Path -> Add Folder -> ${DOCUMENTS}\themes
- update the compiler settings to include:
-theme=Halo/halo.swc
8) Migrate the states.
This takes the most work, because there is not much automation that you can do
- Select all of the states and duplicate using cntl-alt-down
- cntl-shift-c, to comment out the duplicated code
- delete all of the nested nodes (AddChild, SetStyle, etc)
- Create a 2nd Editor View (Window -> new Editor), and adjust them so you can see both
- Keep the commented states on one side, and the version you are editing on the other
- Systematically add the state properties
- On the adds / removes, be sure to include the "includeIn" property
- Use the Flex4 state syntax for the properties and styles
- Be careful with the basedOn property of the states, you will need to make sure that your includeIn and properties reflect that as well.
*********** At this point we should be just down to warnings ***********
9) Remove warnings about the styleManager
Manually replace "StyleManager.getStyleDeclaration" with "FlexGlobals.topLevelApplication.styleManager.getStyleDeclaration"
You need to do this manually, as you will also need FlexGlobals imports. Also if you are within a visual element, you can just use styleManager instead of the static FlexGlobals property
10) Manually replace "Application.application" with "FlexGlobals.topLevelApplication"
You need to do this manually, as you will also need FlexGlobals imports.
11) You might still have some CSS warnings left, if so, you can select the Flex 3 compatibility mode within the Flex Compiler options
Some useful resources I found along the way:
No comments:
Post a Comment