黃雪倩,譚鈞元,李 欣,陳 棟

1(中國海洋大學(xué) 信息科學(xué)與工程學(xué)院,青島 266100)

2(山東省青島第二中學(xué),青島 266021)

目前,我國的海洋生態(tài)環(huán)境面臨海水富營養(yǎng)化加劇、海洋生物種類減少甚至滅絕等一系列嚴(yán)重問題,導(dǎo)致海洋資源的可再生能力下降,海洋生態(tài)平衡嚴(yán)重失衡[1].為了監(jiān)測海洋生態(tài)環(huán)境的變化對海洋資源的影響,充分合理地利用海洋資源,需要建立有效的監(jiān)測機(jī)制來監(jiān)測海底的生態(tài)環(huán)境.通過監(jiān)測來收集和分析數(shù)據(jù),進(jìn)而分析海底復(fù)雜的生態(tài)環(huán)境,為指導(dǎo)人類合理利用海洋資源提供科學(xué)依據(jù).

在移動互聯(lián)網(wǎng)高速發(fā)展的當(dāng)今,人們的視線逐漸從PC端轉(zhuǎn)移到了移動終端.智能手機(jī)APP的出現(xiàn)給大家提供了方便快捷的全新生活體驗(yàn).為了滿足人們生活多方面的需求,市場上出現(xiàn)了各種定制功能的APP.海洋生態(tài)環(huán)境數(shù)據(jù)展示APP,從海洋生態(tài)環(huán)境監(jiān)測系統(tǒng)中獲取并展示用戶關(guān)心的數(shù)據(jù),用戶可以通過分析當(dāng)前關(guān)注的海底生態(tài)環(huán)境數(shù)據(jù)做出合理決策.

1 開發(fā)環(huán)境及應(yīng)用技術(shù)

1.1 開發(fā)環(huán)境

海洋生態(tài)環(huán)境數(shù)據(jù)展示APP以Android Studio作為開發(fā)平臺,在服務(wù)器端采用ASP.NET技術(shù)和SQLServer數(shù)據(jù)庫系統(tǒng).

谷歌推出的新型開發(fā)環(huán)境Android Studio,其速度快、智能化、UI界面漂亮,受到Android開發(fā)者的青睞.Android 系統(tǒng)是基于Linux的開放源代碼的、目前市場占有率最高的移動操作系統(tǒng).該系統(tǒng)為開發(fā)者提供了豐富的工具、系統(tǒng)控件和多媒體服務(wù)等等.Android可以分為四層架構(gòu),分別是Linux內(nèi)核層、系統(tǒng)運(yùn)行庫層、應(yīng)用框架層、應(yīng)用層[2].

NET是一種面向網(wǎng)絡(luò)、支持各種用戶終端的開發(fā)平臺環(huán)境,而Microsoft.NET框架是一個在Windows中集成的組件.ASP.NET是一個在Microsoft.NET框架基礎(chǔ)上建立的Web開發(fā)平臺,可以提供Web應(yīng)用程序需要的服務(wù)[3].服務(wù)器端采用ASP.NET技術(shù),在Visual Studio開發(fā)環(huán)境下實(shí)現(xiàn).

SQLServer則是美國微軟公司推出的一種關(guān)系型數(shù)據(jù)庫系統(tǒng),使用SQL語句執(zhí)行各種操作.

1.2 應(yīng)用技術(shù)

在APP中,運(yùn)用Vitamio多媒體框架實(shí)現(xiàn)水下視頻直播和點(diǎn)播設(shè)計(jì),并用極光推送平臺接收推送消息提醒用戶,借助百度地圖展示設(shè)備投放地點(diǎn).

