Flex的视图状态。

      在建立了Flex应用后，在MYECLIPSE中可以看到一个名叫states的视图，这个视图可以实现页面间的切换（个人感觉是通过控制层的可见性以及添加新层来完成某状态的重绘），states配置如下：

      <mx:states>
  <mx:State name="cartView">
   <mx:SetProperty target="{products}" name="width" value="0"/>
   <mx:SetProperty target="{products}" name="height" value="0"/>
   <mx:SetProperty target="{cartBox}" name="width" value="100%"/>
   <mx:AddChild relativeTo="{cartBox}" position="lastChild">
    <mx:DataGrid id="dgCart" width="100%">
     <mx:columns>
      <mx:DataGridColumn headerText="Column 1" dataField="col1"/>
      <mx:DataGridColumn headerText="Column 2" dataField="col2"/>
      <mx:DataGridColumn headerText="Column 3" dataField="col3"/>
     </mx:columns>
    </mx:DataGrid>
   </mx:AddChild>
   <mx:RemoveChild target="{linkbutton1}"/>
   <mx:AddChild relativeTo="{cartBox}" position="lastChild">
    <mx:LinkButton label="Continue Shopping" click="this.currentState=''"/>
   </mx:AddChild>  
  </mx:State>
 </mx:states>

 

简要分析下这段代码: <mx:State name="cartView">表示创建一个新的名为cartView的视图，

 <mx:SetProperty target="{products}" name="width" value="0"/>
   <mx:SetProperty target="{products}" name="height" value="0"/>
这2行把products容器的宽和高设为0，这样products容器被隐藏了起来不可见。

 <mx:SetProperty target="{cartBox}" name="width" value="100%"/>
这行让cartBox的横向填充满整个容器（高度不变），其实就是填充满刚才被隐藏了的products区域。

<mx:AddChild relativeTo="{cartBox}" position="lastChild">
    <mx:DataGrid id="dgCart" width="100%">
     <mx:columns>
      <mx:DataGridColumn headerText="Column 1" dataField="col1"/>
      <mx:DataGridColumn headerText="Column 2" dataField="col2"/>
      <mx:DataGridColumn headerText="Column 3" dataField="col3"/>
     </mx:columns>
    </mx:DataGrid>
   </mx:AddChild>
这段代码是在cartBox中添加一个DataGrid 控件。

 

 <mx:RemoveChild target="{linkbutton1}"/>
这行代码移除名为linkbutton1的控件

 

 <mx:AddChild relativeTo="{cartBox}" position="lastChild">
    <mx:LinkButton label="Continue Shopping" click="this.currentState=''"/>
   </mx:AddChild>  
这段代码增加了一个返回base状态的链接。

 

看完了这个例子，我思考了如下几个问题，我们可以把某些页面存为一种状态，当我们需要的时候只要调用这个状态就可以重绘整个页面，举个简单的例子，当我们查询服务器后生成了一个页面显示学生列表，然后我们又点了很多别的页面，然后想重新看看学生列表，按以往JSP的方法，我们需要重新访问服务器请求学生列表页面，而在FLEX中可以用状态解决这个问题，我们可以把学生列表通过以上的编码方式存为一种状态，当我们需要重新查看学生列表的时候，只需要调用对应的状态就可以了，无须再请求服务器。