蘇兵

（廣州華夏職業(yè)學(xué)院，廣東 廣州 510935）

1 緒論

隨著移動(dòng)網(wǎng)絡(luò)技術(shù)的飛速發(fā)展和移動(dòng)智能終端軟件和硬件的不斷更新?lián)Q代，人們?cè)絹?lái)越多地使用移動(dòng)終端來(lái)享受移動(dòng)網(wǎng)絡(luò)提供的各種各樣的信息服務(wù)。近年來(lái)，Android移動(dòng)終端的普及和流媒體技術(shù)向移動(dòng)終端的延伸，極大地促進(jìn)了移動(dòng)終端視頻應(yīng)用的發(fā)展，使人們隨時(shí)隨地通過(guò)移動(dòng)網(wǎng)絡(luò)觀看視頻和上傳視頻。本系統(tǒng)選用Eclipse開(kāi)發(fā)移動(dòng)應(yīng)用APP，分別從應(yīng)用的界面設(shè)計(jì)和功能設(shè)計(jì)兩個(gè)方面進(jìn)行陳述；而服務(wù)器部署了Tomcat，將設(shè)計(jì)好的流媒體視頻部署到Tomcat；移動(dòng)端與服務(wù)器端之間的通訊采用HTTP技術(shù)。

2 影音播放器的設(shè)計(jì)

影音播放器的設(shè)計(jì)包括：系統(tǒng)框架設(shè)計(jì)、移動(dòng)端的界面設(shè)計(jì)和功能設(shè)計(jì)、服務(wù)器的設(shè)計(jì)。

2.1 系統(tǒng)框架設(shè)計(jì)

影音播放器的框架設(shè)計(jì)分為基于Android的移動(dòng)端的App設(shè)計(jì)和基于Tomcat的服務(wù)器端的設(shè)計(jì)，它們之間的通訊采用HTTP1.1，如圖1所示。

本系統(tǒng)選用Eclipse開(kāi)發(fā)環(huán)境逐步完成系統(tǒng)各個(gè)部分的實(shí)現(xiàn)，重點(diǎn)對(duì)用戶界面的實(shí)現(xiàn)、視頻播放模塊的實(shí)現(xiàn)、播放進(jìn)度控制的實(shí)現(xiàn)、基于Tomcat技術(shù)的Web服務(wù)器和流媒體服務(wù)器的搭建和部署進(jìn)行分析。

2.2 界面設(shè)計(jì)和功能設(shè)計(jì)

首頁(yè)和更多主要為影片分類和列表，列表部分使用了GridView。首頁(yè)和更多的功能主要是展示影片信息，首先通過(guò)HttpClient請(qǐng)求到網(wǎng)絡(luò)資源，然后通過(guò)Json解析后使用Adapter裝載數(shù)據(jù)。

播放界面主要由VideoView和ProgressBar兩個(gè)控件組成。外層為RelativeLayout，使ProgressBar可以在VideoView控件上層并居中顯示。播放功能使用VideoView控件，該控件內(nèi)部為MediaPlayer和SurfaceView控件的封裝，使用該控件的主要流程為初始化控件，裝入url，設(shè)置監(jiān)聽(tīng)。首頁(yè)、更多和播放的設(shè)計(jì)如圖1所示。

圖1 播放器的框架設(shè)計(jì)

圖2 播放器的界面設(shè)計(jì)和功能設(shè)計(jì)

2.3 服務(wù)器端的設(shè)計(jì)

服務(wù)器端采用Tomcat進(jìn)行搭建，用于部署使用JSP建好的網(wǎng)站，在網(wǎng)站內(nèi)使用Json來(lái)存儲(chǔ)和表示數(shù)據(jù)。

3 影音播放器的開(kāi)發(fā)

3.1 界面開(kāi)發(fā)和功能開(kāi)發(fā)

3.1.1 界面開(kāi)發(fā)

