0 Replies Latest reply on Aug 6, 2010 11:58 AM by grenvoy

    Rotate Progress Bar

    grenvoy Level 1

      I might be taking the wrong approach on this, but I want to have a component in my application that is like a box filling up.  So imagine a square progress bar that instead of filling left to right, fills bottom to top.  I figured I could use progress bar, and rotate it 270 degrees.  But when I try the following code I get the error "Component declarations are not allowed here.  (Note: visual children must implement mx.core.IUIComponent)

       

       

          <mx:Canvas cornerRadius="10" width="100%" backgroundAlpha="1" backgroundColor="white" height="100%"
                     borderThickness="1" borderColor="black" >
             
              <mx:Label text="Status" width="174" x="34" y="14" height="40" fontSize="20"/>
              <mx:Label id="FIELD_LABEL" x="44" y="56" fontSize="14" text="Station X" height="25" fontWeight="normal" width="138"/>
              <mx:TextArea x="34" y="89" width="234" height="86" borderThickness="1" borderColor="black"/>
              <mx:Label x="121" y="106" text="Processed:"/>
              <mx:Label x="126" y="130" text="Scheduled:"/>
              <mx:Text id="FIELD_PROCESSED" x="228" y="106" textAlign="right" text="###" width="26" fontWeight="bold" />
              <mx:Text id="FIELD_SCHEDULED" x="228" y="130" textAlign="right" text="###" width="26" fontWeight="bold" />
             
              <mx:Rotate id="rotate" angleFrom="{mAngle}" angleTo="{mAngle+90}" target="{FIELD_BAR}" />     
              <mx:ProgressBar id="FIELD_BAR" labelPlacement="center" textAlign="center"
                              themeColor="#EE1122" minimum="0" visible="true"
                              maximum="1000"
                              x="44"
                              y="101"
                              fontSize="8"
                              color="0x323232"
                              label="???/???"
                              direction="right"
                              barColor="#6486AC"
                              mode="manual"
                              height="60"
                              width="67"/>
             
          </mx:Canvas>