Vitamio是一款備受青睞的多媒體開發(fā)框架,可以在Android系統(tǒng)和IOS系統(tǒng)中使用.Vitamio 框架擁有簡潔易用的 API 接口,既支持不同格式的視頻的播放,也支持不同平臺的多種視頻流媒體協(xié)議,如RTMP協(xié)議、RTSP協(xié)議等[4].本設(shè)計(jì)中使用了Vitamio多媒體框架,利用RTMP協(xié)議實(shí)現(xiàn)水下視頻流的直播和點(diǎn)播.

消息推送可以定期地給用戶傳送他們關(guān)注的信息.消息及時地推送到用戶的移動終端上,可以提高用戶活躍度、提高應(yīng)用的留存率[5].本設(shè)計(jì)中選用極光推送(JPush),采用長連接方式實(shí)現(xiàn)端到端的服務(wù)[6].JPush是大規(guī)模APP推送平臺,在客戶端集成SDK后,通過調(diào)用API實(shí)現(xiàn)消息的推送功能.

百度地圖開放平臺為Android端提供了地圖、定位、鷹眼軌跡、導(dǎo)航、全景等功能.通過百度地圖SDK提供的接口,可以使用百度地圖提供的多種免費(fèi)服務(wù)[7].

2 分析與設(shè)計(jì)

2.1 需求分析

海洋生態(tài)環(huán)境數(shù)據(jù)展示APP的主要功能之一是APP的登錄,用戶只有登錄以后才可以進(jìn)入APP的主界面使用其他功能.海洋生態(tài)環(huán)境實(shí)時數(shù)據(jù)包括實(shí)時水文數(shù)據(jù)和實(shí)時視頻數(shù)據(jù).實(shí)時的水文數(shù)據(jù)可以通過布局頁面在界面直接顯示,視頻數(shù)據(jù)以視頻流地址的方式被移動終端獲取,再通過視頻播放器來播放.由于歷史數(shù)據(jù)的數(shù)據(jù)量龐大,在APP中以圖表的形式呈現(xiàn)給用戶.當(dāng)獲取到的生態(tài)環(huán)境數(shù)據(jù)超過預(yù)設(shè)的門限值時,則通過推送消息的方式向用戶發(fā)出提醒信息.APP的更新包括自動更新和手動更新兩種方式.

對后臺管理系統(tǒng)要實(shí)現(xiàn)的功能進(jìn)行分析,它需要完成以下6個任務(wù):(1)移動終端APP的接口.(2)海洋生態(tài)環(huán)境實(shí)時數(shù)據(jù)傳輸APP用戶的管理.海洋生態(tài)環(huán)境實(shí)時數(shù)據(jù)傳輸APP用戶必須在后臺管理系統(tǒng)中登記以后,APP才可以登錄使用.所以在后臺管理系統(tǒng)中需要實(shí)現(xiàn)對APP用戶信息的管理: 包括新用戶信息的增加,老用戶信息的更改和刪除等.(3)移動終端APP軟件版本的升級.軟件升級功能負(fù)責(zé)將新的APK文件上傳至服務(wù)器,之后在移動終端上就可以檢測到新版本的APP.(4)查看推送消息的歷史記錄.推送消息被發(fā)送至移動終端,既可以在移動終端上查看,也可以在后臺管理系統(tǒng)中查看.(5)發(fā)送消息.當(dāng)出現(xiàn)某些特殊情況時,管理員可以根據(jù)需要推送消息到指定地點(diǎn).(6)管理后臺系統(tǒng)的用戶,實(shí)現(xiàn)管理員用戶的登錄、退出和密碼修改等功能.

2.2 總體設(shè)計(jì)

用戶通過Android客戶端發(fā)送請求,后臺接收請求并返回?cái)?shù)據(jù)給客戶端,數(shù)據(jù)在客戶端界面顯示.在客戶端實(shí)現(xiàn)實(shí)時數(shù)據(jù)和歷史數(shù)據(jù)的顯示,完成視頻流的點(diǎn)播和直播,接收推送消息等等.后臺服務(wù)端主要負(fù)責(zé)給瀏覽器提供界面、客戶端與服務(wù)端的通信、Android客戶端的接入以及服務(wù)器與數(shù)據(jù)庫的交互.整體架構(gòu)圖如圖1所示.

