Flex SDK 4 新特性 第八节   SWFObject 与 HTML Template
        了解Flex SDK 4中的Html Template与swfobject 2
      

学习目标

       了解什么是html template和swfobject 2,它们在项目中起到什么作用 。

实现步骤

       在每个Flex 4项目中都有一个html-template文件夹,里面的内容如下:(图五十四)

图五十四

html-template文件夹

1. 我们先来了解history文件夹中的内容

history.js, history.css以及historyFrame.html用于记录Flex程序中每一个state的地址,比如我们从state1,切换到state2,从Tab1跳转到Tab2时它为我们保存对应这些state的浏览器地址。如果我们在项目中激活 “允许继承浏览器导航功能的选项”,那就意味着我们可以:

1. 通过前进和后退返回在程序中放问过的state。 2. 将某一state的地址保存进收藏夹,以后可以直接通过地址打开的这个state的页面。 3. 将某一state的地址给其他人,他们可以直接链接到这个states页面。

换句话说如果我们整个程序的试图切换都用state方式,那么我们可以像浏览普通网页一样在浏览器中访问我们程序的任意指定页面。

激活“允许继承浏览器导航功能的选项”的方法是

“选中项目-->属性 -->Flex编译器 --> 允许继承浏览器导航功能的选项。 ”

提示 : 如果想进一步了解historyFrame.html的工作机制,请同学们在Flash Builder 4的帮助中输入deep linking 。

2. html-template以及swfobject

html-template的作用是在编译生成项目时生成一个Html页面,用户通过访问Html页面来访问程序,而不是直接访问生成的swf文件。为什么不直接访问swf文件?因为html-template除了显示swf程序外还帮我们做了很多其他事,比如

1. 引用history系列文件来支持浏览器导航。   
2. 检测用户Flash player版本,一键自动安装。 
3. 页面标题,编码,宽度,程序质量,等等。 

       asdoc命令存在于"FlashBuilder4安装目录/sdks/4.0.0/bin"

       在Flex 4之前,是直接使用一段javascript加入到html-template文件中实现上述功能,而从Flex 4开始,正式引入了swfobject 2(Flash CS4中发布也使用swfobject 2),它是一个开源的标准库,用于将swf嵌入到html页面,以及实现一些其他的功能。html-template并不是不可改变的,同学们可以更具自己项目的需要修改里面的内容,如果你使用了自己的html页面,你也可以通过引用swfobject.js以及history的方法实现html-template中提供的功能。

提示 : 如果想进一步了解html-template的详细信息,请同学们在Flash Builder 4的帮中中输入swfobject或者html-template。