主界面框架為標(biāo)題、底部導(dǎo)航加Fragment，F(xiàn)ragment是自定義加載到LinearLayout上，所以此處的LinearLayout需要加ID，其大綱結(jié)構(gòu)圖如圖3所示。

圖3 主界面開(kāi)發(fā)大綱結(jié)構(gòu)

首頁(yè)Fragment開(kāi)發(fā)主要包括視頻的分類展示，每一個(gè)分類下都是使用GridView，并設(shè)定個(gè)數(shù)。單擊更多按鈕會(huì)跳轉(zhuǎn)到對(duì)應(yīng)分類下的界面。單擊GridView下的每一個(gè)item返回服務(wù)器請(qǐng)求數(shù)據(jù)，播放視頻，其大綱結(jié)構(gòu)如圖4所示。

圖4 首頁(yè)界面開(kāi)發(fā)大綱結(jié)構(gòu)

播放界面的開(kāi)發(fā)使用了VideoView控件完成視頻的播放，加載視頻時(shí)在VideoView上放置ProgressBar和TextView提示用戶，其大綱結(jié)構(gòu)如圖5所示。

圖5 播放界面開(kāi)發(fā)大綱結(jié)構(gòu)

其它界面的開(kāi)發(fā)類似，在此不再陳述。

3.1.2 功能開(kāi)發(fā)

（1）主界面功能開(kāi)發(fā)

首先，聲明兩個(gè)子布局和底部導(dǎo)航的四個(gè)控件以及標(biāo)題。

其次，初始化界面并將界面的上下文存入GloableParams類中，以便其他頁(yè)面的調(diào)用。調(diào)用初始化控件和監(jiān)聽(tīng)的方法。

然后，初始化兩個(gè)子布局，將homeFragment加入主界面。

接著，設(shè)置底部導(dǎo)航圖上的監(jiān)聽(tīng)。

最后，對(duì)其它所需的功能進(jìn)行實(shí)現(xiàn)即可。

（2）首頁(yè)功能開(kāi)發(fā)

首先，主界面默認(rèn)加載的是homeFragment,即首頁(yè)。在onCreateView方法中進(jìn)行控件和適配器的綁定。

其次，TextView控件更多的單擊監(jiān)聽(tīng)。單擊后得到服務(wù)器請(qǐng)求的URI放入Bundle對(duì)象中，在加載更多頁(yè)面時(shí)傳遞過(guò)去。

然后，得到服務(wù)器請(qǐng)求的URI調(diào)用NetWorkTask().executeProxy異步方法請(qǐng)求服務(wù)器。將監(jiān)聽(tīng)的上下文賦值給params.listener，傳入調(diào)用的方法中。

接著，進(jìn)行網(wǎng)絡(luò)判斷，如果當(dāng)前網(wǎng)絡(luò)不正常，調(diào)用Prom t-Manager.showNoNetWork(mContext)；檢查是否有網(wǎng)絡(luò)。若網(wǎng)絡(luò)狀態(tài)良好，則調(diào)用super.execute(params)進(jìn)行服務(wù)器請(qǐng)求。此過(guò)程中彈出進(jìn)度條對(duì)話框提示資源加載中。

在此方法中，將之前設(shè)置的上下文賦給this.onResultListener就可以在當(dāng)前頁(yè)面調(diào)用首頁(yè)面。

最后，加載其它的所需資源，即可實(shí)現(xiàn)首頁(yè)的信息顯示功能。更多界面的功能開(kāi)發(fā)與首頁(yè)類似。

（3）視頻播放界面功能開(kāi)發(fā)

首先，單擊首頁(yè)上的任務(wù)item會(huì)進(jìn)入視頻播放界面，該界面使用videoView播放視頻，videoView內(nèi)部對(duì)Mediaplayer和SurfaceView進(jìn)行了封裝。

3.2 服務(wù)器端的實(shí)現(xiàn)