圖1 整體架構(gòu)圖

2.3 Android客戶端設(shè)計(jì)

為了提高客戶端軟件的開發(fā)效率,降低模塊之間的耦合性,海洋生態(tài)環(huán)境數(shù)據(jù)展示APP設(shè)計(jì)的實(shí)現(xiàn)采用MVC模式.MVC中的M(模型)指的是多個與海洋生態(tài)環(huán)境要素有關(guān)的實(shí)體類和從網(wǎng)絡(luò)獲取的JSON數(shù)據(jù).視圖層包括應(yīng)用程序中的各種XML布局文件,如activity_main.xml等,和自定義的View,如程序開發(fā)時自定義的WenZiTextView,它繼承自TextView.控制層包括程序開發(fā)中的多個Activity和多個Fragment,如:MainActivity、StationDesActivity、StationsFragment、VideoFragment等.在APP的主界面設(shè)計(jì)采用單個Activity嵌套多個Fragment的方式實(shí)現(xiàn),多個Fragment的使用方便模塊之間的切換,也便于應(yīng)用程序的擴(kuò)展.

海洋生態(tài)環(huán)境數(shù)據(jù)展示APP的主要功能包括:APP登錄、設(shè)備投放地點(diǎn)顯示、設(shè)備投放點(diǎn)實(shí)時視頻播放、存儲的精彩視頻播放、設(shè)備投放點(diǎn)實(shí)時水文數(shù)據(jù)顯示、設(shè)備投放點(diǎn)歷史數(shù)據(jù)顯示、推送消息接收、APP軟件升級等等.

APP的主要功能結(jié)構(gòu)圖如圖2所示.

圖2 APP的功能結(jié)構(gòu)圖

2.4 后臺管理系統(tǒng)設(shè)計(jì)

后臺管理系統(tǒng)功能結(jié)構(gòu)圖如圖3所示.

圖3 后臺管理系統(tǒng)功能結(jié)構(gòu)圖

后臺管理系統(tǒng)包含有4個部分:(1)手機(jī)APP接口.(2)業(yè)務(wù)管理,負(fù)責(zé)發(fā)送推送消息和查看推送消息歷史.(3)APP管理,負(fù)責(zé)手機(jī)APP用戶的管理和APP軟件版本的升級更新.(4)后臺用戶管理,負(fù)責(zé)管理人員密碼的更改和用戶的登錄、注銷.

3 移動端設(shè)計(jì)實(shí)現(xiàn)

3.1 登錄功能的實(shí)現(xiàn)

用戶輸入必須在后臺管理系統(tǒng)中登記手機(jī)號方可實(shí)現(xiàn)登錄功能,登錄成功直接跳轉(zhuǎn)至APP的MainActivity主界面.如果手機(jī)號未在后臺登記,則無法實(shí)現(xiàn)登錄功能,此時需要聯(lián)系管理員,將手機(jī)號在后臺進(jìn)行登記.登錄時,如在自動登錄前面打勾,選擇自動登錄,將用戶信息通過SharedPreferencesUtils工具類進(jìn)行保存,在不更換移動終端設(shè)備和手機(jī)號的前提下,可以直接從引導(dǎo)頁進(jìn)入APP的主界面.其流程圖如圖4所示.

圖4 移動終端登錄流程圖

用戶登錄成功后,后臺便會將移動終端的MAC地址保存,實(shí)現(xiàn)了移動終端和APP的綁定.如果用戶更換移動終端設(shè)備或者手機(jī)號碼,則必須與管理員聯(lián)系重新登記,以防止出現(xiàn)盜登錄,從而保證海洋環(huán)境數(shù)據(jù)的安全性.移動終端登錄界面如圖5所示.

3.2 主界面的實(shí)現(xiàn)

