Flex 页面跳转方法几枚

Flex几种页面跳转方法：1）使用ViewStack；2）使用states；3）PopUpManager.createPopUp；4）navigateToURL。简单实现了下，话不多说，效果如下：



main.mxml主界面代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Application xmlns:mx="http://www.adobe.com/2006/mxml" layout="absolute" xmlns:local="*" xmlns:s="library://ns.adobe.com/flex/spark">
<mx:Script>
import mx.managers.PopUpManager;
//按钮单击事件
private function btnOpenWnd_click():void{
//弹出新窗口
PopUpManager.createPopUp(this,MyTitleWindow);
}
private function buttonLink():void{
navigateToURL(new URLRequest("http://blog.csdn.net/evangel_z/article/details/18036091"),"_blank");
}
</mx:Script>
<mx:Panel title="Method 1:ViewStack" width="252" height="140">
<mx:ViewStack width="100%" height="100%" id="test" >
<local:test1 id="test_1"/><!--第一个页面(test1.mxml文件)-->
<local:test2 id="test_2"/><!--第一个页面(test2.mxml文件)-->
</mx:ViewStack>
</mx:Panel>

<mx:states>
<mx:State name="Register">
<!-- 增加文本输入条控件 -->
<mx:AddChild relativeTo="{loginForm}"
position="lastChild">
<mx:FormItem id="confirm" label="确认:">
<mx:TextInput/>
</mx:FormItem>
</mx:AddChild>

<!-- 设定面板控件和按钮控件的标题属性-->
<mx:SetProperty target="{loginPanel}"
name="title" value="注册"/>
<mx:SetProperty target="{loginButton}"
name="label" value="注册"/>

<!-- 删除已经存在的链接按钮-->
<mx:RemoveChild target="{registerLink}"/>

<!-- 增加新的链接按钮来改变视窗状态-->
<mx:AddChild relativeTo="{spacer1}" position="before">
<mx:LinkButton label="回到登录页面"
click="currentState=''"/>
</mx:AddChild>
</mx:State>
</mx:states>

<mx:Panel id="loginPanel"
title="Method 2:states"
horizontalScrollPolicy="off"
verticalScrollPolicy="off" x="0" y="148">
<mx:Form id="loginForm">
<mx:FormItem label="用户名:">
<mx:TextInput/>
</mx:FormItem>
<mx:FormItem label="密码:">
<mx:TextInput/>
</mx:FormItem>
</mx:Form>
<mx:ControlBar>
<!-- 使用链接按钮来改变视窗状态-->
<mx:LinkButton id="registerLink"
label="需要注册?"
click="currentState='Register'"/>
<mx:Spacer width="100%" id="spacer1"/>
<mx:Button label="登录" id="loginButton"/>
</mx:ControlBar>
</mx:Panel>

<mx:Panel title="Method 3:createPopUp" x="260" y="0" width="240" height="140">
<mx:Button id="btnOpenWnd" label="显示登录窗口" click="btnOpenWnd_click()" fontSize="12"/>
</mx:Panel>

<mx:Panel title="Method 4:navigateToURL" x="260" y="148" width="240" height="160">
<mx:Button label="link" click="buttonLink();" x="410" y="10"/>
</mx:Panel>
</mx:Application>

test1.mxml代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
<mx:Script>
<![CDATA[
public function test3():void
{
parentDocument.test.selectedChild=parentDocument.test_2;
}
]]>
</mx:Script>
<mx:Button label="跳转到test2.mxml" click="test3()"/>
</mx:Canvas>

test2.mxml代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:Canvas xmlns:mx="http://www.adobe.com/2006/mxml" width="400" height="300">
<mx:Script>
<![CDATA[
public function test1():void
{
parentDocument.test.selectedChild=parentDocument.test_1;
}
]]>
</mx:Script>
<mx:Button label="跳转到test1.mxml" click="test1()"/>
</mx:Canvas>

MyTitleWindow.mxml代码：

<?xml version="1.0" encoding="utf-8"?>
<mx:TitleWindow xmlns:fx="http://ns.adobe.com/mxml/2009"
xmlns:s="library://ns.adobe.com/flex/spark"
xmlns:mx="library://ns.adobe.com/flex/mx" width="400" height="300">
<fx:Script>
<![CDATA[
import mx.managers.PopUpManager;
//关闭窗口
private function closeWindow():void{
PopUpManager.removePopUp(this);//移除窗口对象
}
]]>
</fx:Script>
<mx:Form x="75" y="41">
<mx:FormHeading label="用户登录" fontSize="16"/>
<mx:FormItem label="用户名:" fontSize="12">
<mx:TextInput/>
</mx:FormItem>
<mx:FormItem label="密码:" fontSize="12">
<mx:TextInput displayAsPassword="true"/>
</mx:FormItem>
<mx:FormItem>
<mx:Button label="登录" fontSize="12" click="closeWindow()"/>
</mx:FormItem>
</mx:Form>
</mx:TitleWindow>

附：忙碌之余，轻松一下~