Migrating custom Panel skins from Flex 2 to Flex 3 (Moxie)

In Flex 2.0.1, the Flex Panel used the HaloBorder class as its default skin. I’ve seen most custom skins for Panel that have extended either the Border or RectangularBorder class. While this worked in Flex 2.0.1, when you try to use these custom skins in Flex 3, you are just going to get one big mess. The reason for this was because the Panel now uses a new class called “PanelSkin” which is a part of the mx.halo package. This PanelSkin class extends HaloBorder and includes all of the borderMetrics and viewMetrics logic that used to be in the Panel class. This logic figures out the header height and ControlBar height and adds it to the borderMetrics. For the majority of custom Panel skins that I’ve seen that used to extend Border or RectangularBorder, you should be able to migrate your skin to work in Flex 3 with a couple of easy steps:

1. Extend PanelSkin instead of Border or RectangularBorder

2. If your skin overrides the borderMetrics getter, you should call the super getter.

I tried this out with a Flex 2 skin provided by Andrew Trice on his blog and things seemed to work fine after these minor adjustments. Good luck with your skins!

2 responses

  1. Hello I am very new to flex and I am getting this issue. I’ll be very thankfull if you can show this by an example.

    -Regards
    Vikash kumar

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s

%d bloggers like this: