王 瑾
(蘇州工業(yè)職業(yè)技術(shù)學(xué)院 江蘇蘇州 215104)
基于Flash技術(shù)的手機(jī)功能交互式仿真實(shí)現(xiàn)
王 瑾
(蘇州工業(yè)職業(yè)技術(shù)學(xué)院 江蘇蘇州 215104)
為了能夠更方便地了解新推出的各款手機(jī)的新增服務(wù)功能的手機(jī)功能仿真平臺(tái)的制作過程,通過運(yùn)用Flash動(dòng)畫技術(shù)展示手機(jī)功能可以移植在企業(yè)網(wǎng)站以及大廳觸摸屏上。較為詳細(xì)地?cái)⑹隽藢?shí)現(xiàn)過程中的手機(jī)截屏軟件或數(shù)碼相機(jī)及Photoshop圖像處理軟件來收集處理各種素材,運(yùn)用Flash動(dòng)畫技術(shù)及Action Script腳本語言來實(shí)現(xiàn)平臺(tái)功能動(dòng)畫的制作和系統(tǒng)的整合。
Flash技術(shù);手機(jī);交互式仿真
隨著信息技術(shù)的飛速發(fā)展,F(xiàn)lash技術(shù)的運(yùn)用越來越普及,除了常見的教學(xué)課件演示、實(shí)驗(yàn)動(dòng)畫模擬、過程仿真實(shí)現(xiàn)、可視化仿真[1]及測(cè)試系統(tǒng)等方面的應(yīng)用之外,F(xiàn)lash也因其體積小、實(shí)現(xiàn)技術(shù)相對(duì)簡(jiǎn)單、使用方式靈活等特點(diǎn)[2],開始涉及生活中的方方面面,為人們的生活帶來越來越多的方便。本文介紹的手機(jī)功能仿真平臺(tái)是配合某企業(yè)推出新款手機(jī)的契機(jī),為了讓更多的民眾能夠更方便地了解企業(yè)新推出的各款手機(jī)的新增服務(wù)功能的使用方法而提出的需求,所開發(fā)的Flash動(dòng)畫展示的手機(jī)功能可以移植在網(wǎng)站以及觸摸屏上,方便用戶隨時(shí)隨地了解手機(jī)新功能的使用方法。期望通過本文的介紹,可以讓更多的人靈活應(yīng)用Flash技術(shù)去發(fā)掘可以方便人們生活的各種交互式仿真平臺(tái)。
整個(gè)系統(tǒng)根據(jù)制作過程分為4個(gè)模塊:手機(jī)功能的分析、素材的收集處理、功能動(dòng)畫的制作、系統(tǒng)的整合及使用,以上模塊的處理主要是通過Flash動(dòng)畫技術(shù)及Action Script腳本語言來實(shí)現(xiàn)的,個(gè)別環(huán)節(jié)還涉及到手機(jī)截屏軟件或數(shù)碼相機(jī)及Photoshop圖像處理軟件的使用,下面將作具體介紹。
在進(jìn)行設(shè)計(jì)之前,首先要針對(duì)手機(jī)要展示的功能進(jìn)行需求分析,通過使用和了解手機(jī)的各項(xiàng)菜單及功能,結(jié)合用戶需求,明確需要展示的功能菜單及菜單細(xì)項(xiàng),是簡(jiǎn)單展示還是要與用戶進(jìn)行互動(dòng),哪些功能需要重點(diǎn)說明,所有需求都要使用文檔進(jìn)行詳盡的說明,為后面的設(shè)計(jì)制作提供依據(jù)。
在完成需求之后,進(jìn)入到素材收集階段。系統(tǒng)是通過Flash技術(shù)來仿真手機(jī)的功能菜單應(yīng)用,故而素材以手機(jī)外觀圖和菜單屏幕展示為主。手機(jī)外觀圖的收集可以通過網(wǎng)絡(luò)搜索合適的高清圖片,如果網(wǎng)絡(luò)圖片在展示角度或清晰度不理想的情況下,也可以使用相機(jī)在合理的光線條件下自行拍攝,并使用Photoshop軟件進(jìn)行圖片處理以達(dá)到理想的效果;而圖片采集量比較大的菜單屏幕,根據(jù)手機(jī)功能可分別選擇兩種不同的收集方式:支持屏幕軟件截屏的手機(jī)型號(hào),可以直接通過Screen Capture等截屏軟件直接獲取屏幕,通過這種方法獲得的素材比例、色調(diào)都比較理想,可以直接使用;若手機(jī)無截屏功能支持,對(duì)于需要采集的屏幕信息只能通過數(shù)碼相機(jī)拍照逐一獲取,同時(shí),由于拍攝條件的限制,后期還需要使用Photoshop軟件對(duì)拍攝圖片的大小、亮度、變形等屬性進(jìn)行對(duì)應(yīng)的調(diào)整來滿足要求。需要注意的是,這個(gè)環(huán)節(jié)手機(jī)的素材圖片容量比較大,除了截屏的時(shí)候要有條不紊地進(jìn)行之外,還應(yīng)該按照手機(jī)功能菜單以及動(dòng)畫的制作時(shí)的使用順序合理命名文件以及使用文件夾分門別類地存儲(chǔ),在導(dǎo)入Flash軟件進(jìn)行制作的時(shí)候也應(yīng)該注意圖片在庫中的管理,為后面的動(dòng)畫制作提供方便。
具體的動(dòng)畫演示或是提供用戶交互的動(dòng)畫都是在影片剪輯中制作的,便于整合時(shí)期通過調(diào)用各個(gè)影片剪輯來實(shí)現(xiàn)最終的效果,每款手機(jī)根據(jù)菜單功能的不同都會(huì)有很多對(duì)應(yīng)的動(dòng)畫需要制作,下面根據(jù)動(dòng)畫類型的不同將這個(gè)模塊分為兩部分來介紹。
1)外觀展示動(dòng)畫。外觀展示動(dòng)畫的主要功能是通過旋轉(zhuǎn)按鈕來對(duì)手機(jī)的四個(gè)旋轉(zhuǎn)面進(jìn)行展示,并同時(shí)可以點(diǎn)擊按鈕來了解各個(gè)接口的功效和參數(shù),讓用戶非常直觀地了解手機(jī)的造型和接口。
實(shí)現(xiàn)重點(diǎn)在于動(dòng)畫幀的跳轉(zhuǎn)控制和接口動(dòng)畫的有效調(diào)用:動(dòng)畫幀跳轉(zhuǎn)部分根據(jù)對(duì)應(yīng)的幀的位置直接選擇使用“轉(zhuǎn)到并播放(gotoAndPlay)”或“轉(zhuǎn)到并停止(gotoAndStop)”或“下一幀(nextFrame)”或“前一幀(preFrame)”命令即可;接口動(dòng)畫的調(diào)用主要是通過使用setProperty()函數(shù)對(duì)制作好的接口動(dòng)畫剪輯設(shè)置可視化屬性(_visible),當(dāng)單擊對(duì)應(yīng)的接口按鈕時(shí),對(duì)應(yīng)該接口的影片剪輯的可視化屬性設(shè)置為true,而其他接口所對(duì)應(yīng)的影片剪輯的可視化屬性則相應(yīng)設(shè)置為false。在按鈕控制方面根據(jù)需求分別通過“按鈕經(jīng)過(rollOver)”和“釋放按鈕(release)”兩種不同的形式來分別激活按鈕。舉例說明如下。
點(diǎn)擊按鈕后跳轉(zhuǎn)至下一幀:
鼠標(biāo)經(jīng)過或點(diǎn)擊按鈕之后,設(shè)置該按鈕對(duì)應(yīng)的接口參數(shù)的影片剪輯為可見,其他接口為不可見:
2)菜單功能展示動(dòng)畫。菜單功能部分的動(dòng)畫根據(jù)功能的重要與否也分為兩種類型,常見手機(jī)功能會(huì)在用戶選擇菜單后直接播放使用情況,重點(diǎn)需要用戶留意的功能則會(huì)讓用戶根據(jù)閃爍點(diǎn)的提示實(shí)際操作進(jìn)行逐步深入的了解,而這樣的一個(gè)流程也是通過在影片剪輯動(dòng)畫中不斷設(shè)置按鈕來實(shí)現(xiàn)用戶交互的。具體實(shí)現(xiàn)情況與上面的幀跳轉(zhuǎn)非常類似,這里就不再贅述。
在最終的整合部分,主要完成的任務(wù)是將以上制作的各種動(dòng)畫經(jīng)由菜單進(jìn)行調(diào)用,同時(shí)還要在一側(cè)的面板中顯示對(duì)應(yīng)動(dòng)畫的操作過程的文字描述,以滿足不同用戶需求。
1)使用菜單實(shí)現(xiàn)各功能對(duì)應(yīng)的影片剪輯動(dòng)畫的調(diào)用。使用菜單來調(diào)用各個(gè)動(dòng)畫的效果與上面按鈕調(diào)用接口參數(shù)非常類似,也是通過設(shè)置影片剪輯動(dòng)畫的可視化屬性來完成的,同時(shí)在這里還要考慮二級(jí)菜單的展開和對(duì)應(yīng)面板的可視化屬性設(shè)置。
通過菜單按鈕控制菜單展開和動(dòng)畫顯示:
2)在面板中提供各個(gè)動(dòng)畫演示所對(duì)應(yīng)的操作過程的文字描述。為了讓用戶在觀看動(dòng)畫的同時(shí)還有其他了解菜單功能的途徑,要求系統(tǒng)中提供各個(gè)動(dòng)畫演示所對(duì)應(yīng)的操作過程的文字描述的功能,為此需要根據(jù)菜單的選擇將對(duì)應(yīng)的加載文字生成的字符串顯示在說明面板中。
加載文字并生成字符串:
//LoadVars類可用于Flash和服務(wù)器間傳輸變量
//在#參數(shù)出現(xiàn)的所有位置斷開src1,將其拆分為子字符串,存儲(chǔ)至num數(shù)組};
對(duì)應(yīng)的操作過程的文字描述部分存儲(chǔ)在文本文件中,如以上代碼中的a.txt。文本文件內(nèi)的各段文字之間用#號(hào)隔開,以便字符串的切割和存儲(chǔ)[3]。
整個(gè)系統(tǒng)開發(fā)的最終應(yīng)用成果示意如圖1。
圖1 應(yīng)用成果示意
由于篇幅限制,本文并沒有詳細(xì)敘述系統(tǒng)開發(fā)的每一個(gè)具體環(huán)節(jié),僅將主要的技術(shù)問題進(jìn)行了分析,有興趣實(shí)踐的讀者需要具備一定的圖像處理基礎(chǔ)和Flash動(dòng)畫制作及Action Script腳本語言的基礎(chǔ)。除了完成系統(tǒng)功能本身,還值得注意的是,大量的素材圖片會(huì)加大Flash的發(fā)布文件的體積,在系統(tǒng)的制作過程中,必須充分考慮圖片的存儲(chǔ)格式,以加強(qiáng)Flash的庫管理,盡可能縮小最終發(fā)布文件的體積,以更好地體現(xiàn)Flash文件在網(wǎng)絡(luò)傳播中的優(yōu)勢(shì),減少文件下載時(shí)間,增強(qiáng)用戶舒適度。
[1]張志會(huì).基于Flash的車站作業(yè)可視化仿真[J].鐵路信息化,2009(10):21-22.
[2]張東林,付洪波.Flash動(dòng)畫技術(shù)在電子地圖中的實(shí)際應(yīng)用[J].測(cè)繪與空間地理信息,2007(5):56-58.
[3]王瑾.基于Flash的智能題庫測(cè)試系統(tǒng)的設(shè)計(jì)與實(shí)現(xiàn)[J].蘇州工業(yè)職業(yè)技術(shù)學(xué)院學(xué)報(bào),2009(6):19-20.
Implementation of Mobile Interactive Simulation Based on Flash Technology
WANG Jin
(Suzhou Institute of Industrial Technology,Suzhou 215104,China)
This paper describes the process of building a mobile alternate platform system which helps people know new features of fresh published mobile style,and it can be deployed on the enterprise website or touch screens with applying flash technology.The paper also shows the steps of implementation and integration of the system with using the digital camera,Photoshop,F(xiàn)lash Action Script language.
Flash technology;mobile;interactive simulation
TP 391.9
B
1672-2434(2010)02-0023-03
2010-03-18
王 瑾(1981-),女,講師,碩士,從事研究方向:計(jì)算機(jī)技術(shù)和動(dòng)畫制作