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對這個"海洋生物"動畫例子的Descr 由此產生個小問題:如果已經定義好的文件名列表里有一個"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在線圖象瀏覽器。別忘了把你的好消息和好點子告訴大亮。
好了,就說這么多,以后見!
由于大亮水平有限,難免有疏漏之處,敬請朋友們批評指正。
新聞熱點
疑難解答