基于Android的繪本圖像處理軟件的設(shè)計與實(shí)現(xiàn)

葛禹婉淇

（陜西學(xué)前師范學(xué)院美術(shù)系，陜西西安710100）

研究表明，兒童對于圖像的認(rèn)知能力更強(qiáng)，其更易在欣賞圖畫的過程中學(xué)習(xí)并理解文字[1]。繪本讀物的出現(xiàn)，能有效培養(yǎng)兒童的閱讀習(xí)慣、藝術(shù)情操和獨(dú)立思考的能力[2-4]。相比于傳統(tǒng)的插畫讀物，繪本讀物結(jié)合使用圖文更能表達(dá)繪本的表意，實(shí)現(xiàn)“圖文合一”[5]。

隨著智能手機(jī)和平板電腦技術(shù)的發(fā)展，移動智能設(shè)備越來越受到兒童和家長的歡迎，而使用互動繪本進(jìn)行兒童的教學(xué)需求也越來越高[8]。傳統(tǒng)的紙質(zhì)繪本以紙張為媒介，使用文字、圖標(biāo)和插畫的方式來表達(dá)與呈現(xiàn)信息。但這種表達(dá)方式是平面的、靜止的，同時紙質(zhì)繪本無法記錄動畫和聲音，不能保證信息的時效性[3]。而數(shù)字繪本以數(shù)字化的形式展示各種信息，具有互動性、實(shí)時性和智能化的特點(diǎn)。一方面，使用文字、圖像和聲音立體化呈現(xiàn)各種信息；另一方面，使用觸摸或點(diǎn)擊的方式進(jìn)行交互，使繪本的閱讀方式更加簡便[2-5]。

數(shù)字圖像處理（Digital Image Processing）[6-10]是通過計算機(jī)對圖像進(jìn)行去除噪聲、增強(qiáng)、復(fù)原、分割、提取特征等處理的方法和技術(shù)。因此本文將數(shù)字圖像處理的優(yōu)勢運(yùn)用到繪本的制作中。

紙質(zhì)繪本與數(shù)字繪本存在交互體驗(yàn)方式的不同、感官體驗(yàn)效果不同、存儲信息的容量不同和發(fā)行方式的不同。針對數(shù)字繪本的這些優(yōu)勢，本文基于Android平臺，設(shè)計了一款繪本圖像處理軟件。該軟件結(jié)合文字、圖像、動畫和語音等表達(dá)方式，使用觸摸與點(diǎn)擊的方式進(jìn)行交互，用戶在使用該軟件閱讀繪本的同時，也能進(jìn)行簡單的圖像處理操作，個性化完善繪本。

1 總體功能模塊總體

兒童互動繪本軟件基于Cocos 2D開發(fā)框架設(shè)計，該框架包括圖形引擎、聲音引擎、物理引擎、Box2d、Chipmunk和腳本庫Lua，支持Android加速器和觸控，可大幅提高軟件的開發(fā)效率[15]。軟件啟動后，將播放一段開機(jī)動畫，然后進(jìn)入主菜單，用戶可選擇進(jìn)入閱讀模塊或動畫設(shè)計、音效設(shè)計等功能模塊。此外，在每個模塊中均可點(diǎn)擊返回按鈕返回主界面。同時，還可以使用Home鍵退出系統(tǒng)。

軟件總體功能模塊如圖1所示，包括主菜單模塊、動畫設(shè)計模塊和音效設(shè)計模塊。在主菜單模塊可以進(jìn)行內(nèi)容瀏覽、目錄選擇和系統(tǒng)設(shè)置，用戶可選擇靜態(tài)瀏覽與動態(tài)瀏覽兩種模式，也可設(shè)置系統(tǒng)的音頻；本系統(tǒng)的動畫設(shè)計模塊可以制作開機(jī)動畫和視頻播放，亦可再該模塊進(jìn)行一些簡單的圖像處理操作，該模塊支持的視頻格式包括MP4和MOV；音效設(shè)計模塊用于設(shè)置動畫的音效，烘托氛圍，該模塊支持的音頻格式有MP3、WAV、AAC和AMR等。

圖1 系統(tǒng)總體功能模塊

閱讀模塊是該系統(tǒng)的核心，用戶可以選擇動態(tài)閱讀和靜態(tài)閱讀兩種模式。在閱讀?？梢該裥蕾p圖片、繪本或閱讀相關(guān)文字介紹，同時系統(tǒng)給出了目錄的索引以方便閱讀，閱讀模塊的流程如圖2所示。