主界面由底部導(dǎo)航欄和地圖兩部分組成,底部導(dǎo)航由三個碎片組成,分別是站點(diǎn)Fragment 、視頻Fragment、用戶Fragment,它們?nèi)齻€之間可以自由切換.上半部分設(shè)備投放點(diǎn)展示借助百度地圖開發(fā)平臺實(shí)現(xiàn),如圖6所示.圖上的點(diǎn)稱為標(biāo)記點(diǎn),每個點(diǎn)都代表一套海洋生態(tài)環(huán)境監(jiān)測系統(tǒng)的投放點(diǎn),然后給標(biāo)記點(diǎn)設(shè)置監(jiān)聽,當(dāng)點(diǎn)擊標(biāo)記點(diǎn)時會觸發(fā)相應(yīng)的事件.

圖5 APP的登錄界面

圖6 移動終端APP的主界面

3.3 實(shí)時數(shù)據(jù)查看功能的實(shí)現(xiàn)

如果數(shù)據(jù)狀態(tài)是正常的,將會獲得實(shí)時水文數(shù)據(jù)和視頻流地址.如果數(shù)據(jù)狀態(tài)不正常,則無法解析數(shù)據(jù),數(shù)值無法顯示.以威海長青海洋牧場的數(shù)據(jù)為例,實(shí)時數(shù)據(jù)顯示界面如圖7所示.

圖7 實(shí)時數(shù)據(jù)顯示界面

圖7中環(huán)境溫度是5.31℃,鹽度是28.96 PSU,深度是8.25 m,葉綠素含量是0.08 ug/L,溶解氧含量是10.96 mg/L.點(diǎn)擊“實(shí)時視頻”后的視頻播放按鈕,會從圖7的頁面跳轉(zhuǎn)到VideoPlayActivity視頻播放界面,播放海底的實(shí)時視頻流,如圖8所示.

圖8 水下實(shí)時視頻流播放截圖

實(shí)時數(shù)據(jù)展示頁面包含跳轉(zhuǎn)到歷史數(shù)據(jù)頁面的按鈕和跳轉(zhuǎn)到其它站點(diǎn)按鈕,點(diǎn)擊對應(yīng)按鈕可以跳轉(zhuǎn)到相應(yīng)的界面.

3.4 歷史數(shù)據(jù)查看功能的實(shí)現(xiàn)

用戶可以根據(jù)需要選擇查看溫度、鹽度、深度、溶解氧、葉綠素?cái)?shù)據(jù)等水文和生態(tài)數(shù)據(jù)中的幾種或者全部,數(shù)據(jù)的選擇通過CheckBox控件來實(shí)現(xiàn).并選擇需要查看數(shù)據(jù)的時間單位: 日、周、月、年或者自定義,最終將數(shù)據(jù)以折線圖的形式展示給用戶.通過查看數(shù)據(jù),分析數(shù)據(jù)的變化趨勢,了解海洋生態(tài)環(huán)境變化情況,為企業(yè)管理決策提供科學(xué)依據(jù).

黃海滸苔綠潮已連續(xù)11年暴發(fā),2017年夏季還出現(xiàn)了馬尾藻金潮和米氏凱倫藻赤潮,黃?！叭薄饼R發(fā).根據(jù)相關(guān)監(jiān)測部門的報道得知,2017年6月14日前后,滸苔綠潮入侵山東日照沿海海域.通過移動終端APP觀察到5月20日到6月20日日照國美投礁型海洋牧場的水文生態(tài)參數(shù)數(shù)據(jù)如圖9所示.從圖中可以看出,海水溫度呈現(xiàn)季節(jié)性增溫,但是在14號之后,溫度迅速升高,溶解氧含量迅速降低,葉綠素濃度急劇上升,在6月18號之后葉綠素濃度又恢復(fù)到綠潮到來之前的水平.2017年6月16號前后在青島魯海豐海洋牧場的水文生態(tài)參數(shù)中也觀察到類似現(xiàn)象,因此推測海洋牧場生態(tài)環(huán)境數(shù)據(jù)異常與“三潮”入侵有關(guān).

