FLASH影音在線播放器的設(shè)計(jì)-界面的實(shí)現(xiàn).doc_第1頁(yè)
FLASH影音在線播放器的設(shè)計(jì)-界面的實(shí)現(xiàn).doc_第2頁(yè)
FLASH影音在線播放器的設(shè)計(jì)-界面的實(shí)現(xiàn).doc_第3頁(yè)
FLASH影音在線播放器的設(shè)計(jì)-界面的實(shí)現(xiàn).doc_第4頁(yè)
FLASH影音在線播放器的設(shè)計(jì)-界面的實(shí)現(xiàn).doc_第5頁(yè)
已閱讀5頁(yè),還剩27頁(yè)未讀, 繼續(xù)免費(fèi)閱讀

下載本文檔

版權(quán)說(shuō)明:本文檔由用戶(hù)提供并上傳,收益歸屬內(nèi)容提供方,若內(nèi)容存在侵權(quán),請(qǐng)進(jìn)行舉報(bào)或認(rèn)領(lǐng)

文檔簡(jiǎn)介

03網(wǎng)絡(luò)2 季曉花 11 南通紡織職業(yè)技術(shù)學(xué)院畢業(yè)設(shè)計(jì)(論文) flash影音在線播放器的設(shè)計(jì)與實(shí)現(xiàn) 界面的設(shè)計(jì)與實(shí)現(xiàn)季 曉 花3514211班 級(jí) 03網(wǎng) 絡(luò) 2 班 專(zhuān) 業(yè) 網(wǎng)絡(luò)技術(shù)/市場(chǎng)營(yíng)銷(xiāo) 教 學(xué) 系 信 息 系 指導(dǎo)老師 周 悅 完成時(shí)間 2007年04月01日至 2007年05月03日目 錄第一章引 言 4第二章flash的特點(diǎn)與功能 52.1 flash的特點(diǎn) 52.2 flash的功能 6第三章元件、實(shí)例的使用 83.1關(guān)于元件 83.1.1 元件和實(shí)例 83.1.2元件的類(lèi)型 93.1.3 元件的優(yōu)點(diǎn) 93.2創(chuàng)建按鈕 103.3遮罩層的使用 113.4濾鏡和混合模式 12第四章播放器界面功能需求分析 13第五章播放器界面結(jié)構(gòu)分析 145.1界面需求橫向分析(場(chǎng)景幀)145.2界面需求縱向分析(場(chǎng)景層)14第六章色彩的應(yīng)用 166.1色彩在界面中的作用 166.2 色彩的運(yùn)用 16第七章播放器界面實(shí)現(xiàn) 187.1 視頻、進(jìn)度條和列表界面等美工 187.29個(gè)常見(jiàn)播放器按鈕的制作 197.3暫停/繼續(xù)按鈕的切換顯示 197.4音量按鈕上的菜單效果 207.5音量大小圖形控制 217.6雙擊視頻區(qū)完成“全屏模式”與“完整模式”間的切換 227.7當(dāng)前播放曲目著重顯示 237.8對(duì)盜用swf的給以友情提示237.9flash文件優(yōu)化 24第八章設(shè)計(jì)總結(jié) 26致 謝 27參 考 文 獻(xiàn) 28flash影音在線播放器的設(shè)計(jì)與實(shí)現(xiàn) 界面的設(shè)計(jì)與實(shí)現(xiàn)【 摘 要 】 現(xiàn)在web和電腦用戶(hù)對(duì)網(wǎng)頁(yè)媒體需求是越來(lái)越多。因?yàn)閷拵У钠占昂唾|(zhì)量的提高,更多的用戶(hù)已經(jīng)不太習(xí)慣下載音樂(lè)、mv和電影了。都習(xí)慣于在線觀看瀏覽,而且又不占用硬盤(pán)、不需要長(zhǎng)時(shí)間等待下載、又可以經(jīng)常更新。所以本課題嘗試用時(shí)下最為流行且最具發(fā)展前景的web元素flash,設(shè)計(jì)并實(shí)現(xiàn)一個(gè)多媒體影音在線播放系統(tǒng),側(cè)重其按鈕、滑條、進(jìn)度條的制作以及頁(yè)面框架美工的設(shè)計(jì)、功能的實(shí)現(xiàn)?!?關(guān)鍵詞 】 flash 播放器 多媒體 美工 界面設(shè)計(jì)與實(shí)現(xiàn)【 abstract 】 now web and computer user to the homepage media demand is more and more many. because of wide band popularization and quality enhancement, more users already not too custom downloading music, mv and movie. all is accustomed to on-line watches the browsing, more over does not take the hard disk, does not need the long time to wait for downloading, may frequently renew. therefore this topic tastes the test to be at present most popular also most to have the prospects for development web element - flash, designs and realizes a multimedia video and music on-line broadcast system contact surface: button, slippery strip, progress strip manufacture and page frame art designing design, function realization.【 keyword 】 flash player multimedia art designing contact surface design and realization第一章 引 言flash(中文譯為“閃動(dòng)、一閃”)這個(gè)英文單詞是一個(gè)用于制作網(wǎng)絡(luò)動(dòng)畫(huà)的軟件的名稱(chēng),在今天已是廣為人知了。就像photoshop、corel-draw、3d max等設(shè)計(jì)軟件名稱(chēng)一樣,已被許多愛(ài)好者熟悉和掌握!因?yàn)閒lash是為制作網(wǎng)絡(luò)動(dòng)畫(huà)而開(kāi)發(fā)的軟件?,F(xiàn)在的flash,它的流行經(jīng)歷了一個(gè)由默默無(wú)聞到驚天動(dòng)地的歷程,并終于迎來(lái)了它的成功,迎來(lái)了市場(chǎng)特別是設(shè)計(jì)界的關(guān)注和認(rèn)可,使設(shè)計(jì)界對(duì)于未來(lái)設(shè)計(jì)的發(fā)展趨勢(shì)有了一個(gè)有據(jù)有理的認(rèn)識(shí),也引發(fā)了我對(duì)于flash現(xiàn)象的研究和有關(guān)設(shè)計(jì)探索的興趣。 今天,flash已經(jīng)不是什么新鮮事物了。它大約是在兩年前出現(xiàn)在我國(guó)的,那時(shí)我國(guó)的網(wǎng)絡(luò)才剛剛開(kāi)始發(fā)展,網(wǎng)絡(luò)正式進(jìn)入千家萬(wàn)戶(hù),網(wǎng)絡(luò)動(dòng)畫(huà)也隨著進(jìn)入了千家萬(wàn)戶(hù)?;蚴且?yàn)榕d趣,或是因?yàn)樯虡I(yè)的需要,或是因?yàn)樵O(shè)計(jì)的需要,部分網(wǎng)民開(kāi)始了flash動(dòng)畫(huà)的制作。flash一族自2000年來(lái)逐漸成型,并迅速壯大,flash原創(chuàng)作品蜂擁而起。因?yàn)閯?dòng)畫(huà)的實(shí)用性、趣味性和娛樂(lè)性很強(qiáng),它已經(jīng)逐步的占據(jù)了廣大青少年、甚至是部分中老年的工作和生活,flash動(dòng)畫(huà)短片成為一時(shí)間網(wǎng)絡(luò)最熱的娛樂(lè)方式,也成為了一種時(shí)尚和潮流。開(kāi)始學(xué)習(xí)和制作flash的人越來(lái)越多,人們都以能夠制作出倍受大家關(guān)注的flash動(dòng)畫(huà)作品而感到驕傲、自豪。現(xiàn)在有許多專(zhuān)門(mén)的如“flashempire閃客帝國(guó),大話三國(guó),閃盟在線”等等這樣的一些網(wǎng)站,這里面不僅擁有大量的flash動(dòng)畫(huà)供愛(ài)好者在線觀看,而且還是flash迷們的一個(gè)專(zhuān)門(mén)交流的空間。的確,它的發(fā)展讓人不得不刮目相看。flash作為現(xiàn)代的一種新的設(shè)計(jì)方式和娛樂(lè)方式,不僅有其實(shí)用功能,并且還有視覺(jué)和聽(tīng)覺(jué)上的雙重享受,更因?yàn)樗哂械娜の缎?,成為現(xiàn)代人放松自我,表現(xiàn)自我,甚至是陶醉自我的一種方式!因?yàn)楦鞔竺襟w對(duì)它的宣傳,設(shè)計(jì)界和市場(chǎng)也開(kāi)始對(duì)這樣一種新的宣傳和表達(dá)方式重視起來(lái),flash動(dòng)畫(huà)的價(jià)值也開(kāi)始以秒來(lái)計(jì)算,大大的刺激了更多的flash迷的創(chuàng)作熱情。他們匯聚在自己的網(wǎng)絡(luò)空間里,以始終如一的熱情,創(chuàng)作出一個(gè)又一個(gè)的flash精品,吸引著成千上萬(wàn)雙眼睛的關(guān)注!第二章 flash的特點(diǎn)與功能flash是目前最為流行的網(wǎng)絡(luò)動(dòng)畫(huà)制作工具。它集矢量編輯和動(dòng)畫(huà)創(chuàng)作功能為一體,并具有靈活的交互功能,能將圖形、圖像、音頻、動(dòng)畫(huà)和深層次的交互動(dòng)作有機(jī)地結(jié)合在一起。由于flash廣泛使用矢量圖形,文件非常小,因此特別適合于創(chuàng)建通過(guò)internet提供的內(nèi)容。與位圖圖像相比,矢量圖形所需要的內(nèi)存和存儲(chǔ)空間要小的多,因?yàn)樗鼈兪且粩?shù)學(xué)公式而不是大型數(shù)據(jù)集表示圖像自身的。而位圖圖形之所以更大,是因?yàn)閳D像中的每個(gè)像素都需要一組獨(dú)立的數(shù)據(jù)來(lái)表示。2.1 flash的特點(diǎn)flash具有簡(jiǎn)單易用、高效多能的特點(diǎn)。概況來(lái)說(shuō),flash具有以下一些優(yōu)點(diǎn):(1) 靈活播放的作品使用flash不僅可以制作質(zhì)量非常出色的網(wǎng)頁(yè),還可以制作高質(zhì)量的離線交互作品,并且擁護(hù)不需要使用網(wǎng)頁(yè)瀏覽器就可以瀏覽這些flash作品。flash附帶著一個(gè)免費(fèi)發(fā)放的離線播放器,這個(gè)離線播放器的文件非常小,因此可以將它和flash作品一起放在依仗軟盤(pán)上,從而生成一個(gè)不需要單獨(dú)安裝既可獨(dú)立播放的演示程序。(2) 作品的網(wǎng)絡(luò)傳輸速度快flash中的動(dòng)畫(huà)圖形用的是矢量技術(shù),而不是在大多傳統(tǒng)網(wǎng)頁(yè)動(dòng)畫(huà)圖像中所使用的點(diǎn)陣技術(shù),因此,flash動(dòng)畫(huà)作品的文件非常小,下在一個(gè)包含有幾個(gè)場(chǎng)景的全屏flash動(dòng)畫(huà)文件只需要幾秒鐘,明顯少于下載并播放一個(gè)同等大小和復(fù)雜程度的點(diǎn)陣組成的網(wǎng)頁(yè)動(dòng)畫(huà)文件的時(shí)間。(注:矢量技術(shù),由數(shù)學(xué)公式和指令描述的圖像被稱(chēng)為矢量圖形,這些數(shù)學(xué)公式和指令以純文本的形式存在,所以要描述一個(gè)全屏幕動(dòng)畫(huà)過(guò)程只需要很小的數(shù)據(jù)量。點(diǎn)陣技術(shù),由具有顏色特征的像素組成的一個(gè)矩陣來(lái)描述圖像,每個(gè)像素的大小和每個(gè)給定圖像中的像素的總數(shù)是固定不變的。描述一個(gè)像素需要232位數(shù)據(jù)位。)(3) 可自由縮放的flash圖像一般來(lái)說(shuō),在網(wǎng)頁(yè)所用的圖像都要盡可能地小,只有這樣才能減少傳輸網(wǎng)頁(yè)時(shí)的傳輸時(shí)間。所以在網(wǎng)頁(yè)中使用全屏幕圖像相對(duì)較少。否則,瀏覽者為下載圖像花費(fèi)很長(zhǎng)的時(shí)間,以至于在他們還沒(méi)有看到圖像的整個(gè)內(nèi)容時(shí)就沒(méi)有了耐心。而對(duì)于flash生成的網(wǎng)頁(yè)動(dòng)畫(huà),不管尺寸如何,其文件大小幾乎是一樣的,只是在控制圖像放大倍數(shù)上有微小區(qū)別。因此,對(duì)于flash網(wǎng)頁(yè)動(dòng)畫(huà)來(lái)說(shuō),不論畫(huà)面大小,其運(yùn)行過(guò)程都是一樣的。(4) 高質(zhì)量的文字和圖像效果在flash中使用矢量圖形最大的好處是,總能保證它的線條圖形和文字的輸出質(zhì)量是瀏覽者的計(jì)算機(jī)所能實(shí)現(xiàn)的最高輸出質(zhì)量。因?yàn)槭噶繄D形中的指令可以告訴瀏覽者的計(jì)算機(jī)如何去識(shí)別這些圖形,從而保證這臺(tái)計(jì)算機(jī)能盡其所能地輸出高質(zhì)量的圖形,因此在flash生成的網(wǎng)頁(yè)中,每一個(gè)元素都非常清晰和專(zhuān)業(yè)化。而點(diǎn)陣動(dòng)畫(huà)圖像經(jīng)常是通過(guò)改變和扭曲被固定了大小的像素矩陣制作出來(lái)的,在這個(gè)過(guò)程中,一些必要的像素可能被夸大或丟失,因此,圖像的質(zhì)量受到了明顯的影響。在flash中使用矢量圖形的另一個(gè)好處是,fkash生成的網(wǎng)頁(yè)中絕不在它的純色或漸變色色彩區(qū)域內(nèi)找到模糊或游離的像素。(5) 多用性flash是一個(gè)多能的工具,所輸出的文件還可以被高檔的圖形軟件所接受。因此,flash既可以幫助那些不太精通繪圖的人將他們的想法圖形化,又可以讓專(zhuān)業(yè)的圖像設(shè)計(jì)師利用它進(jìn)行構(gòu)思或設(shè)計(jì)草稿,然后輸出到高檔的圖形軟件中,以便對(duì)其做進(jìn)一步的加工和完善,從而簡(jiǎn)化操作過(guò)程。(6) 瀏覽flash作品的障礙正逐漸消除目前幾乎所有先進(jìn)的和具有圖形功能的瀏覽器都加入了支持flash的插件,而一些十分流行的多媒體網(wǎng)頁(yè)瀏覽器的插件如quicktime4、real audio和shockwave等都支持flash。另外,macromedia公司已發(fā)布了flash動(dòng)畫(huà)文件格式的源代碼,可以提供給任何想要使用它的人,因此可望看到flash技術(shù)將被植入到許多新的網(wǎng)頁(yè)瀏覽器中,包括netscape。2.2 flash的功能flash功能強(qiáng)大。就其基本功能來(lái)說(shuō),概括起來(lái)有以下幾點(diǎn):(1) 具有較強(qiáng)的矢量繪圖和動(dòng)畫(huà)制作功能,所制作的圖象質(zhì)量高而動(dòng)畫(huà)和網(wǎng)頁(yè)數(shù)據(jù)量小。(2) 具有較強(qiáng)的導(dǎo)入和發(fā)布功能,不但可以導(dǎo)入點(diǎn)陣圖、quicktime格式電影文件和mp3格式音樂(lè)文件等,還可以發(fā)布mp3文件等。(3) 采用插件的工作方式,只要電腦中的瀏覽器安裝了shockwaveflash插件,即可觀看flash動(dòng)畫(huà)。(4) 采用“流式技術(shù)”播放動(dòng)畫(huà),文件沒(méi)有全部下載完就可觀看以下載的內(nèi)容。(5) flash播放器可以直接從網(wǎng)上下載更新版本。(6) 可充分調(diào)用flash文件內(nèi)部庫(kù)中的符號(hào),重復(fù)利用資源。只要這個(gè)庫(kù)下載后,其他的電影都可以不在下載共享的符號(hào),直接使用這個(gè)庫(kù)的符號(hào),是文件字節(jié)數(shù)減少。(7) 包含許多功能更強(qiáng)大的actionscript函數(shù)、屬性和目標(biāo)對(duì)象,兼容并支持flash以前的版本。(8) apple授權(quán)使用flash的播放器可內(nèi)置于apple產(chǎn)品中,這樣就可以通過(guò)quicktime播放flash的圖片、電影和具有交互能力的圖像。(9) 采用與javaspcript類(lèi)似的語(yǔ)法結(jié)構(gòu),以及新的文本編輯區(qū)和調(diào)試區(qū),可進(jìn)一步提高程序的開(kāi)發(fā)能力,開(kāi)發(fā)更多的可擴(kuò)展的工具,以便開(kāi)發(fā)web應(yīng)用程序。(10) actionscript編輯器允許有普通模式和專(zhuān)家模式兩種模式.所有的腳本程序均可從外部腳本文件調(diào)入,外部的腳本文件可以和任何ascii碼的文本文件。(11) 支持xml。第三章 元件、實(shí)例的使用3.1關(guān)于元件元件是在flash中創(chuàng)建的圖形、按鈕或影片剪輯,而實(shí)例是指位于舞臺(tái)上或嵌套在另一個(gè)元件內(nèi)的元件副本,實(shí)例可以與它的元件在顏色、大小和功能上有很大區(qū)別。編輯元件會(huì)更新它的所有實(shí)例,但對(duì)元件的一個(gè)實(shí)例應(yīng)用效果則只更新該實(shí)例。3.1.1 元件和實(shí)例簡(jiǎn)單地說(shuō),元件是一個(gè)特殊的對(duì)象,可以是一個(gè)形狀,也可以是一個(gè)按鈕,甚至可以是一段影片剪輯。它在flash中只創(chuàng)建一次,然后可以在整部影片中反復(fù)使用。所創(chuàng)建的任何元件都會(huì)自動(dòng)成為當(dāng)前文檔的庫(kù)的一部分。例如,創(chuàng)建了一個(gè)小鳥(niǎo)飛翔的影片剪輯元件后,當(dāng)需要制作一個(gè)一群小鳥(niǎo)在空中飛翔的場(chǎng)景時(shí),就可以從庫(kù)中反復(fù)拖出小鳥(niǎo)飛翔元件的實(shí)例。這些元件實(shí)例的每一個(gè)都是對(duì)原元件的一次引用,而不是重新創(chuàng)建原元件。原元件只在最終的flash影片中存儲(chǔ)一次。不管引用多少次,引用元件對(duì)文件大小都只有很小的影響。因此,如果最初做成元件的對(duì)象使影片總的文件大小增加可25kb,那么添加10個(gè)、20個(gè)甚至更多的元件實(shí)例,不會(huì)造成文件成倍增長(zhǎng),且文件大小與元件的大小無(wú)關(guān)。元件實(shí)例的外觀和動(dòng)作無(wú)需與原元件一樣。每個(gè)元件實(shí)例都可以有其不同的顏色和大小,并提供不同的交互作用。例如,可以將按鈕元件的多個(gè)實(shí)例放置在場(chǎng)景上,其中每一個(gè)實(shí)例都有不同顏色和指定動(dòng)作。每一個(gè)元件都有自己的時(shí)間軸、場(chǎng)景及圖層,也就是說(shuō),可以將元件實(shí)例放置在場(chǎng)景中的動(dòng)作看成是將一部小的影片(元件)放置在較大的影片(flash項(xiàng)目)中。而且,可以將元件實(shí)例作為一個(gè)整體來(lái)設(shè)置影片效果。當(dāng)對(duì)元件進(jìn)行編輯后,元件的每個(gè)實(shí)例都會(huì)做相應(yīng)的更新。例如,如果將已經(jīng)用其創(chuàng)建過(guò)幾個(gè)實(shí)例的矩形元件更改為圓形,那么該元件的每一個(gè)實(shí)例也將變成圓形。不過(guò),元件的改動(dòng)在其實(shí)例中只能從圖形的角度反映出來(lái),而每個(gè)元件實(shí)例仍然可以擁有各自的顏色、大小和功能等特定屬性。3.1.2元件的類(lèi)型每個(gè)元件都有一個(gè)唯一的時(shí)間軸和舞臺(tái)及幾層。創(chuàng)建元件時(shí)要選擇元件類(lèi)型,這取決于文檔中如何使用該元件。flash中的元件包括以下4種類(lèi)型。(1)圖形元件:可用于靜態(tài)圖象,并可用來(lái)創(chuàng)建連接到主時(shí)間軸的可重用的動(dòng)畫(huà)片段,圖形元件與主時(shí)間軸同步運(yùn)行。交互式控件和聲音在圖形元件的動(dòng)畫(huà)序列中不起作用。(2)按鈕元件:可用于創(chuàng)建響應(yīng)鼠標(biāo)點(diǎn)擊、滑過(guò)或其他動(dòng)作的交互式按鈕。在制作這種類(lèi)型的元件時(shí),首先要定義與各種按鈕狀態(tài)關(guān)聯(lián)的圖形,然后將動(dòng)作指定給按鈕實(shí)例。(3)影片剪輯元件:可用于創(chuàng)建可重用的動(dòng)畫(huà)片段。影片剪輯作為flash中最具有交互性、用途最多及功能最強(qiáng)的部分,基本上是小的獨(dú)立影片,它們可以包含主要影片中的所有組成部分(包括聲音、影片及按鈕)。影片剪輯擁有自己的獨(dú)立于主時(shí)間軸的多幀時(shí)間軸,所以可以將影片剪輯看作是主時(shí)間軸內(nèi)的嵌套時(shí)間軸。也可以將影片剪輯實(shí)例放在按鈕元件的時(shí)間軸內(nèi),以創(chuàng)建動(dòng)畫(huà)按鈕。(4)字體元件:用于導(dǎo)出字體并在其他flash文檔中使用它。3.1.3 元件的優(yōu)點(diǎn)使用元件的優(yōu)點(diǎn)主要有以下4個(gè)方面:(1) 可以簡(jiǎn)化影片的剪輯。在應(yīng)派內(nèi)剪輯過(guò)程紅,可以把要多次使用的元素做成元件。當(dāng)修改了元件以后,使用他的所有實(shí)例都會(huì)隨之更新,而不必逐一更改。(2)由于所有實(shí)例在文件中僅保存一個(gè)完整描述,其余只需保存參考指針,因此應(yīng)用元件可以使影片文件的大小大大縮減。(3)制作運(yùn)動(dòng)類(lèi)型的過(guò)渡影片時(shí),必須使用元件。(4)在使用軟件時(shí),由于一個(gè)實(shí)例在瀏覽中僅需要下載一次,因此可以加快影片的下載速度。3.2創(chuàng)建按鈕按鈕實(shí)際上是一個(gè)四幀的交互影片剪輯。當(dāng)為元件選擇按鈕行為時(shí),flash會(huì)創(chuàng)建一個(gè)四幀的時(shí)間軸。前三幀顯示按鈕的三種可能狀態(tài),第四幀則定義按鈕的活動(dòng)區(qū)域。如果要使一個(gè)按鈕具有交互性,可以把該按鈕元件的一個(gè)實(shí)例放在舞臺(tái)上,然后給該實(shí)例指定動(dòng)作。必須將動(dòng)作指定給文檔總的按鈕實(shí)例,而不是指定給按鈕時(shí)間軸中的幀。按鈕元件時(shí)間軸上的每一幀都表示一種狀態(tài),這4種狀態(tài)的功能如下:(1)第1幀:彈起狀態(tài),表示指針沒(méi)有經(jīng)過(guò)按鈕時(shí)該按鈕的狀態(tài)。(2)第2幀:指針經(jīng)過(guò)狀態(tài),表示當(dāng)指針滑過(guò)按鈕時(shí),該按鈕的外觀。(3)第3幀:按下?tīng)顟B(tài),表示單擊按鈕時(shí),該按鈕的外觀。(4)第4幀;點(diǎn)擊狀態(tài),定義響應(yīng)鼠標(biāo)單擊的區(qū)域。此區(qū)域在swf文件中是不可見(jiàn)的。如果沒(méi)有在“點(diǎn)擊”幀指定動(dòng)作,則顯示“彈起”幀中的對(duì)象就作為響應(yīng)鼠標(biāo)事件的動(dòng)作。創(chuàng)建按鈕的操作步驟如下:(1)確保沒(méi)有選擇舞臺(tái)上的任何內(nèi)容。(2)選擇“插入”|“新建元件”命令,彈出“創(chuàng)建新元件”對(duì)話框,在“名稱(chēng)”文本框中鍵入新按鈕元件的名稱(chēng),并在“類(lèi)型”選項(xiàng)組中單擊“按鈕”單選按鈕。(3)單擊“確定”按鈕,切換到元件編輯模式。同時(shí)時(shí)間軸的標(biāo)題會(huì)變?yōu)轱@示4個(gè)標(biāo)簽分別為“彈起”、“指針經(jīng)過(guò)”、“按下”和“點(diǎn)擊”的連續(xù)幀。第1幀(“彈起”)是空白關(guān)鍵幀。(4)創(chuàng)建彈起狀態(tài)的按鈕圖像??梢允褂美L畫(huà)工具、導(dǎo)入一幅圖形或在舞臺(tái)上放置另一個(gè)元件的實(shí)例。(注:可以在按鈕中使用圖形元件和影片剪輯元件,但不能在按鈕中使用另一個(gè)按鈕)(5)單擊標(biāo)示為“指針經(jīng)過(guò)”的第2幀,然后選擇“插入”|“時(shí)間軸”|“關(guān)鍵幀”命令,使其成為一個(gè)關(guān)鍵幀。(6)將按鈕圖象改為“指針經(jīng)過(guò)”狀態(tài)。(7)為“按下”幀和“點(diǎn)擊”幀重復(fù)步驟(5)和(6)。(8)完成之后,單擊編輯欄上的“返回”按鈕退出元件編輯模式。然后從“庫(kù)”面板中拖出按鈕元件即可在文檔中創(chuàng)建該元件的實(shí)例。3.3遮罩層的使用使用flash的遮罩功能可以制作很多復(fù)雜的效果。遮罩層的功能就像一個(gè)蠟版,當(dāng)用戶(hù)將蠟版防在一個(gè)表面并在該表面涂抹顏料時(shí),顏料只會(huì)涂在沒(méi)有被蠟版遮掩住的地方,其他地方則被隔開(kāi)或被遮掩住。例如,要獲得聚光燈效果以及轉(zhuǎn)變,可以使用遮罩層創(chuàng)建一個(gè)孔,通過(guò)這個(gè)孔可以看到下面的圖層。遮罩項(xiàng)目可以是填充的形狀、文字對(duì)象、圖形元件的實(shí)例或影片剪輯??梢詫⒍鄠€(gè)圖層組織在一個(gè)遮罩層之下來(lái)創(chuàng)建復(fù)雜的效果。要?jiǎng)?chuàng)建遮罩層,可以將遮罩項(xiàng)目反復(fù)在要用作遮罩的圖層上。和填充或筆觸不同,遮罩項(xiàng)目像是個(gè)窗口,透過(guò)它可以看到位于下面的鏈接層區(qū)域。除了透過(guò)遮罩項(xiàng)目顯示的內(nèi)容之外,其余的所有內(nèi)容都被遮罩層的其余部分隱藏起來(lái)。一個(gè)遮罩層只能包含一個(gè)遮罩項(xiàng)目。按鈕內(nèi)部不能有遮罩層,也不能將一個(gè)遮罩應(yīng)用于另一個(gè)遮罩。與遮罩層連接的常規(guī)圖層實(shí)際上已經(jīng)成了被遮罩層,但它保留了常規(guī)層的所有功能,可以使用任何被連接圖層上的多個(gè)元件、對(duì)象和文本,甚至可以將它們處理成動(dòng)畫(huà)。簡(jiǎn)言之,遮罩層是包括用作遮掩的實(shí)際對(duì)象的層,與被遮罩層是一個(gè)受遮罩層影響的層。遮罩層可以有多個(gè)與之相聯(lián)系的或相連接的被遮罩層。與遮罩層連接的常規(guī)圖層中的內(nèi)容只能通過(guò)遮罩層上具有實(shí)心對(duì)象(如圓、正方形、群組、文本甚至元件)的區(qū)域顯示??梢詫⒄谡謱由系倪@些對(duì)象做成動(dòng)畫(huà)以創(chuàng)建移動(dòng)的遮罩層。創(chuàng)建一個(gè)遮罩層的操作步驟如下:(1)創(chuàng)建一個(gè)常規(guī)層,并在上面畫(huà)出將要透過(guò)遮罩的洞顯示的圖形與文本。(2)單擊時(shí)間軸左下角的“插入圖層”命令,新建一個(gè)圖層。(3)在新圖層上創(chuàng)建填充形狀、文字或元件實(shí)例。(4)右擊新建圖層,從彈出的快捷菜單中選擇“遮罩層”命令。此時(shí)該圖層即轉(zhuǎn)換為遮罩層,并用一個(gè)遮罩層圖標(biāo)來(lái)表示。緊貼它下面的圖層將連接到遮罩層,其內(nèi)容會(huì)透過(guò)遮罩層上的填充區(qū)域顯示出來(lái)。被遮罩的圖層的名稱(chēng)將以縮進(jìn)形式顯示,其圖標(biāo)將更改為一個(gè)被遮罩的圖層的圖標(biāo)。(5)鎖定遮罩層和被遮住的圖層,既可在flash中顯示遮罩效果。3.4濾鏡和混合模式使用濾鏡,可以為文本、按鈕和影片剪輯增添有趣的視覺(jué)效果,并且可以將投影、模糊、發(fā)光和斜角等圖形效果應(yīng)用于圖形元素。flash所獨(dú)有的一個(gè)功能是可以使用補(bǔ)間動(dòng)畫(huà)讓?xiě)?yīng)用的濾鏡活動(dòng)起來(lái)。例如,如果創(chuàng)建一個(gè)具有投影的球(既球體),可以在時(shí)間軸將投影位置從起始幀移動(dòng)到終止幀,來(lái)模擬光源從對(duì)象一側(cè)移動(dòng)到另一側(cè)的效果應(yīng)用濾鏡后,可以隨時(shí)改變其選項(xiàng),或者重新調(diào)整濾鏡順序以試驗(yàn)組合效果。在屬性檢查器中,可以啟用、禁用或者刪除濾鏡。刪除濾鏡時(shí),對(duì)象恢復(fù)原來(lái)的外觀。通過(guò)選擇對(duì)象,可以查看應(yīng)用于該對(duì)象的濾鏡;該操作會(huì)自動(dòng)更新屬性檢查器中所選對(duì)象的列表。每個(gè)濾鏡都包含控件,可以調(diào)整所應(yīng)用濾鏡的強(qiáng)度和質(zhì)量。在運(yùn)行速度較慢的計(jì)算機(jī)上,使用較低的設(shè)置可以提高性能。如果在一系列不同性能的計(jì)算機(jī)上創(chuàng)建回放內(nèi)容,或者不能確定觀眾所使用計(jì)算機(jī)的計(jì)算能力,應(yīng)將質(zhì)量級(jí)別設(shè)置為低,以實(shí)現(xiàn)最佳的回放性能。(注:應(yīng)用于對(duì)象的濾鏡類(lèi)型、數(shù)量和質(zhì)量會(huì)影響swf文件的播放性能。對(duì)象應(yīng)用的濾鏡越多,為正確顯示用戶(hù)創(chuàng)建的視覺(jué)效果,macromedia flash player要處理的計(jì)算量也就越大。因此,對(duì)于一個(gè)給定對(duì)象,建議用戶(hù)只應(yīng)用有限數(shù)量的濾鏡。)在flash中,使用混合模式可以創(chuàng)建復(fù)合圖像。復(fù)合是改變兩個(gè)或兩個(gè)以上重疊對(duì)象的透明度或者顏色相互關(guān)系的過(guò)程。使用混合,可以混合重疊影片剪輯中的顏色,從而創(chuàng)造獨(dú)特的效果?;旌夏J揭矠閷?duì)象和圖像的不透明增添了控制尺度??梢允褂胒lash混合模式來(lái)創(chuàng)建突出顯示或陰影效果,以透顯下層圖像的細(xì)節(jié)或者對(duì)不飽和的圖像涂色?;旌夏J桨@些元素:(1)混合顏色:應(yīng)用于混合模式的顏色。(2)不透明度:應(yīng)用于混合模式的透明度。(3)基準(zhǔn)顏色:混合顏色下的像素的顏色。(4)結(jié)果顏色:基準(zhǔn)顏色的混合效果。第四章 播放器界面功能需求分析(1)視頻框/進(jìn)度條/列表等美工 給人以立體、醒目、輕松的視覺(jué)效果。(2)常見(jiàn)播放器按鈕的制作 每個(gè)按鈕都有3中狀態(tài):彈起、指針經(jīng)過(guò)、按下。這里只需要“彈起”和“指針經(jīng)過(guò)”兩種狀態(tài)即可。有區(qū)于鼠標(biāo)是否在該按鈕上(即按鈕是否在鼠標(biāo)點(diǎn)擊范圍里)。(3) 暫停/繼續(xù)按鈕的切換顯示 當(dāng)影片狀態(tài)為停止時(shí)或暫停時(shí),“;”按鈕隱藏而“4”按鈕顯現(xiàn);當(dāng)影片狀態(tài)為正在播放時(shí),“4”按鈕隱藏而“;”按鈕顯現(xiàn)。(4) 音量按鈕上的菜單效果 鼠標(biāo)移入音量按鈕既顯出音量控制梯形圖;鼠標(biāo)移出梯形圖或音量按鈕亦隱藏音量控制梯形圖。(5) 音量大小圖形控制 鼠標(biāo)點(diǎn)擊音量指示梯形圖,音量大小得到設(shè)置,同時(shí)更新音量指示梯形圖。(6) 雙擊視頻區(qū)完成“全屏模式”與“完整模式”間的切換 flash 8中,鼠標(biāo)動(dòng)作里沒(méi)有雙擊鼠標(biāo)的動(dòng)作。這就需要變通達(dá)到雙擊切換的控制效果。(7) 當(dāng)前播放曲目著重顯示 在播放列表里,將正在播放的曲目用其他顏色著重標(biāo)出。以重新刷新列表的html文本實(shí)現(xiàn)。(8) 對(duì)盜用swf的給以友情提示 當(dāng)其他網(wǎng)站調(diào)用播放器時(shí),播放器提示“非法登入”同時(shí)提供“返回主頁(yè)”的鏈接。(9) flash文件優(yōu)化 優(yōu)化庫(kù)里文件:刪除無(wú)用元件、合并相同元件以減少編譯后的文件體積。第五章 播放器界面結(jié)構(gòu)分析5.1界面需求橫向分析(場(chǎng)景幀)播放器不同于動(dòng)畫(huà),需要很多幀。該播放器在場(chǎng)景里只需要4幀。每一幀都對(duì)應(yīng)播放器的一種狀態(tài)。是通過(guò)代碼在對(duì)應(yīng)幀中跳轉(zhuǎn)的。幀之間關(guān)系示意圖如下:第一幀第二幀第三幀第四幀圖1:場(chǎng)景跳轉(zhuǎn)幀關(guān)系示意圖第一幀 數(shù)據(jù)載入界面 當(dāng)用戶(hù)剛打開(kāi)播放器時(shí)候,播放器要訪問(wèn)網(wǎng)絡(luò)請(qǐng)求播放列表(過(guò)程如圖2:flash載入播放列表示意圖)。播放器請(qǐng)求播放列表到播放器得到頁(yè)面返回播放列表之間會(huì)有不定時(shí)長(zhǎng)的網(wǎng)絡(luò)延遲。此期間,要給用戶(hù)提示一個(gè)等待的畫(huà)面和提示。也給主flash載入用戶(hù)當(dāng)?shù)靥鞖忸A(yù)報(bào)的小swf以時(shí)間。腳 本文 件data返回查找結(jié)果返回as腳本訪問(wèn)url查找數(shù)據(jù)庫(kù)flash第一幀圖2:flash載入播放列表示意圖同時(shí),得到的播放列表是一長(zhǎng)串字符,賦在變量“concent”里,該幀也分割處理該字符串,以數(shù)組形式存放曲目。方便以后使用。第二幀 初始化視頻連接和變量并定義一些函數(shù) 視頻連接對(duì)象、聲音對(duì)象的初始化;時(shí)間格式化函數(shù):timeformat()、播放函數(shù):playflv()的定義。第三幀 完整模式頁(yè)面 該頁(yè)面有完整的各種控制按鈕、進(jìn)度條、播放列表、天氣預(yù)報(bào)和場(chǎng)景1/3大小視頻區(qū)。第四幀 全屏模式頁(yè)面 場(chǎng)景100%的視頻區(qū)和一個(gè)退出全屏按鈕。5.2界面需求縱向分析(場(chǎng)景層)flash層的概念使得場(chǎng)景上各個(gè)元件、圖片、組件顯得井井有條。大大的加快了flash制作的速度、提高了工作效率。運(yùn)用層還可以使用遮罩、引導(dǎo)等來(lái)做特殊的效果。以下是場(chǎng)景中層的說(shuō)明(由上至下):1. actionscript : 用以放置幀動(dòng)作。2. 關(guān)于 : 版權(quán)、制作者信息。3. 外框 : 在網(wǎng)頁(yè)swf框架不成比例時(shí),用以遮蓋場(chǎng)景以外的flsah元素。4. 天氣 : 外部載入的,第三方提供的天氣預(yù)報(bào)的swf。5. 進(jìn)度條as : 有關(guān)下載/播放進(jìn)度條的幀動(dòng)作。6. 全屏 : 有關(guān)全屏控制的一些按鈕和動(dòng)作。7. 音量控制 : 有關(guān)音量控制的一些按鈕和動(dòng)作。8. 警示框 :曲目播放結(jié)束后或曲目鏈接無(wú)效,而自動(dòng)跳轉(zhuǎn)下一首時(shí)提示給用戶(hù)。9. 按鈕/進(jìn)度條 : 所有按鈕和進(jìn)度條的相關(guān)元件和元件動(dòng)作。10. 列表 : 曲目列表相關(guān)元件11. 視頻框架樣式 : 視頻區(qū)外圍框架的樣式效果。12. 背景動(dòng)畫(huà) : 完整模式中飛花和“氣泡”的動(dòng)畫(huà)。13. 背景 : 載入頁(yè)面的載入動(dòng)畫(huà)、完整頁(yè)面的風(fēng)景背景、全屏的黑屏背景。第六章 色彩的應(yīng)用色彩給人視覺(jué)上造成的沖擊力是最為直接與迅速的。作為第一視覺(jué)語(yǔ)言,色彩在多媒體制作中的作用是字體與圖像等其他要素所無(wú)法替代的。由于對(duì)色彩的愛(ài)好是人類(lèi)一種最本能、最普遍的美感,它對(duì)觀看者的影響便是最為直接的。設(shè)計(jì)者要考慮觀看者最初一瞬間的色彩感覺(jué),牢牢地捕捉住他們的眼光,以達(dá)到引起關(guān)注的目的。較高藝術(shù)性的媒體播放器是內(nèi)容與美的形式的統(tǒng)一,應(yīng)集結(jié)構(gòu)對(duì)稱(chēng)、色彩柔和、搭配合理、審美性強(qiáng)為一體。6.1色彩在界面中的作用1. 色彩可以被當(dāng)作一種很好的格式規(guī)劃工具來(lái)使用。特別是當(dāng)同一界面里包容大量信息,且利用慣常的空間區(qū)域分隔的方法來(lái)對(duì)它們進(jìn)行組織和規(guī)劃非常困難的時(shí)候。我們則用同一顏色顯示它們,用顏色的紐帶將它們聯(lián)系起來(lái)。如果我們要提醒用戶(hù)對(duì)界面上某一部分的注意,可以采用高亮度顯示或動(dòng)畫(huà)顯示等技巧,但這些辦法可能都不如利用顏色來(lái)得靈活方便。2. 色彩本身充當(dāng)有特定意義的視覺(jué)符號(hào)顏色是有意義的。這種意義可能來(lái)自于人們的長(zhǎng)期共識(shí),約定俗成。利用顏色的這種性質(zhì),我們可以把它當(dāng)成一個(gè)很重要的屏幕元素來(lái)使用。比如:綠色的按鈕表示“開(kāi)始”;紅色的按鈕表示“停止”;白色的邊框表示標(biāo)題區(qū);藍(lán)色的邊框表示正文區(qū);紅色區(qū)域顯示警告信息;黃色區(qū)域提供幫助信息。這些都將大大提高人機(jī)界面的親和性。在將色彩作為某種意義符號(hào)或渲染感情的手段時(shí),設(shè)計(jì)者必須要注意:你所指定的這種色彩意義或情感象征一定要為用戶(hù)所了解并接受,不能與他的固有色彩經(jīng)驗(yàn)發(fā)生沖撞。還有,在整個(gè)設(shè)計(jì)中,色彩的意義一定要具有穩(wěn)定性、一致性。3. 借助色彩逼真地反映客觀世界。我們周?chē)氖澜缡俏宀世_紛的,特別需要以照片、動(dòng)畫(huà)、活動(dòng)視頻等來(lái)展示一些客觀對(duì)象和過(guò)程,這時(shí)候逼真的彩色顯得尤其重要。6.2 色彩的運(yùn)用在選用色彩設(shè)計(jì)多媒體播放器界面時(shí),最重要的是明確色彩使用的目的和可能的作用,力求發(fā)揮色彩輔助交流、促進(jìn)信息傳播的作用。要做到合理運(yùn)用色彩應(yīng)注意以下幾個(gè)方面:1. 對(duì)色彩的基本認(rèn)識(shí)。在選用色彩時(shí),最基本的要求是了解人眼的視覺(jué)系統(tǒng):明確色彩濫用可能導(dǎo)致的問(wèn)題,并盡量去避免它;考慮色彩搭配帶來(lái)的情景效應(yīng);考慮視野環(huán)境因素等等。最重要的是明確色彩的作用是輔助交流,我們最終要達(dá)到的目標(biāo)是完成信息從機(jī)到人的有效傳遞。換言之,色彩的作用應(yīng)是為界面增色,而界面設(shè)計(jì)不可依賴(lài)色彩。2. 避免同時(shí)使用太多顏色。同一畫(huà)面中不要使用太多的顏色,一般以四五種為限。過(guò)多的顏色易于引起視覺(jué)疲勞。我們可以用一些其他的技巧,如:空間劃分、層次變化及幾何形狀等來(lái)配合顏色使用,以增加屏幕的視覺(jué)效果。3. 用色彩來(lái)起強(qiáng)調(diào)作用。在同調(diào)的色中,局部加上不同調(diào)的色,形成視覺(jué)美點(diǎn)。色彩的點(diǎn)綴在界面中產(chǎn)生一種緊張感,成為整體的一個(gè)著力點(diǎn)。點(diǎn)綴的色應(yīng)該采用小的面積,并與其他色形成強(qiáng)烈反差,以加強(qiáng)吸引力,形成視覺(jué)中心。根據(jù)一些色彩知識(shí)與應(yīng)用,故我選橙黃色作為播放器界面的主色調(diào)。與金屬相結(jié)合的黃色,具有快樂(lè),希望,智慧和輕快的個(gè)性,它的明度最高,而且是理論性思考事情的“理智之色”??吹近S色,便容易提高自制力和注意力。 喜好黃色的人,大多屬于理論家類(lèi)型。雖然才能出眾,卻容易恃才傲物。由于自尊心強(qiáng),又對(duì)自己的能力極具信心,因此,經(jīng)常希望得到別人的肯定和贊賞。盡管如此,有時(shí)又能溫順?lè)?,表現(xiàn)出合作的個(gè)性,由此而言,毫無(wú)疑問(wèn),愛(ài)好黃色的人是一位真正生命力強(qiáng)勝的人。而橙色是一種激奮的色彩,具有輕快,歡欣,熱烈,溫馨,時(shí)尚的效果。它代表著節(jié)日的喜慶,充滿了生機(jī),在一間用橙色裝飾的房子里想要變得憂郁悲傷都是件困難的事情。橙色能吸引人們的注意力,給人們帶來(lái)能量、熱力、樂(lè)趣和青春活力。第七章 播放器界面實(shí)現(xiàn)7.1 視頻、進(jìn)度條和列表界面等美工視頻區(qū)背景畫(huà)一白色圓角矩形。中間鏤空,鏤空部分與視頻區(qū)吻合。以作為視頻框,使得視頻區(qū)凸顯于播放器背景。把圓角矩形轉(zhuǎn)換為影片剪輯(圖片不可使用濾鏡效果)。選中該影片剪輯,在“屬性”“濾鏡”使用投影,強(qiáng)度設(shè)置為140,其他默認(rèn),進(jìn)度條也一樣。這樣做可以增加視覺(jué)上的立體效果,不容易與背景混為一起。列表里,動(dòng)態(tài)文本框外圍也擴(kuò)大一些畫(huà)一個(gè)矩形,填充色為灰色,20%的透明(可以隨意調(diào)節(jié)以適合為宜),筆觸顏色“#cc3300”、筆觸高度“2”、筆觸樣式“虛線”,用以表示列表文本框。將該矩形也轉(zhuǎn)為影片剪輯做如上的濾鏡。動(dòng)態(tài)文本框設(shè)置字體字號(hào)和和顏色(宋體、12號(hào)、黑色)。文本框類(lèi)型為“多行”、變量為“l(fā)ist”,另外要注意“”按鈕要點(diǎn)選,表示list里的文本表現(xiàn)成html。同時(shí)添加濾鏡“發(fā)光”,顏色選用“#ff8631”其他默認(rèn)。這用以在列表字周?chē)邪l(fā)光顏色,用以在播放器背景前較容易的看清字。調(diào)節(jié)擺放各個(gè)按鈕和視頻、列表、進(jìn)度條還有天氣預(yù)報(bào)的位置。如下圖3:圖3:播放器頁(yè)面設(shè)計(jì)7.2 9個(gè)常見(jiàn)播放器按鈕的制作2個(gè)上下首、2個(gè)快進(jìn)后退、停止、播放、暫停、全屏、靜音。其中除了“靜音”為影片剪輯,其他類(lèi)型為按鈕。每個(gè)按鈕都只有2幀:第一幀彈起為水晶效果(上下有白色光亮)、第二幀指針經(jīng)過(guò)為平板效果,得以區(qū)分鼠標(biāo)當(dāng)前是否在該按鈕上?!办o音”為4幀的影片剪輯,是2個(gè)按鈕樣式(同上,一個(gè)按鈕兩個(gè)效果即兩幀) 和 。用代碼控制顯示,對(duì)應(yīng)表示當(dāng)前是否為靜音。另外,當(dāng)按鈕為 同時(shí)鼠標(biāo)在按鈕上,即顯示音量調(diào)節(jié)梯形圖()。以完成靜音和音量大小的控制。7.3 暫停/繼續(xù)按鈕的切換顯示這兩個(gè)按鈕為重疊疊放。給這兩個(gè)按鈕命名實(shí)例名稱(chēng)“button_pause” 和“button_play”。每個(gè)按鈕動(dòng)作上使用點(diǎn)擊動(dòng)作“on (release)”來(lái)設(shè)置自身和另一按鈕的“_visible”屬性。如下“button_play”按鈕的動(dòng)作:on (release) /釋放鼠標(biāo)my_ns.pause(); /影片暫停和播放間的切換button_play._visible = false; /自身不顯示button_pause._visible = true; /暫停按鈕顯示出來(lái)因?yàn)椤皶和!焙汀巴V埂卑粹o對(duì)應(yīng)的是同一個(gè)“繼續(xù)”或叫“開(kāi)始”的按鈕。所以只用上面的辦法不太方便控制按鈕的顯現(xiàn)。所以同時(shí)采用了視頻狀態(tài)監(jiān)聽(tīng)(netstream.onstatus 處理函數(shù)):onstatus = function(infoobject:object) 每當(dāng)狀態(tài)更改或發(fā)布針對(duì) netstream 對(duì)象的錯(cuò)誤時(shí)調(diào)用。如果您要對(duì)此事件處理函數(shù)做出響應(yīng),則必須創(chuàng)建一個(gè)函數(shù)來(lái)處理該信息對(duì)象。以下事件在發(fā)生某些 netstream 活動(dòng)時(shí)通知您。代碼屬性含義netstream.buffer.empty數(shù)據(jù)的接收速度不足以填充緩沖區(qū)。數(shù)據(jù)流將在緩沖區(qū)重新填充前中斷,此時(shí)將發(fā)送 netstream.buffer.full 消息,并且該流將重新開(kāi)始播放。netstream.buffer.full緩沖區(qū)已滿并且流將開(kāi)始播放。netstream.buffer.flush數(shù)據(jù)已完成流式處理,剩余的緩沖區(qū)將清空。netstream.play.start播放已開(kāi)始。netstream.play.stop播放已結(jié)束。netstream.play.streamnotfound無(wú)法找到傳遞給 play() 方法的 flv。netstream.seek.invalidtime對(duì)于使用漸進(jìn)式下載方式下載的視頻,用戶(hù)已嘗試跳過(guò)到目前為止已下載的視頻數(shù)據(jù)的結(jié)尾或在整個(gè)文件已下載后跳過(guò)視頻的結(jié)尾進(jìn)行搜尋或播放。netstream.seek.notify搜尋操作完成。按鈕監(jiān)聽(tīng)部分代碼如下:var my_ns:netstream = new netstream(my_nc);my_ns.onstatus = function(infoobject:object) if (infoobject.code = netstream.play.start) button_play._visible = false;button_pause._visible = true;7.4 音量按鈕上的菜單效果音量按鈕(即上面提到的靜音按鈕)里4幀,每一幀都有個(gè)“stop()”。第一幀里是一個(gè)只有一幀的按鈕,是彈起情況下的有聲圖案。該按鈕上動(dòng)作為“ on (rollover) this.gotoandstop(2); ”,當(dāng)鼠標(biāo)滑入時(shí)該影片剪輯跳圖4:空按鈕(亮藍(lán)部分)轉(zhuǎn)并停在第二幀。第二幀里兩個(gè)按鈕和一個(gè)控制音量的影片剪輯。一個(gè)按鈕是指針經(jīng)過(guò)下的有聲圖案,一個(gè)是以音量控制的影片剪輯和上面按鈕之外空白部分為熱點(diǎn)的空按鈕(如圖4)。空白按鈕的功能是鼠標(biāo)經(jīng)過(guò)熱點(diǎn)(圖中亮藍(lán)部分,不與圖上按鈕和剪輯重疊)時(shí),“on (rollover, rollout, dragover, dragout) this.gotoandstop(1); ”以達(dá)到移出音量按鈕和剪輯后,音量按鈕回位到彈起狀態(tài)。即實(shí)現(xiàn)菜單效果。7.5 音量大小圖形控制在上面“音量控制的影片剪輯”里是用到了遮罩。用代碼控制遮罩下的橘紅色的矩形影片剪輯的“_xscale”屬性的值來(lái)達(dá)到梯形圖示聲音大小。首先在最底層畫(huà)一個(gè)白色的矩形,作為背景。倒數(shù)第二層繪制一些逐漸變高的矩形,并調(diào)整好間距,以達(dá)到梯形效果。筆觸為空,填充為灰色。復(fù)制剛剛的梯形圖那幀,在新建一頂部圖層并粘貼剛復(fù)制的幀。在這一幀下面在新建一圖層,繪制一個(gè)橘紅色的矩形,矩形大小要?jiǎng)倓偤酶采w整個(gè)梯形圖。轉(zhuǎn)換橘紅的矩形為影片并命名實(shí)例為“vol_img”。再設(shè)置第一層為遮罩,此時(shí)第二層被自動(dòng)設(shè)為了被遮罩層,其他為正常層。返回上一元件,命名“音量控制的影片剪輯” (即圖4中按鈕上的剪輯)實(shí)例名為“vol_logo”。在該實(shí)例上添加動(dòng)作如下:on (press, release, releaseoutside, dragover, dragout) if (_xmouse40.7) /40.7是橘紅色矩形的寬度mouse_x = 40.7; else if (_xmouse0) mouse_x = 0; else mouse_x = _xmouse;_root.now_vol = math.floor(mouse_x/40.7*100);/_root.now_vol為當(dāng)前音量_root.flv_audio.setvolume(_root.now_vol);this.vol_img._xscale = _root.now_vol; 當(dāng)用戶(hù)拖拽、點(diǎn)擊梯形中位置時(shí)會(huì)調(diào)節(jié)聲音大小。在該幀中添加幀動(dòng)作:stop()this.vol_logo.vol_img._xscale = _root.now_vol;這樣在每次彈出梯形圖時(shí)表示的就是當(dāng)前系統(tǒng)的音量。7.6 雙擊視頻區(qū)完成“全屏模式”與“完整模式”間的切換在actionscript 2.0里全屏是在導(dǎo)出為exe文件時(shí)才可有效的:fscommand(fullscreen, true); /為false時(shí)為取消全屏這句代碼在web里的swf文件中無(wú)效。那么要在web中的swf里完成全屏的切換,就沒(méi)有辦法了嗎?在as 2.0里是做不到的。但是as 3.0里提供了這樣的方法:stagedisplaystate = fullscreen; /全屏stagedisplaystate = normal; /取消全屏在需要的地方添加上這些代碼編譯即可。但是,當(dāng)瀏覽時(shí)只有adobe player 9.0 以上的播放器才能有效果。但是按鈕動(dòng)作里沒(méi)有雙擊的動(dòng)作函數(shù)。幸好還有變通的方法來(lái)達(dá)到一樣的效果:首先在視頻區(qū)域上畫(huà)上一樣大小的矩形,轉(zhuǎn)換為按鈕。編輯按鈕,把第一幀(“彈起”)移動(dòng)到“點(diǎn)擊”幀上,其他三個(gè)幀為空白關(guān)鍵楨。這就形成了只有熱點(diǎn),卻看不見(jiàn)的“空按鈕”。返回到場(chǎng)景,調(diào)整這個(gè)空按鈕以蓋住整個(gè)視頻區(qū)。在該按鈕上添加動(dòng)作:on (press) stagedisplaystate = fullscreen; /全屏gotoandstop(4); /主場(chǎng)景第四幀,全屏頁(yè)面再?gòu)?fù)制該空按鈕(不是幀)并粘貼。刪掉剛剛新粘貼出來(lái)的空按鈕上的動(dòng)作,并命名實(shí)例為“full_pin”并調(diào)整好位置以覆蓋整個(gè)視頻區(qū)。在該場(chǎng)景幀中添加幀動(dòng)作:function checkfull() full_pin._visible = true;clearinterval(full_check);full_pin.onpress = function() full_pin._visible = false; /隱藏最上面一個(gè)空按鈕full_check = setinterval(checkfull, 300);實(shí)現(xiàn)過(guò)程是:有全屏代碼的空按鈕在后復(fù)制粘貼出來(lái)的空按鈕下面。幀動(dòng)作里是說(shuō),當(dāng)最上面一個(gè)空按鈕被點(diǎn)擊后這個(gè)空按鈕被隱藏(隱藏不限于看不見(jiàn),而是在場(chǎng)景中不存在)。下面的有全屏代碼的空按鈕被顯示出來(lái),可以被點(diǎn)擊。當(dāng)300毫秒到了,就執(zhí)行“checkfull()”函數(shù),即顯示剛剛被隱藏的空按鈕,同時(shí)刪除間隔。也就是點(diǎn)擊一次視頻區(qū),在300毫秒內(nèi)再點(diǎn)擊一次視頻區(qū)就算是雙擊了視頻區(qū),就會(huì)執(zhí)行全屏。從全屏模式轉(zhuǎn)到完整模式也是一樣。7.7 當(dāng)前播放曲目著重顯示播放列表顯示的內(nèi)容是在“l(fā)ist”變量里的。對(duì)應(yīng)的動(dòng)態(tài)文本支持html標(biāo)簽,里面就有字體設(shè)置的標(biāo)簽。在每次更新曲目的時(shí)候從“flv_list”數(shù)組里重新組織了更新“l(fā)ist”:for (var i = 0; iflv_list.length; i+) if (now_play = i) /now_play 為當(dāng)前播放的曲目編號(hào)list += +flv_listi0+; else list += + flv_listi0+;此代碼跟在“

