posts - 247,  comments - 25,  trackbacks - 0

视图状态切换:
<?xml version="1.0" ?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
  backgroundColor="#FFFFFF"> 
  <mx:states>
    <mx:State name="Description">
      <mx:AddChild relativeTo="{hbox1}" position="before">
        <mx:TextArea width="200" height="180"
         borderStyle="none"
         text="Lorem Ipsum is simply dummy text of the printing and typesetting industry. Lorem Ipsum has been the industry's standard dummy text ever since the 1500s, when an unknown printer took a galley of type and scrambled it to make a type specimen book. It has survived not only five centuries, but also the leap into electronic typesetting, remaining essentially unchanged. "/>
      </mx:AddChild>
      <mx:RemoveChild target="{descButton}"/>
      <mx:AddChild relativeTo="{hbox1}" position="before">
        <mx:Button label="Close Description"
         click="this.currentState=''"/>
      </mx:AddChild>
    </mx:State>
  </mx:states>
  <mx:VBox id="vbox1" borderStyle="outset" paddingLeft="5" paddingBottom="5" paddingRight="5" paddingTop="5">
    <mx:Label text="Product Name" fontWeight="bold" />
    <mx:Button label="Open Description"
     click="this.currentState='Description'"
     id="descButton"/>
    <mx:HBox id="hbox1">
      <mx:Label text="$3.99"/>
      <mx:NumericStepper id="qty" minimum="1"
       maximum="10" stepSize="1"/>
     <mx:Button label="Add to Cart"/>
    </mx:HBox>
  </mx:VBox>
</mx:Application>
使用过渡:由于状态切换过于突然,要变的温和一些

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 width="400" height="400" layout="absolute"
 verticalScrollPolicy="off" horizontalScrollPolicy="off"
 backgroundColor="#FFFFFF">
 <mx:transitions>
    <mx:Transition fromState="*" toState="*">
      <mx:Sequence targets="{[panel1,panel2,panel3]}">
        <mx:Move duration="400"/>
        <mx:Rotate angleFrom="0" angleTo="360" filter="move" />
        <mx:Resize duration="400"/>
      </mx:Sequence>
    </mx:Transition>
  </mx:transitions>
  <mx:states>
    <mx:State name="s1">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="60"/>
      <mx:SetProperty target="{panel1}" name="height" value="300"/>
      <mx:SetProperty target="{panel1}" name="width" value="390"/>
      <mx:SetProperty target="{panel2}" name="x" value="135"/>
      <mx:SetProperty target="{panel2}" name="y" value="10"/>
      <mx:SetProperty target="{panel2}" name="height" value="30"/>
      <mx:SetProperty target="{panel2}" name="width" value="125"/>
      <mx:SetProperty target="{panel3}" name="x" value="270"/>
      <mx:SetProperty target="{panel3}" name="y" value="10"/>
      <mx:SetProperty target="{panel3}" name="height" value="30"/>
      <mx:SetProperty target="{panel3}" name="width" value="125"/>
    </mx:State>
    <mx:State name="s2">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="10"/>
      <mx:SetProperty target="{panel1}" name="height" value="30"/>
      <mx:SetProperty target="{panel1}" name="width" value="125"/>
      <mx:SetProperty target="{panel2}" name="width" value="390"/>
      <mx:SetProperty target="{panel2}" name="height" value="300"/>
      <mx:SetProperty target="{panel2}" name="x" value="5"/>
      <mx:SetProperty target="{panel2}" name="y" value="60"/>
      <mx:SetProperty target="{panel3}" name="x" value="270"/>
      <mx:SetProperty target="{panel3}" name="y" value="10"/>
      <mx:SetProperty target="{panel3}" name="height" value="30"/>
      <mx:SetProperty target="{panel3}" name="width" value="125"/>
    </mx:State>
    <mx:State name="s3">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="10"/>
      <mx:SetProperty target="{panel1}" name="height" value="30"/>
      <mx:SetProperty target="{panel1}" name="width" value="125"/>
      <mx:SetProperty target="{panel2}" name="x" value="135"/>
      <mx:SetProperty target="{panel2}" name="y" value="10"/>
      <mx:SetProperty target="{panel2}" name="height" value="30"/>
      <mx:SetProperty target="{panel2}" name="width" value="125"/>
      <mx:SetProperty target="{panel3}" name="width" value="390"/>
      <mx:SetProperty target="{panel3}" name="height" value="300"/>
      <mx:SetProperty target="{panel3}" name="x" value="5"/>
      <mx:SetProperty target="{panel3}" name="y" value="60"/>
    </mx:State>
  </mx:states>
  <mx:Panel x="5" y="10" width="125" height="30" layout="absolute" title="Panel 1" id="panel1" click="this.currentState='s1'"/>
  <mx:Panel x="135" y="10" width="125" height="30" layout="absolute" title="Panel 2" id="panel2" click="this.currentState='s2'"/>
  <mx:Panel x="270" y="10" width="125" height="30" layout="absolute" id="panel3" title="Panel 3" click="this.currentState='s3'"/>
  <mx:Button x="167" y="368" label="Reset" click="this.currentState=''"/>
