5 Replies Latest reply on Sep 9, 2010 1:26 AM by Maximist

    property.state doesn't work

    Maximist Level 1

      Hallo everybody. I am using Flash Builder not since much time but i learned basilar things.. One of these things is that if i have a flex component and in my applications i have 2 states, state1 and state2, if i want to change a property (es. width) of that component in state1 and i wish it can be different in state2 i can write like this:

       

      width.state1

      width.state2

       

      This works always. Now, i just created my own component. The name of this component is "mioPannello":

       

       

      <?xml version="1.0" encoding="utf-8"?>

      <s:Panel xmlns:fx="http://ns.adobe.com/mxml/2009"

      xmlns:s="library://ns.adobe.com/flex/spark"

      xmlns:mx="library://ns.adobe.com/flex/mx">

       

       

      <fx:Declarations>

      <!-- Place non-visual elements (e.g., services, value objects) here -->

      </fx:Declarations>

       

       

      <fx:Script>

           <![CDATA[

                public var rett_titolo_bottom:int;

                public var rett_centrale_top:int;

                public var rett_centrale_bottom:int;

                public var font_label:Number;

      ]]>

      </fx:Script>

      </s:Panel>

       

       

       

      As you can see, i just created my 4 properties which i will use in my own skin. The name of this skin is "mioPannello_skin":

       

       

       

      <s:SparkSkin xmlns:fx="http://ns.adobe.com/mxml/2009"

          xmlns:mx="library://ns.adobe.com/flex/mx"

          xmlns:s="library://ns.adobe.com/flex/spark" width="100%" height="100%" bottom="0" creationComplete="aCreazioneCompletata(event)">

       

          <s:states>

              <s:State name="normal" />

              <s:State name="disabled" />

          </s:states>

       

          <fx:Metadata>

              [HostComponent("componenti.mioPannello")]

          </fx:Metadata>

       

      <fx:Script>

      <![CDATA[

       

      import componenti.mioPannello;

       

      import mx.collections.ArrayList;

      import mx.events.FlexEvent;

       

       

      [Bindable]

      public var font_label:Number;

       

       

      public function aCreazioneCompletata(event:FlexEvent):void

      {

           this.rett_titolo.bottom = hostComponent.rett_titolo_bottom;

           this.rett_centrale.top = hostComponent.rett_centrale_top;

           this.rett_centrale.bottom = hostComponent.rett_centrale_bottom;

           this.font_label = hostComponent.font_label;

      }

      ]]>

      </fx:Script>

       

      <s:Rect id="rett_sfondo" height="90%" width="100%" bottom="0">

      <s:fill>

      <s:SolidColor color="#BDCCD4"/>

      </s:fill>

      </s:Rect>

       

       

      <s:Rect id="rett_centrale" height="100%" width="90%" horizontalCenter="0">

      <s:stroke>

      <s:SolidColorStroke caps="none" color="#FFFFFF" joints="miter" miterLimit="10" weight="1"/>

      </s:stroke>

          </s:Rect>

       

       

          <s:Rect id="rett_titolo" alpha="0.71" height="100%" width="80%" top="0" horizontalCenter="0">

          <s:fill>

          <s:SolidColor color="#E8EBF2"/>

          </s:fill>

          </s:Rect>

       

       

          <s:Label id="titleDisplay"

      top="5"

          color="#FFFFFF"

          fontWeight="bold"

          fontFamily="Myriad Pro" fontSize="{font_label}"

          horizontalCenter="0"/>    

       

      </s:SparkSkin>

       

       

       

      When i call my component in my application, i can set property values in this way:

       

       

      <componenti:mioPannello width="100%" height="100%" title="panel title" skinClass="skins.mioPannello_skin" rett_titolo_bottom="15" rett_centrale_bottom="10" rett_centrale_top="30" font_label="12"/>

       

       

       

      Everything works good if i have just 1 state, but if, in my application i have 2 states, state1 and state2, the code doesn't work. So, if i write:

       

      <componenti:mioPannello width="100%" height="100%" title="panel title" skinClass="skins.mioPannello_skin" rett_titolo_bottom.state2="5" rett_titolo_bottom="15" rett_centrale_bottom="10" rett_centrale_top="30" font_label="12"/>

       

      rett_titolo_bottom.state2="5" it should change in state2 (or not??) but it doesn't change... It takes always the value 15 as it is in main state.

       

      Why this thing happen??.. I though i just created a normal property... How can i change that property in each different state. I hope you understand my problem and can help me..

       

      Sry for bad english

       

      Thx for all

       

      Max