FLASH MX(FLASH6)的闪亮登场,又给了闪客们一个晕倒的理由,因为她的新面孔让我们激动不已。
一.先从MX的新功能说起
进入MX开发界面后,点击菜单条的Help=>Samples,就会打开一篇网页,叶子里的这些Sample能让我们感受到MX的新功能。接着,在叶子里点击"Feature highlight: Load images"链接。我们在这个动画里看到了5张海洋生物的图片(路人甲:看到了又怎么样?),与以往所不同的是:这5张图片并没有和这个swf文件编译在一起(路人乙:一定是"loadMovie"的外部swf,少见多怪),也不是调用的外部swf,而是"loadMovie"的5张外部的jpg图象文件。正是因为MX对"loadMovie"命令进行了扩充,才使我有幸写这篇教程^_^。
翻开MX的在线帮助,可以找出MX对"loadMovie"的详细说明,其中"Parameters"部分的第一句"url The absolute or relative URL of the SWF file or JPEG file to be loaded."更是画龙点睛地指出了:如今的"loadMovie"不但可以load外部的swf,而且还能load外部的jpg图象文件。在jpg格式图象在网络上大行其道的今天,不能不说这是一个极好的消息。
再回过头来看看MX对这个"海洋生物"动画例子的Description:"This sample demonstrates how you can load images from a drive or server into a movie at runtime. There are no images in the library of the source file for this sample."是的,这个"海洋生物"的图象浏览器所"loadMovie"的都是本地"drive"的jpg图象,而且jpg图象的文件名列表都已经提前定义好了。
由此产生个小问题:如果已经定义好的文件名列表里有一个"daliang.jpg"文件,但是在某一天,这个文件在"drive or server"里不幸消失,再"loadMovie"的时候,岂不会出错,那怎么办?!:~(,别哭,咱们一起想办法:)
(路人饼:要是每次"loadMovie"的时候,都能动态地生成一个当前的文件名列表就万事OK了.大亮:没错)每一次运行动画的时候,都能动态生成一个当前的jpg图象文件名列表,就可以解决上述问题。
但是,在本地"drive"里动态生成一个文件名列表却并非易事,不过,我们从这段"海洋生物"动画的Description还能知道:MX的"loadMovie"也可以从server端动态load图象到一个"Movie Chip"里。于是,我们又会想到:利用一些"server"端的语言,就可以很容易地动态生成一个"server"端的jpg图象文件名列表。
二.构思
综上所述,我们知道:这套MX图象浏览器将会在网络上运行,而且在"server"端要有一个提供动态生成"server"端jpg图象文件名列表的后台程序,这些jpg图象文件也要放置在"server"端。
每当运行这个MX图象浏览器的时候,它总会用"loadVariables"的方法请求SERVER返回一个"server"端的当前图象文件列表,然后MX图象浏览器就可以依次"loadMovie"这些jpg的图象文件了。
我们将会选择ASP来作为后台支持,因为用它来遍历"server"端文件非常方便。
为了使这个教程便于理解,所以把后台的ASP文件和所有的jpg图象文件全部放置在"server"端的同一目录下。
这就是整套程序的构思,下面我们将会具体实现这套MX图象浏览器。
三.具体实现
1.ASP部分
首先从后台的ASP入手,因为我们将要开发的这套MX图象浏览器会通过ASP来得知"server"端当前目录的jpg文件清单。下面的这个imagebrowse.asp文件就可以实现动态生成jpg文件名列表的功能:
|
这个ASP就那么十几句,很简单吧。相信有基础的闪客们很快就能看明白这段ASP。
假设这个ASP文件所在的目录有"one.jpg"和"two.jpg"这个两个jpg文件,那么单独运行这段asp程序,在web浏览器中,就会返回如下的文件名列表:
&image1=two.jpg&image2=one.jpg&total=2
以"&"号开头的都是变量名,"="后面的是变量的值,因为这是Flash用"loadVariables"读取外部变量所规定的格式。
后台的ASP部分已经搞定。下面我们来看看如何来做FLASH里面的东西。
2.FLASH部分
首先打开FLASH MX,在主场景中放置两个变量名分别为"text"和"test"的Dynamic Text,并在"test"中输入"loading..."字符串(表示正在读取列表)。其中,"text"用来显示正在浏览的jpg文件名,"test"用来显示一些其它的相关信息。
然后在主场景中建立一个实例名为"imageview"的Movie Chip和一个实例名为"display"的按钮,每按一次这个按钮,就会在"imageview"里显示"loadMovie"进来jpg图象。
紧接着在主场景中建立一个实例名为"finder"的由3帧组成的Movie Chip,它的作用是向服务器询问当前目录的jpg图象文件名列表,直到有了答案才在第二帧停止运行。这3帧的Action Script分别为:
第一帧的Action Script:
|
第二帧的Action Script:
|
第三帧的Action Script:
|
如何控制图象的显示呢?接下来,就该给"display"按钮赋予灵魂了。
回到主场景,在主场景的第一帧(主场景仅有一帧)加入如下Action Script:
|
到此为止,FLASH部分里边的东西也做好了,编译输出swf文件后,整套程序宣布完工!
3.测试
本文假定ASP文件和所有的jpg文件都在WEB服务器的根目录下
也不知道这套程序运行起来是什么样子的?下面就让我们来测试一下:
先在WEB服务器的根目录下随意放置一些jpg图象文件,然后用Flash Player或web浏览器打开刚才做好的swf文件,等到"test"文字框中的"loading..."字符串消失后,我们就可以通过点击"display"按钮来浏览这些jpg图象了。
四.总结
FLASH MX的新技术再与一些象ASP之类的程序相结合,更能让FLASH光彩夺目。
这篇文章毕竟只是篇教程。为了使读者快速掌握其要领,所以这个MX图象浏览器的功能简单得不能再简单了。你要是想把她用在实际当中,还需要对本程序做一些改进。比如说:由于带宽的限制,当"loadMovie"一副大图象时,你就需要在FLASH中加上图象的预载程序,使"傻等"现象不再发生;当"loadMovie"进来的图象的尺寸很大或者很小时,你就需要加上一段自动调整其尺寸的程序;对ASP程序和FLASH部分做适当的改进,使其不局限于只能浏览"imagebrowse.asp"文件所在目录的图象;对FLASH部分做适当改进,可以使其对"loadMovie"进来的图象做一些简单的处理,如尺寸缩放、颜色调节、简单变形等等。(经过验证,以上的想法都能实现,只是大亮懒得去做,大家一定要努力!努力!千万别和大亮一起懒 ^_^)
最后祝大家看了这篇文章之后,做出网络上最炫的FLASH MX在线图象浏览器。别忘了把你的好消息和好点子告诉大亮。
好了,就说这么多,以后见!
由于大亮水平有限,难免有疏漏之处,敬请朋友们批评指正。
……