溫馨提示

  • 1. 本站所有資源如無(wú)特殊說(shuō)明,都需要本地電腦安裝OFFICE2007和PDF閱讀器。圖紙軟件為CAD,CAXA,PROE,UG,SolidWorks等.壓縮文件請(qǐng)下載最新的WinRAR軟件解壓。
  • 2. 本站的文檔不包含任何第三方提供的附件圖紙等,如果需要附件,請(qǐng)聯(lián)系上傳者。文件的所有權(quán)益歸上傳用戶(hù)所有。
  • 3. 本站RAR壓縮包中若帶圖紙,網(wǎng)頁(yè)內(nèi)容里面會(huì)有圖紙預(yù)覽,若沒(méi)有圖紙預(yù)覽就沒(méi)有圖紙。
  • 4. 未經(jīng)權(quán)益所有人同意不得將文件中的內(nèi)容挪作商業(yè)或盈利用途。
  • 5. 人人文庫(kù)網(wǎng)僅提供信息存儲(chǔ)空間,僅對(duì)用戶(hù)上傳內(nèi)容的表現(xiàn)方式做保護(hù)處理,對(duì)用戶(hù)上傳分享的文檔內(nèi)容本身不做任何修改或編輯,并不能對(duì)任何下載內(nèi)容負(fù)責(zé)。
  • 6. 下載文件中如有侵權(quán)或不適當(dāng)內(nèi)容,請(qǐng)與我們聯(lián)系,我們立即糾正。
  • 7. 本站不保證下載資源的準(zhǔn)確性、安全性和完整性, 同時(shí)也不承擔(dān)用戶(hù)因使用這些下載資源對(duì)自己和他人造成任何形式的傷害或損失。

評(píng)論

0/150

提交評(píng)論