7 Replies Latest reply on Sep 15, 2006 7:09 AM by clsimeone

    Flex Bug - Programmatic Skinning!

    clsimeone
      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
        • 1. Re: Flex Bug - Programmatic Skinning!
          rvollmar Level 1
          Hello,
          You wrote that you grabbed the example on the bottom of 'this' page; could you please point me to the page you're referring to, or post a sample app.?
          - Rob
          • 2. Re: Flex Bug - Programmatic Skinning!
            clsimeone Level 1
            Hey rvollmar, thanks for your reply.

            The word "page" is a link you can click on.

            However, here's the link - http://livedocs.macromedia.com/flex/2/docs/00000816.html

            I look forward to hearing whether or not you experienced the same problem.

            Thanks,
            Chris
            • 3. Re: Flex Bug - Programmatic Skinning!
              rvollmar Level 1
              Hi Chris,
              Thanks for the link. Using Flex 2.0, I put that sample together and was able to run it without a hitch. What OS, browsers, and Flash player versions you are using? I tried it with the Flash players that shipped with 2.0, and the following OS/browser combinations:
              XP Pro, Firefox 1.5.0.6
              XP Pro, Internet Explorer 6.0.2900.2180.xpsp_sp2_gdr.050301-1519
              XP Pro, Standalone Flash player
              Mac OSX 10.4.7, Standalone Flash player

              Also, I will send you a private message with my email address. If you could send me your email address, we can exchange compiled SWF files. It would be interesting to see if my compiled file works on your systems, and vice versa.
              • 4. Re: Flex Bug - Programmatic Skinning!
                clsimeone Level 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;
                }

                }
                }
                • 5. Re: Flex Bug - Programmatic Skinning!
                  rvollmar Level 1
                  Hi Chris,
                  I had a friend look this over and he found what was going on:
                  - GridBorders.as and GridBorders.mxml are both going to create a class called GridBorders, which is bad. The mxml one takes precendence, so the entire application is being used as the border skin. Then that app. has a border skin which is the app. again, and you have a recursive situation. If you rename GridBorders.mxml to GridBordersTest.mxml, the recursion won't occur.
                  - In the .as file, mx.core.EdgeMetrics needs to be imported.
                  - Also in the .as file, graphics.clear() is needed at the top of updateDisplayList.

                  Send me your email address if you'd like me to send you some sample files.

                  - Rob
                  • 6. Re: Flex Bug - Programmatic Skinning!
                    clsimeone Level 1
                    That was it. I was able to put the borderStyle attribute back in and now the borders are drawing.

                    Good job rvollmar!! Thanks to both you and your freind.

                    Chris
                    • 7. Re: Flex Bug - Programmatic Skinning!
                      clsimeone Level 1
                      That was it. I was able to put the borderStyle attribute back in and now the borders are drawing.

                      Good job rvollmar!! Thanks to both you and your freind.

                      Chris