圖像處理模塊主要是將繪本圖片載入到預(yù)先設(shè)計好的繪本主體內(nèi)進(jìn)行處理，主要的處理方式有銳化、直方圖均衡化、裁剪、上下、左右翻轉(zhuǎn)和亮度處理等；最后將處理后的圖像通過程序編輯成繪本電子書；最后載入音頻。

圖2 閱讀模塊流程

系統(tǒng)的軟件實(shí)現(xiàn)流程如圖3所示，結(jié)合使用圖片動畫和場景音效，并為用戶提供人機(jī)交互的功能，寓學(xué)于樂。兒童互動繪本軟件將學(xué)習(xí)與娛樂相結(jié)合，在增強(qiáng)兒童學(xué)習(xí)興趣的同時，也能提高學(xué)習(xí)效果和熱情。該軟件基于Cocos 2D開發(fā)框架設(shè)計，并使用FLASH技術(shù)生成動畫，結(jié)合音效引擎，做到“繪聲繪色”，下面分別重點(diǎn)介紹軟件的動畫設(shè)計與互動設(shè)計兩個功能。

圖3 軟件實(shí)現(xiàn)流程

1.1 動畫設(shè)計

傳統(tǒng)的繪畫方式使用畫筆、橡皮擦、尺子和各種顏料等繪畫工具，但隨著數(shù)字技術(shù)的發(fā)展，使用數(shù)字繪畫逐漸替代原來的繪畫方式。數(shù)字繪畫具有隨意復(fù)制和不受時間限制的特點(diǎn)，并可通過網(wǎng)絡(luò)傳播數(shù)字繪畫，更加方便。

本軟件的動畫設(shè)計包括風(fēng)格設(shè)計、圖標(biāo)制作和主菜單的頁面設(shè)計3個過程。風(fēng)格設(shè)計需要結(jié)合兒童的需求，使用簡單的形象和一卡通圖案為主；圖標(biāo)制作也應(yīng)符合兒童的需求，采用符合兒童的插畫手繪手法和色彩；主菜單頁面設(shè)計盡量做到簡單方便兒童使用，并通過數(shù)字制作和手繪技法，以增強(qiáng)兒童的興趣及使用熱情。

1.2 互動設(shè)計

互動設(shè)計即實(shí)現(xiàn)兒童與Android機(jī)間的信息交互，主要包括互動界面布局設(shè)計與互動規(guī)則設(shè)計兩個過程。

互動界面布局設(shè)計用于將核心內(nèi)容和元素放在使用者注意力集中的地方，凸出軟件界面的興趣中心。

互動規(guī)則設(shè)計即軟件開發(fā)者與用戶間的行為約束規(guī)則，本軟件設(shè)置使用最長時限，用于保護(hù)兒童的視力，并盡量使用更加簡單的操作，兒童只需進(jìn)行點(diǎn)擊和手滑即可達(dá)到想要的效果。

2 系統(tǒng)實(shí)現(xiàn)

2.1 Android平臺搭建

文中使用eclipse和Android SDK進(jìn)行軟件開發(fā)，首先需要搭建Android的開發(fā)環(huán)境，包括eclipse、SDK、JDK和ADT的下載、安裝與配置。

在安裝好Android開發(fā)環(huán)境后，安裝Cocos 2d引擎。Cocos 2d是一個開源框架，有助于提高開發(fā)和創(chuàng)作的效率，其基本框架類圖如圖4所示。

圖4 Cocos 2d的基本框架類圖

使用Cocos 2d進(jìn)行觸控事件開發(fā)，即Touch事件，需要通過NS Set發(fā)送觸摸傳感器的信息，并提供了如圖5所示的事件響應(yīng)函數(shù)。

圖5 Touch事件響應(yīng)函數(shù)

2.2 系統(tǒng)具體實(shí)現(xiàn)

系統(tǒng)具體實(shí)現(xiàn)包括主菜單模塊、繪本主體模塊、動畫設(shè)計、音效設(shè)計、物理引擎以及其他技術(shù)實(shí)現(xiàn)細(xì)節(jié)部分，下面分別進(jìn)行具體介紹。

2.2.1 主菜單模塊

主菜單模塊的設(shè)計極其重要，因其直接影響著用戶的感受，須能吸引讀者并展示出設(shè)計的主題。