通過長期觀察某一特定海域海洋生態(tài)環(huán)境數(shù)據(jù)的變化規(guī)律和某些特定參數(shù)(例如海水溫度、溶解氧、葉綠素等)異常變化與發(fā)生海洋災(zāi)害(例如綠潮、金潮或者赤潮等)的關(guān)聯(lián)性,可以總結(jié)出利用海洋生態(tài)環(huán)境監(jiān)測系統(tǒng)對海洋生態(tài)災(zāi)害進(jìn)行預(yù)報的數(shù)值模型,為海洋牧場提供海洋生態(tài)災(zāi)害預(yù)警機(jī)制,為企業(yè)科學(xué)決策提供數(shù)據(jù)支撐,減少企業(yè)由于海洋生態(tài)災(zāi)害導(dǎo)致的經(jīng)濟(jì)損失.

圖9 日照國美海洋牧場5/20～6/20的水文生態(tài)參數(shù)變化

3.5 視頻列表的實(shí)現(xiàn)

通過選擇VideoFragment能夠跳轉(zhuǎn)到精彩視頻列表界面,如圖10所示.可以選擇播放任何一個投放地點(diǎn)精彩視頻列表中的任意一個視頻片段.

Vitamio框架提供了視頻播放的相關(guān)類,每個類都有對應(yīng)功能,MediaController類負(fù)責(zé)視頻播放時的控制頁面,包括視頻的開始和暫停[8].通過設(shè)置接口函數(shù)來實(shí)現(xiàn)視頻播放時的參數(shù)設(shè)置,在VideoPlayActivity中,使用setBufferSize()接口函數(shù)設(shè)置播放視頻的大小,用setPlaybackSpeed()接口函數(shù)設(shè)置視頻的播放速度.視頻播放過程中需要設(shè)置三個監(jiān)聽: 播放準(zhǔn)備好監(jiān)聽,播放完成監(jiān)聽和播放出錯監(jiān)聽.

圖10 移動終端APP的精彩視頻列表界面

3.6 個人信息界面的實(shí)現(xiàn)

移動終端APP的個人信息界面如圖11所示,包括查看我的消息、信息發(fā)布、檢查更新、是否開啟推送通知、退出登錄五項(xiàng)功能.

圖11 移動終端APP的個人信息界面

在個人信息界面中點(diǎn)擊“我的消息”可以查看移動終端接收的提醒消息,點(diǎn)擊后會跳轉(zhuǎn)到消息列表頁面,如圖12所示.消息列表中都是利用極光推送發(fā)送的提醒消息,用戶通過提醒消息可以得知某海域的某些生態(tài)環(huán)境指標(biāo)超出預(yù)警閾值,生態(tài)環(huán)境可能面臨惡化的危險.

圖12 提醒消息列表界面

4 結(jié)語

經(jīng)過測試后,移動終端APP和后臺管理系統(tǒng)運(yùn)行穩(wěn)定.目前,海洋生態(tài)環(huán)境監(jiān)測系統(tǒng)已布放在山東省的二十余個海洋牧場中,通過該APP向用戶展示海洋牧場的生態(tài)環(huán)境數(shù)據(jù).

通過移動終端APP查看歷史數(shù)據(jù),分析數(shù)據(jù)并根據(jù)數(shù)值變化率預(yù)測生態(tài)異常現(xiàn)象的出現(xiàn),結(jié)合實(shí)時數(shù)據(jù)和推送消息,可以實(shí)現(xiàn)海洋生態(tài)環(huán)境參數(shù)異常預(yù)警,從而為海洋牧場的科學(xué)生產(chǎn)和防災(zāi)減災(zāi)提供數(shù)據(jù)支撐.