2 Replies Latest reply on Dec 16, 2010 5:11 AM by cartman1138

    Skinning HELP!!!   ArgumentError: Undefined state 'doing'.

    cartman1138 Level 1

      I am dipping my toes into skinning and getting cold feet. I made a very simple component StepIndicator to show what step in a process you are on. It all seems like it should just work, but I get this error "ArgumentError: Undefined state 'doing'". Any ideas?

       


      ########### Main File

      <?xml version="1.0" encoding="utf-8"?>
      <s:Application xmlns:fx="http://ns.adobe.com/mxml/2009"
          xmlns:s="library://ns.adobe.com/flex/spark"
          xmlns:mx="library://ns.adobe.com/flex/mx" minWidth="955" minHeight="600">

          <fx:Declarations>
              <!-- Place non-visual elements (e.g., services, value objects) here -->
          </fx:Declarations>
         
          <components:StepIndicator skinClass="ArrowStepIndicator" y="0" currentState="doing"/>
          <components:StepIndicator skinClass="ArrowStepIndicator" y="40"/>
          <components:StepIndicator skinClass="ArrowStepIndicator" y="80"/>
      </s:Application>

       

      ########### StepIndicator.as

      package menu.components {
         
          import spark.components.Label;
          import spark.components.supportClasses.SkinnableComponent;

       

          [SkinState("not_done")]
          [SkinState("doing")]
          [SkinState("done")]
         
          public class StepIndicator extends SkinnableComponent {
             
              [SkinPart(required="true")]
              public var text : Label;
          }
      }

       

      ########### ArrowStepIndicator.mxml

      <?xml version="1.0" encoding="utf-8"?>
      <s:Skin xmlns:fx="http://ns.adobe.com/mxml/2009"
          xmlns:s="library://ns.adobe.com/flex/spark"
          xmlns:mx="library://ns.adobe.com/flex/mx">
          <!-- host component -->
          <fx:Metadata>
              [HostComponent("StepIndicator")]
          </fx:Metadata>
         
          <!-- states -->
          <s:states>
              <s:State name="not_done" />
              <s:State name="doing" />
              <s:State name="done" />
          </s:states>
         
          <s:Path data="M 0 0 L 10 0 L 10 29 L 0 29 L 10 15">
              <s:fill>
                  <s:SolidColor color="#55FF55"/>
              </s:fill>
          </s:Path>
          <s:Rect top="0" bottom="0" left="10" right="10">
              <s:fill>
                  <s:SolidColor color="#99FF99"/>
              </s:fill>
          </s:Rect>
          <s:Path data="M 0 0 L 10 15 L 0 29" right="0">
              <s:fill>
                  <s:SolidColor color="#55FF55"/>
              </s:fill>
          </s:Path>
         
          <s:Label id="text" paddingLeft="15" paddingRight="15" horizontalCenter="0" verticalCenter="0"/>
      </s:Skin>