Search Flex Samples

Understanding Flex 3 Migration Issues (Part I)

Flex 3 was released along with AIR 1.0 last Monday. Yipee! We’ve so far heard several customers who are looking for an official migration guide for getting their Flex 2 applications to work in Flex 3. I’m sorry to say that there isn’t an official migration guide. The reason is because from Flex 2 to 3, there were very few (if any) API changes. It was a MUCH bigger transition for applications going from Flex 1.5 to 2.0 when our product went through a huge API scrub and move to Actionscript 3.0.

Still, some of you may be finding that your application doesn’t quite behave the same or look the same in Flex 3.0. For these problems, your best two resources would be two backwards compatibility docs provided by Adobe’s doc team

This document provides a list of changes in the Flex Framework that are supported by the a backwards compatibility flag in the compiler (-compatibility-version=2.0.1). For example, padding in Button never worked correctly before Flex 3. So, we fixed it. However, some people who may rely on the old measurement logic of the Button may not want to change their code to work with Flex 3’s padding changes. In your application, you can bring back the old behavior in Flex 2.0.1 by compiling their applications with the additional compiler argument -compatibility-version=2.0.1. However, beware, using the backwards compatibility flag is a “all or nothing” situation. If you compile your application with this flag, you will bring back all of the 2.0.1 behavior in the above document. You cannot pick and choose which compatibility changes to revert back.

There is also one document of backwards compatibility changes that are not supported by the -compatibility-version compiler argument. These changes come with Flex 3 and you need to live with it.

For this week, I thought I would post about some changes in the framework that will likely cause some differences in Flex 2 applications.

Button Changes

Issue during migration: Button labels are now truncated. For example, this code produces a truncated label in Flex 3, but, not Flex 2.

Cause of compatibility issue: In Flex 3, all Buttons have paddingLeft, paddingRight, paddingTop and paddingBottom of 10, by default. Padding styles didn’t work in Flex 2.0.1. The space to the left and right of the Button label in Flex 2.0.1 varied.

Fix: Adjust the paddingStyles. For example -

DataGrid Changes:

Issue during migration: DataGrid code that relied on rowCount does not behave the same.

Cause of compatibility issue: rowCount and lockedRowCount no longer include the header. Also, the itemClick event’s rowIndex property returns 0 for the first row of data.

Fix: Adjust your code to look for different rowCount values. Most likely, you’ll need to subtract 1 from any rowCount value used in Flex 2.0.1.

Issue during migration: You get a runtime error or wrong behavior in a custom component that subclassed DataGrid. In this subclassed component, you used MyDataGrid.getChildAt(…) to access various children of the DataGrid, like the vertical scrollbar.

Cause of compatibility issue: The order of children in the DataGrid was changed. For example, in Flex 2, MyDataGrid.getChildAt(3) used to yield the vertical scrollbar. In Flex 3, it doesn’t. MyDataGrid.getChild(4) yields the scrollbar. In general, you shouldn’t expect the order of children to stay the same. We don’t guarantee this.

Fix: If possible, don’t use getChildAt to access internal components of the DataGrid. Otherwise, adjust which child you are accessing.


Related Flex Samples

Learn Flex: Flex Samples | Flex Video Tutorials Flex Examples