2 Replies Latest reply on Aug 9, 2010 1:40 AM by Vie Bone

    set alpha.state with as3

    Vie Bone Level 1

      Hello!

       

      Someone know if there is a way to set a property of a dynamic created spark object for a specific state via as3

       

      Some thing like this:

       

      <s:SkinnableContainer id="mycontainer" alpha.state1 = "0">

       

      </SkinnableContainer>

       

      But via AS3

       

      var sc:SkinnableContainer = new SkinnableContainer();

       

      sc.state1.alpha = 0;

       

      Obviously the code above is wrong, but i was trying to find the way to do that.

       

      Thanks a lot.

        • 2. Re: set alpha.state with as3
          Vie Bone Level 1

          Thanks, very helpful.

           

          I add some post that talks about the same problem and was helpful for me:

           

          http://blogs.adobe.com/flexdoc/2010/08/creating-flex-view-states-in-actionscript.html#comm ent-506

           

          http://www.andymcintosh.com/?p=5

           

          http://forums.adobe.com/message/1868208#1868208

           

          http://livedocs.adobe.com/flex/3/langref/mx/states/SetProperty.html

           

          I solved my problem doing this:

           

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

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

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

          xmlns:mx="library://ns.adobe.com/flex/mx" height="100%" width="100%" creationComplete="loadXML()" >

           

          <fx:Metadata>

          [Event(name="menuItemSelected", type="MenuItemSelectedEvent")]

          </fx:Metadata>

           

          <fx:Script>

          <![CDATA[

          import mx.controls.Alert;

          import mx.states.*;

           

          import spark.components.Label;

          import spark.components.VGroup;

           

          private var xmlData:XML;

           

          private var s1:State;

           

          private var vGroupArr:Array = new Array();

           

          protected function loadXML():void

          {

          var urlrequest:URLRequest = new URLRequest("../data/categories.xml");

          var urlloader:URLLoader = new URLLoader();

          urlloader.addEventListener(Event.COMPLETE, urlLoaderComplete);

          urlloader.load(urlrequest);

          }

           

          protected function urlLoaderComplete(evt:Event):void

          {

          xmlData = new XML(evt.target.data);

          addElements();

           

          }

           

          protected function addElements():void

          {

          var categories:XMLList = xmlData.category;

           

          s1 = new State();

          s1.name = "DEFAULT_STATE";

          states = new Array();

          states.push(s1);

           

           

          for each (var e:XML in xmlData.elements()){

           

          //Create MXML Objects

          var categoryButton:Label = new Label();

          var projectsGroup:VGroup = new VGroup();

           

          //Add properties to the label

          categoryButton.id = e.@id;

          categoryButton.name = e.@name;

          categoryButton.text = e.@name;

          categoryButton.buttonMode = true;

          categoryButton.addEventListener(MouseEvent.CLICK,expandSubMenu);

           

          //Add new element to the container

          navigationContainer.addElement(categoryButton);

           

          //Add properties to the VGroup

          projectsGroup.id = "submenu_" + e.@name;

          projectsGroup.paddingLeft = 15;

          projectsGroup.gap = 0;

          vGroupArr.push(projectsGroup);

           

          //Set default properties for the defoult_state

          s1.overrides.push(new SetProperty(projectsGroup,"alpha",0));

          s1.overrides.push(new SetProperty(projectsGroup,"height",0));

           

          //Create each submenu states

          s1 = new State();

          s1.name = e.@name;

          states.push(s1);

           

           

          //Loop for the projects of each category

          for each (var o:XML in xmlData.category[e.childIndex()].elements())

          {

          //Create the project label and asign properties to it

          var projectButton:Label = new Label();

          projectButton.id = o.@id;

          projectButton.name = o.@name;

          projectButton.text = o.@name;

          projectButton.buttonMode = true;

          projectsGroup.addElement(projectButton);

          projectButton.addEventListener(MouseEvent.CLICK,menuClickHandler);

          }

           

          }

           

           

          if(!currentState) currentState = "DEFAULT_STATE";

           

          setStates();

           

           

          }

           

          protected function setStates():void

          {

          for(var z:Number = 0; z < vGroupArr.length; z++)

          {

           

          for(var x:Number = 1; x < states.length-1; x++)

          {

          if(("submenu_" + states[x].name) != vGroupArr[z].id)

          {

          states[x].overrides.push(new SetProperty(vGroupArr[z],"alpha",0));

          states[x].overrides.push(new SetProperty(vGroupArr[z],"height",0));

          }else

          {

          //Alert.show("submenu_" + states[x].name + " == " + vGroupArr[z].id );

          }

          }

          }

           

          }

           

          protected function expandSubMenu(event:MouseEvent):void

          {

          var eventName:String = event.currentTarget.name;

          currentState=(currentState == eventName) ? "DEFAULT_STATE" : eventName ;

          Alert.show(states[0].overrides);

          }

           

           

          protected function menuClickHandler(event:MouseEvent):void

          {

          //trace(event.target.id);

          var menuEvent:MenuItemSelectedEvent = new MenuItemSelectedEvent(MenuItemSelectedEvent.MENU_ITEM_SELECTED, event.target.id);

          dispatchEvent(menuEvent);

          }

           

          ]]>

          </fx:Script>

           

          <!-- STATES -->

          <!--

          <s:states>

          <s:State name="allCollapsed"/>

          <s:State name="subMenu1Expanded"/>

          <s:State name="subMenu2Expanded"/>

          </s:states>

          -->

           

          <!-- TRANSITIONS -->

           

           

          <!-- CONTENT -->

          <s:Group>

          <!-- Background -->

          <s:Rect top="5" bottom="5" left="5" right="5>

          <s:fill>

          <s:SolidColor color="0x222222"/>

          </s:fill>

          <s:stroke>

          <s:SolidColorStroke color="0x444444" weight="2"/>

          </s:stroke>

          </s:Rect>

           

          <!-- Menu Items -->

          <s:VGroup id="navigationContainer" paddingBottom="15" paddingLeft="15" paddingRight="15" paddingTop="5" gap="0"> <!-- gap must be 0; see note in CSS file -->

           

           

          </s:VGroup>

           

          </s:Group>

          </s:Group>