</mx:Application>

 




 

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 width="400" height="400" layout="absolute"
 verticalScrollPolicy="off" horizontalScrollPolicy="off"
 backgroundColor="#FFFFFF">
 <mx:transitions>
    <mx:Transition fromState="*" toState="*">
      <mx:Sequence targets="{[panel1,panel2,panel3]}">
        <mx:Move duration="400"/>
        <mx:Rotate angleFrom="0" angleTo="360" filter="move" />
        <mx:Resize duration="400"/>
      </mx:Sequence>
    </mx:Transition>
  </mx:transitions>
  <mx:states>
    <mx:State name="s1">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="60"/>
      <mx:SetProperty target="{panel1}" name="height" value="300"/>
      <mx:SetProperty target="{panel1}" name="width" value="390"/>
      <mx:SetProperty target="{panel2}" name="x" value="135"/>
      <mx:SetProperty target="{panel2}" name="y" value="10"/>
      <mx:SetProperty target="{panel2}" name="height" value="30"/>
      <mx:SetProperty target="{panel2}" name="width" value="125"/>
      <mx:SetProperty target="{panel3}" name="x" value="270"/>
      <mx:SetProperty target="{panel3}" name="y" value="10"/>
      <mx:SetProperty target="{panel3}" name="height" value="30"/>
      <mx:SetProperty target="{panel3}" name="width" value="125"/>
    </mx:State>
    <mx:State name="s2">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="10"/>
      <mx:SetProperty target="{panel1}" name="height" value="30"/>
      <mx:SetProperty target="{panel1}" name="width" value="125"/>
      <mx:SetProperty target="{panel2}" name="width" value="390"/>
      <mx:SetProperty target="{panel2}" name="height" value="300"/>
      <mx:SetProperty target="{panel2}" name="x" value="5"/>
      <mx:SetProperty target="{panel2}" name="y" value="60"/>
      <mx:SetProperty target="{panel3}" name="x" value="270"/>
      <mx:SetProperty target="{panel3}" name="y" value="10"/>
      <mx:SetProperty target="{panel3}" name="height" value="30"/>
      <mx:SetProperty target="{panel3}" name="width" value="125"/>
    </mx:State>
    <mx:State name="s3">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="10"/>
      <mx:SetProperty target="{panel1}" name="height" value="30"/>
      <mx:SetProperty target="{panel1}" name="width" value="125"/>
      <mx:SetProperty target="{panel2}" name="x" value="135"/>
      <mx:SetProperty target="{panel2}" name="y" value="10"/>
      <mx:SetProperty target="{panel2}" name="height" value="30"/>
      <mx:SetProperty target="{panel2}" name="width" value="125"/>
      <mx:SetProperty target="{panel3}" name="width" value="390"/>
      <mx:SetProperty target="{panel3}" name="height" value="300"/>
      <mx:SetProperty target="{panel3}" name="x" value="5"/>
      <mx:SetProperty target="{panel3}" name="y" value="60"/>
    </mx:State>
  </mx:states>
  <mx:Panel x="5" y="10" width="125" height="30" layout="absolute" title="Panel 1" id="panel1" click="this.currentState='s1'"/>
  <mx:Panel x="135" y="10" width="125" height="30" layout="absolute" title="Panel 2" id="panel2" click="this.currentState='s2'"/>
  <mx:Panel x="270" y="10" width="125" height="30" layout="absolute" id="panel3" title="Panel 3" click="this.currentState='s3'"/>
  <mx:Button x="167" y="368" label="Reset" click="this.currentState=''"/>
