四种方式实现Flex页面跳转

Flex页面跳转是不被大多数人知道的东西,这里向大家简单介绍一下实现Flex页面跳转的几种方式,希望
首页 新闻资讯 行业资讯 四种方式实现Flex页面跳转

在学习Flex的过程中,你可能会遇到Flex页面跳转的问题,本文和大家分享一下,页面在flex里面其实就是一个个的Canvas,vbox,hbox等等之类的东西,看到的不同页面的切换,就是这些元素一层层的堆积,或者替换,但是为了好理解,还是称之为"页面跳转"。

Flex页面跳转

其实对于这个题目是不恰当的,因为flex中是没有页面这个概念的,页面在flex里面其实就是一个个的Canvas,vbox,hbox等等之类的东西,看到的不同页面的切换,就是这些元素一层层的堆积,或者替换,但是为了好理解,还是称之为"页面跳转"。其实我们可以对比传统的C/S开发模式,没页面跳转,只有窗体和元件的显示和隐藏。

那么怎么实现Flex页面跳转呢,我总结了下,主要有一下几种方式:

1、使用ViewStack组件,具体代码如下所示:把要跳转的页新建成MXMLComponent,然后通过ViewStack组件把
这些页包含进来
 

复制

<mx:ViewStackidmx:ViewStackid="storeViews"width="100%"height="550"creationPolicy="all"> <shouyeidshouyeid="homeView"label="首页"showEffect="WipeDown"hideEffect="WipeUp"/> <leixingidleixingid="pView"label="模板类型"showEffect="WipeDown"hideEffect="WipeUp"/> <makeidmakeid="supportView"label="立即制作"showEffect="WipeDown"hideEffect="WipeUp"/> </mx:ViewStack>
  • 1.

  • 2.

  • 3.

  • 4.

  • 5.

然后再用别的组件切换这些页,比如用Button
 

复制

<mx:Buttonclickmx:Buttonclick="storeViews.selectedChild=homeView;"/>
  • 1.

2、使用navigateToURL,主要方式如下:

复制

varurl:String="http://localhost:8080/Flex_J2eeDemo/bin/Welcome.html";  varrequest:URLRequest=newURLRequest(url);  navigateToURL(request,"_blank");
  • 1.

  • 2.

  • 3.

但是这个方法很郁闷就是页面切换总是弹出新的页面,而不是只变换url

3、也是我采用的方法,就是引用flash中的importflash.external.ExternalInterface这个接口,他能提供像jsp中window.location.href方法一样方便,Flex页面跳转主要代码为:

复制

ExternalInterface.call("function()  {window.location.href='http://localhost:8080/Flex_J2eeDemo/bin/Welcome.html';}   ");
  • 1.

  • 2.

  • 3.

  • 4.

 

4、使用组件技术,把不通的页面做成component,然后通过TabNavigator等进行切换,通过使用state实现跳转。

最后总结下吧:在Flex中,根本就没有页面的概念,有的只有状态,Flex是通过改变不同的状态在我们的Application中实现不同页面的平滑变换。目前已有人提出使用"栈"的"后进先出"的思想等等方法来实现,当然还有其他的方法,但是都需要我们的不断探索、挖掘。
 

【编辑推荐】

  1. 技术分享 用FlexBuilder创建Flex项目

  2. Flex基础 创建第一个Flex项目

  3. 解析Flex事件执行流程

  4. FlexBuilder3.0与Eclipse3.4的完美结合

  5. 学习笔记 FlexBuilder2.0中如何使用基于Lists的控件

 

 

15    2010-08-05 09:33:08    Flex页面跳转