4 Replies Latest reply on Aug 9, 2009 5:26 AM by Nick_Hann

    Problems with changing custom properties on state change in customComponents

    Nick_Hann

      Hi together,

       

      i got a problem with skinning and custom components extending SkinnableComponent.

       

      i got an image that got a mask (DisplayObject) the mask is bind to the Components width and height.

      The image has thumbSize and a imageSize (thumb for the gallery and image to view it) the thumb size is NOT equal to the width and height

      ---/-/-/-/-/---- thumbState

      |   /       /    |

      |   /       /    |

      ---/-/-/-/-/----

       

      /-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/ imageState

      |                                                    |

      /                                                    /

      |                                                    |

      /                                                    /

      |                                                    |

      /-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/-/

       

      / = mask/components widht/height

      - = image

       

      The images are loaded dynamicly with a Loader into a BitmapImage. I want now so set a custom setter/getter method

       

      [Bindable]
      public function set thumbWidth(value:Number):void
      {
           this._thumbWidth = value;
      }
      public function get thumbWidth():Number
      {
           return this._thumbWidth;
      }
      

       

      The same for the thumbheight.

       

      My problem is now:

      When I use my skin for that component it wont accept this:

       

      <s:BitmapImage id="image" width.normal="120" width.thumb="{hostComponent.thumbWidth}" ..../>

       

      Of course I set my metadata hostComponent to the class I described above. When i use actionscript to read it out I get the expected values but not in the binding of my skin parts.

       

      Thx for your help.

        • 1. Re: Problems with changing custom properties on state change in customComponents
          David_F57 Level 5

          It looks like you are setting width for 2 states, so you need to change the state from normal to thumb for the component to accept the thumb width, unless I am missing what you are trying to do, which is highly probable

           

          David

           

          Message was edited by: David_F57- I'm assuming you have the normal and thumb states declared in your skin.

          • 2. Re: Problems with changing custom properties on state change in customComponents
            Nick_Hann Level 1

            Hi David,

             

            sorry to say but yeah u missing it. But maybe I should have gone more into details. My CustomComponent listens to a MouseEvent.CLICK so when that happens I change the current state. I override the getCurrentSkinState() function. This returns a string and u can trigger it by calling the function invalidateSkinState(). The state changing is NOT the problem. The problem is just that the return value of the function above gives me a NAN even so in actionscript it gives me a value like expected.

             

            But thx ..

             

            P.S.: I solved my issue by using a coded effect and not using a skin for it. BUT I need a component with a skin so I need to solved it sooner or later

            • 3. Re: Problems with changing custom properties on state change in customComponents
              David_F57 Level 5

              It wasn't so much that I missed it, more that I didn't look outside of the code you provided.

               

              As your code stands now the only reason I can see the binding has returned NaN is a default value wasn't set for the _thumbwidth var, so your component skin would fail on the get function which would returnwith "not a number(NaN)".

               

              i.e.

              private var _thumbWidth:Number ;

              instead of

              private var _thumbWidth:Number =0; 

               

              As for getters and setters used in this scenario they only work by writing invalidation code around your component in order to refresh the skin, this is really not that efficient. Because you already run a setter to set values why not just populate a bindable var that the skin will automatically update with.

               

              David

              • 4. Re: Problems with changing custom properties on state change in customComponents
                Nick_Hann Level 1

                Hi David,

                 

                thx for ur answers. But yeah I set the default value of course. I changed the code so much already that I dont know anymore how it happen. I goona write a app just for that issue today or tomorrow and then I gonna post the whole code here.

                 

                see ya later ... Nick