Introduction

If you used Hero and Burrito, the prereleases of version 4.5 Flex and Flash Builder respectively, it's likely you'll want to pull some of your prerelease work into the final releases of Flex and Flash Builder 4.5.

Well, you have some work ahead of you. That's because Burrito projects do not import cleanly into the new Flash Builder 4.5 environment. This results from a variety of differences between Hero and the Flex 4.5 sdk — changes to class names and properties, changes to default colors, the View class now inherits from SkinnableContainer instead of Group, etc.

This post addresses several Hero/Burrito → Flex 4.5/FlashBuilder 4.5 changes and it includes tips to make your migration easier. Since this isn't an in-depth coverage of the topic I'm including links to several other "migration tips" posts and to Adobe kb's on this topic. Here are several:

• Adobe provides a guide to backward compatiblity for Flex 4.5 which is useful but not comprehensive
• Devgirl has many great posts on Flex, here is one on changes between Hero and Flex 4.5, with emphasis on class name changes
• Here is a brief but useful overview of Hero→Flex4.5 changes
• This post addresses the 'sdk "Flex Hero" does not exist' error

And here is an Adobe kb entry on importing project settings:

• http://kb2.adobe.com/cps/899/cpsid_89996.html

Finally, if you subscribe to Lynda you might want to watch its video "Importing Flex 4 projects" in its new course "Flash Builder 4.5 and Flex 4.5 New Features", though its pretty basic.

Importing a project

To start with, you shouldn't just point FB 4.5 to a Burrito workspace. Rather, you should import your project into a FB 4.5 workspace. If you have a lot of projects to migrate then you might find the import method below too labor intensive, but if like me you only have a handful of projects you need to migrate then you can "manually" import a Burrito project into Flash Builder 4.5 as follows:

1. copy your project's directory tree from your Burrito workspace into your FB 4.5 workspace
2. in FB 4.5 select File / Import Flash Builder project
3. in the "Import Flash Builder Project" window choose the "Project folder" radio button, then browse to your project (the one you just copied into your FB 4.5 workspace) and select its root dir
4. select Finish. This will display a warning "Project [your-project-name] was created in a previous version of Flash Builder". To resolve this you will need to choose the sdk you want to use. FB 4.5 comes with two Flex sdks preinstalled, 4.5 and 3.6. Select the sdk you want to use and then click on the "OK" button. BTW, if you need to use a different Flex (or AIR) sdk you can overlay it into FB, but that's beyond the scope of this post.
5. When you select OK your project will be imported but you will almost certainly see errors in the problems pane. At a minimum these will relate to changes in AIR version if you're importing a mobile project, and also to changes in class names between Hero and Flex 4.5 sdk's. Dealing with these changes is the focus of the remainder of this post.

Dealing with compiler errors when you import a Hero project

Here are a couple of common compiler errors you'll encounter when importing a Hero project.

ERROR: "Namespace 2.5.0 in the application descriptor file should be equal or higher than the minimum version 2.6.0 required by Flex SDK."

REMEDY: This is an easy one, FB 4.5 comes with AIR's sdk 2.6, not the 2.5 that was in Burrito. So, just go into your application descriptor file (the XML file with your AIR project properties) and change the XMLNS value from AIR 2.5.0 to 2.6.0. As soon as you save your changes this error should go away

ERROR: "Could not resolve <s:MobileApplication> to a component implementation."

REMEDY: This is also easy, it's caused by a change in class names. Hero's MobileApplication class was renamed to ViewNavigatorApplication in Flex sdk 4.5. So, a single rename of your app's root class is all you need, from <s:MobileApplication> to <s:ViewNavigatorApplication>

Hopefully most of the errors you encounter on import will relate to simple class name changes. A lot of Hero classes that had "Mobile" in their names were renamed (presumably Adobe realized that you'll use these classes on non-Mobile devices, maybe the desktop, and certainly on tablets). For a list of some of these class name changes see this devgirl post.

Dealing with other changes between Flex Hero and Flex 4.5

Of course, once FB can read and compile your project you aren't done, since Flex 4.5 sdk has other changes that will likely cause more errors depending on what your project is doing. For example, here are a couple more changes between Hero and Flex 4.5 you might encounter:

ERROR: "1119: Access of possibly undefined property landscapeOrientation through a reference with static type spark.components:ViewNavigator."

REMEDY: This property was dropped in 4.5. One alternative is to do your orientation check against navigator.currentState. You could also check stage.deviceOrientation.

ERROR: "1120: Access of undefined property returnedObject."

REMEDY: There are changes to how a popped view returns data to a calling view. Below is a summary of code mods you'll need to make if you used the View class returnedObject property in Burrito. For more details on how to return data when popping views in Flex 4.5 see my Primer on Flex 4.5 mobile app development.

1. In Hero you passed back data when popping a view via View's returnedObject property. In Flex 4.5 this functionality is implemented through the navigator.poppedViewReturnedObject property. So, replace any ref to returnedObject with a ref to navigator.poppedViewReturnedObject.
2. how you retrieve data from the return object has changed, as well. In Hero the return object held your data directly, so you referenced properties like: returnedObject.lastSelectedItemValue. Now the return object exposes return object data through a new property named object. So, if your popped view defines a data property "myProperty" on the return object the change would look like this:

Dealing with changes to visuals

Finally, you may also have to deal with aesthetic issues such as changes to some default colors and styles. For example, the default bgcolor for View has changed, it's now white. While you can use the backgroundColor attribute of View in your individual views, if you want to set a new default color for all views it's generally better to do this through a CSS type declaration. e.g.:

 @namespace s "library://ns.adobe.com/flex/spark";
 @namespace mx "library://ns.adobe.com/flex/mx";
 s|View 
 {
    backgroundColor: #333333; 
 }
 

Conclusion

Hopefully this approach to migrating projects from Burrito to FB 4.5 will work for you. So far I haven't encountered any side effects or other problems from this process.