</mx:Application>

 


 

<?xml version="1.0"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml"
 width="400" height="400" layout="absolute"
 verticalScrollPolicy="off" horizontalScrollPolicy="off"
 backgroundColor="#FFFFFF">
 <mx:transitions>
    <mx:Transition fromState="*" toState="*">
      <mx:Sequence targets="{[panel1,panel2,panel3]}">
        <mx:Move duration="400"/>
        <mx:Rotate angleFrom="0" angleTo="360" filter="move" />
        <mx:Resize duration="400"/>
      </mx:Sequence>
    </mx:Transition>
  </mx:transitions>
  <mx:states>
    <mx:State name="s1">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="60"/>
      <mx:SetProperty target="{panel1}" name="height" value="300"/>
      <mx:SetProperty target="{panel1}" name="width" value="390"/>
      <mx:SetProperty target="{panel2}" name="x" value="135"/>
      <mx:SetProperty target="{panel2}" name="y" value="10"/>
      <mx:SetProperty target="{panel2}" name="height" value="30"/>
      <mx:SetProperty target="{panel2}" name="width" value="125"/>
      <mx:SetProperty target="{panel3}" name="x" value="270"/>
      <mx:SetProperty target="{panel3}" name="y" value="10"/>
      <mx:SetProperty target="{panel3}" name="height" value="30"/>
      <mx:SetProperty target="{panel3}" name="width" value="125"/>
    </mx:State>
    <mx:State name="s2">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="10"/>
      <mx:SetProperty target="{panel1}" name="height" value="30"/>
      <mx:SetProperty target="{panel1}" name="width" value="125"/>
      <mx:SetProperty target="{panel2}" name="width" value="390"/>
      <mx:SetProperty target="{panel2}" name="height" value="300"/>
      <mx:SetProperty target="{panel2}" name="x" value="5"/>
      <mx:SetProperty target="{panel2}" name="y" value="60"/>
      <mx:SetProperty target="{panel3}" name="x" value="270"/>
      <mx:SetProperty target="{panel3}" name="y" value="10"/>
      <mx:SetProperty target="{panel3}" name="height" value="30"/>
      <mx:SetProperty target="{panel3}" name="width" value="125"/>
    </mx:State>
    <mx:State name="s3">
      <mx:SetProperty target="{panel1}" name="x" value="5"/>
      <mx:SetProperty target="{panel1}" name="y" value="10"/>
      <mx:SetProperty target="{panel1}" name="height" value="30"/>
      <mx:SetProperty target="{panel1}" name="width" value="125"/>
      <mx:SetProperty target="{panel2}" name="x" value="135"/>
      <mx:SetProperty target="{panel2}" name="y" value="10"/>
      <mx:SetProperty target="{panel2}" name="height" value="30"/>
      <mx:SetProperty target="{panel2}" name="width" value="125"/>
      <mx:SetProperty target="{panel3}" name="width" value="390"/>
      <mx:SetProperty target="{panel3}" name="height" value="300"/>
      <mx:SetProperty target="{panel3}" name="x" value="5"/>
      <mx:SetProperty target="{panel3}" name="y" value="60"/>
    </mx:State>
  </mx:states>
  <mx:Panel x="5" y="10" width="125" height="30" layout="absolute" title="Panel 1" id="panel1" click="this.currentState='s1'"/>
  <mx:Panel x="135" y="10" width="125" height="30" layout="absolute" title="Panel 2" id="panel2" click="this.currentState='s2'"/>
  <mx:Panel x="270" y="10" width="125" height="30" layout="absolute" id="panel3" title="Panel 3" click="this.currentState='s3'"/>
  <mx:Button x="167" y="368" label="Reset" click="this.currentState=''"/>
</mx:Application>

 

posted on 2011-03-15 15:54 林的 阅读(121) 评论(0)  编辑  收藏 所属分类: flex

只有注册用户登录后才能发表评论。


网站导航:
 
<2011年3月>
272812345
6789101112
13141516171819
20212223242526
272829303112
3456789

想回家了,呵呵!

常用链接

留言簿(6)

随笔分类

随笔档案

文章分类

文章档案

相册

收藏夹

搜索

  •  

最新评论

阅读排行榜

评论排行榜