Flex Bug - Programmatic Skinning!

Question

I believe I found a Programmatic Skinning bug in Flex.
Whenever I set the "borderSkin" property to a custom skin
class, the flash player hangs in all browsers, the CPU peaks around
95% and memory is consumed rapidly.
After waiting for about 10 minutes I get the following...
[SWF] C:\Documents and Settings\Chris.Simeone\My
Documents\Flex Builder 2\Skinning-Lessons\bin\gridBorders-debug.swf
- 408,071 bytes after decompression
undefined
at
mx.core::UIComponent/getClassStyleDeclarations()[C:\dev\GMC\sdk\frameworks\mx\core\UIComp onent.as:6810]
at
mx.styles::StyleProtoChain$/mx.styles:StyleProtoChain::addProperties()[C:\dev\GMC\sdk\fra meworks\mx\styles\StyleProtoChain.as:142]
at
mx.styles::StyleProtoChain$/mx.styles:StyleProtoChain::addProperties()[C:\dev\GMC\sdk\fra meworks\mx\styles\StyleProtoChain.as:173]
(FYI: The previous error line is repeated 191 times)
I tried tracing my custom skin class (by setting breakpoints)
but none of the code ever fires - the debugger never goes into the
code.
When I remove this line from my CSS file -
borderSkin:ClassReference('GridBorders'); - the application
runs fine.
To test this further I grabbed the example on the bottom of
this
page
and the same exact error occurs. Note it the "borderSkin" property
is set on the VBox tag.
I tested other programmatic skinning examples that use
upSkin, downSkin, etc and they all work fine. I only have this
problem when assigning a skin class to the "borderSkin" property.
Would someone please confirm this is bug? I followed the
Programmatic skins recipe to the letter.
Thanks
Chris Simeone

Answer 1

I found the problem. It's in my CSS file. If there's a
"borderStyle"
property as defined below the application hangs. Take out the
"borderStyle" property and the app runs.
See my test code below (FYI: it does not do much. My first
attempt at
border skinning using code)...
GRIDBORDERS.CSS » HERE'S THE PROBLEM
Application
background-color: #FFFAC7;
GridItem
borderStyle: solid;
borderSkin: ClassReference('GridBorders');
GRIDBORDERS.MXML
<?xml version="1.0"?>
<mx:Application pageTitle="Grid Borders"
xmlns:mx="
http://www.adobe.com/2006/mxml"
layout="absolute">
<mx:Style source="GridBorders.css"/>
<mx:Grid height="640" width="940">
<mx:GridRow width="100%" height="66%">
<mx:GridItem width="66%" height="100%" >
</mx:GridItem>
<mx:GridItem width="33%" height="100%" >
</mx:GridItem>
</mx:GridRow>
<mx:GridRow width="100%" height="33%" >
<mx:GridItem colSpan="2" width="100%" height="100%" >
</mx:GridItem>
</mx:GridRow>
</mx:Grid>
</mx:Application>
GRIDBORDERS.AS
package
import mx.skins.*;
import mx.containers.Grid;
import flash.display.*;
import flash.utils.*;
public class GridBorders extends Border
public function GridBorders()
super();
override protected function updateDisplayList( w:Number,
h:Number
):void
graphics.lineStyle( 15, 0xFFFF00, 0 );
graphics.beginFill( 0xFFFF00, 1.0 );
graphics.drawRect( 0, 0, 10, height );
graphics.endFill();
private var _borderMetrics:EdgeMetrics = new EdgeMetrics(1,
1, 1, 1);
override public function get borderMetrics():EdgeMetrics
return _borderMetrics;