采用JSP技術(shù)新建一個(gè)JSP網(wǎng)站，加載相應(yīng)的圖片、視頻和Json文檔等等，測(cè)試成功后，將該網(wǎng)站部署到Tomcat服務(wù)器上。

3.2.1 安裝JDK和Tomcat

（1）安裝JDK：直接運(yùn)行jdk-7-w indows-i586.exe可執(zhí)行程序，默認(rèn)安裝即可。

備注：路徑可以其他盤符，不建議路徑包含中文名及特殊符號(hào)。

（2）安裝Tomcat：直接解壓縮下載文件“apache-tomcat-7.0.33-w indows-x86.zip”到C盤下。安裝路徑建議修改為：c: omcat。

3.2.2 配置JDK環(huán)境變量和測(cè)試JDK

（1）新建變量名：JAVA_HOME，變量值：C:Program FilesJavajdk1.7.0

（2）打開(kāi)PATH和添加變量值：%JAVA_HOME%in;%JAVA_HOME%jrein

（3）新 建 變 量 名 ：CLASSPATH，變 量 值 ：.;%JAVA_HOME%libdt.jar;%JAVA_HOME%lib ools.jar

（4）測(cè)試JDK：在CMD命令下輸入javac，java，javadoc命令，出現(xiàn)圖6界面，表示安裝成功。

圖6 成功測(cè)試JDK

3.2.3 配置Tomcat環(huán)境變量、啟動(dòng)Tomcat和測(cè)試Tomcat

（1）新建變量名：CATALINA_BASE，變量值：C: omcat

（2）新建變量名：CATALINA_HOME，變量值：C: omcat

（3）打開(kāi)PATH，添加變量值：%CATALINA_HOME%lib;%CATALINA_HOME%in

（4）啟動(dòng)Tomcat服務(wù)的兩種方法：方法一：在CMD命令下輸入命令：startup，出現(xiàn)圖7對(duì)話框，表明服務(wù)啟動(dòng)成功；方法二：右鍵點(diǎn)擊桌面上的“我的電腦”-＞“管理”-＞“服務(wù)和應(yīng)用程序”-＞“服務(wù)”，找到“Apache Tomcat”服務(wù)，右鍵點(diǎn)擊該服務(wù)，選擇“屬性”，將“啟動(dòng)類型”由“手動(dòng)”改成“自動(dòng)”。

（5）測(cè)試Tom cat：打開(kāi)瀏覽器，在地址欄中輸入http://localhost:8080回車，如果看到Tomcat自帶的一個(gè)JSP頁(yè)面，說(shuō)明JDK和Tomcat已搭建成功。

圖7 CMD命令下成功測(cè)試JDK

4 影音播放器的測(cè)試

該影音播放器是分別采用Eclipse模擬器和真機(jī)進(jìn)行測(cè)試，經(jīng)過(guò)多次的界面和功能修改，并完善Tomcat服務(wù)器，完成了視頻播放器的基本框架與圖片的緩存加載，實(shí)現(xiàn)了基本視頻格式文件的播放功能，如圖8所示。

圖8 影音播放器的測(cè)試效果圖

5 結(jié)束語(yǔ)

本文的實(shí)現(xiàn)分為服務(wù)器和客戶端兩部分：

（1）服務(wù)器部分主要為含有URI等信息的Json數(shù)據(jù)、圖片信息和不同格式的視頻資源。

（2）客戶端主要由fragment頁(yè)面框架和視頻播放兩部分組成。

頁(yè)面框架部分包括首頁(yè)和更多：

（1）首頁(yè)上的圖片資源為直接從服務(wù)器獲取，需要對(duì)圖片進(jìn)行一定的處理。

（2）更多頁(yè)面上的圖片資源是直接請(qǐng)求的百度服務(wù)器，每次請(qǐng)求獲得一定的圖片并顯示在界面上。因?yàn)閳D片量較大必須對(duì)緩存進(jìn)行一定的處理，否則就會(huì)產(chǎn)生OOM(Out-Of-Memory)。