具體包括繪本游戲、游戲設(shè)置和瀏覽模式3個子功能，用戶可點(diǎn)擊進(jìn)入相應(yīng)模塊瀏覽內(nèi)容或設(shè)置系統(tǒng)參數(shù)。主菜單模塊的場景用例圖，如圖6所示。

圖6 主菜單模塊場景用例圖

2.2.2 繪本主體模塊

繪本主體模塊用于表現(xiàn)場景的內(nèi)容，也可用來處理交互信息和管理各種對象。主要包括界面布局設(shè)計以及繪本場景圖片的導(dǎo)入兩個步驟。

圖7 繪本場景圖片導(dǎo)入的說明

界面布局設(shè)計按照常規(guī)的方法將屏幕分為兩個部分，上方9/10像素區(qū)域用于顯示主要內(nèi)容。控制面板放在下面的1/10像素區(qū)域，用于控制軟件的進(jìn)程和暫停操作。

軟件根據(jù)繪本故事的內(nèi)容需求導(dǎo)入場景圖片，詳細(xì)流程和說明如圖7所示。

同時，為了滿足兒童的需求，與傳統(tǒng)的紙質(zhì)繪本不同的是，該系統(tǒng)的繪本主體模塊添加了延伸和導(dǎo)讀功能。導(dǎo)讀功能提供了整個繪本的成型過程，方便家長和兒童與創(chuàng)作者間的溝通；延伸功能提供了繪本的指導(dǎo)材料，增進(jìn)家長與兒童間的交流，繪本主體結(jié)構(gòu)如圖8所示。

2.2.3 動畫設(shè)計

為了增加繪本的趣味性，本文在繪本中添加了一些動畫。動畫的本質(zhì)是一系列連續(xù)播放的圖片，因此為了實(shí)現(xiàn)動畫的效果，必須先提供演示圖片。本文使用FLASH工具做出動畫效果，并適當(dāng)?shù)恼{(diào)整圖片的寬和高以適應(yīng)繪本的界面布局大小。

2.2.4 音效設(shè)計

圖8 繪本主體結(jié)構(gòu)

為了烘托出繪本故事的氣氛，本軟件添加了音樂和音效設(shè)計功能。軟件使用Cocos 2d的音頻引擎進(jìn)行音樂事件的處理，即在Cocos的CocosDenshion添加一個Simple Audio Engine對象類來實(shí)現(xiàn)該功能。首先，初始化表示層；然后通過調(diào)用Simple Audio Engine類中的音頻播放方法來播放音頻文件。

2.2.5 物理引擎

本軟件僅在使用動畫的地方需要物理引擎，同時為了適應(yīng)系統(tǒng)的重力感應(yīng)需求，本文直接使用Cocos的Chipmunk物理引擎來實(shí)現(xiàn)。

2.2.6 技術(shù)實(shí)現(xiàn)細(xì)節(jié)

在播放動畫時需要加載聲音和音樂，在場景轉(zhuǎn)換時也需實(shí)現(xiàn)場景的變換與音樂的播放。具體實(shí)現(xiàn)步驟如下所述：

1）打開Eclipse，創(chuàng)建View-changed類；

2）添加AVFoundation類；

3）修改Music.java文件，完成music的初始化；

4）在 InterfaceBuilder中拖入 Round Rect Button組建，并將標(biāo)簽修改為“Play”；

5）將需要播放的音頻文件放入項目的資源庫中；

6）運(yùn)行該程序，并點(diǎn)擊“play”，即可聽到預(yù)先放入的音頻。

3 結(jié)束語

針對數(shù)字繪本在交互方式、感官體驗(yàn)效果和存儲容量的優(yōu)勢，本文基于Android平臺，設(shè)計了一款繪本圖像處理軟件。該軟件結(jié)合文字、圖像、動畫和語音等表達(dá)方式，使用觸摸與點(diǎn)擊的方式進(jìn)行交互，用戶在使用該軟件閱讀繪本的同時，也能進(jìn)行簡單的圖像處理操作，個性化完善繪本。該軟件基于Cocos 2D框架進(jìn)行開發(fā)，包括主菜單、動畫設(shè)計和音效設(shè)計3個模塊，實(shí)現(xiàn)瀏覽、目錄選擇和系統(tǒng)設(shè)置，動畫設(shè)計以及音效設(shè)計3個功能。軟件實(shí)現(xiàn)和測試結(jié)果表明，該軟件能能增強(qiáng)繪本的趣味性和易用性，具有一定的實(shí)用性。