基于Qt的跨平臺多媒體播放器

李健祥++鄭丹

摘 要： 利用開源跨平臺圖形界面Qt，以及web中的最新開源框架Node.js，我們設計了一款開源的，可視化的，可以橫跨windows，IOS，Android，windows phone等多平臺的多媒體播放平臺。后臺通過Node..js搭建服務器，客戶端或瀏覽器可以訪問服務器，并為用戶提供非結構化數據存儲的服務。數據庫為MongoDB。

關鍵詞：Qt Node.js 多媒體播放 數據可視化 跨平臺

中圖分類號：TP3 文獻標識碼：A 文章編號：1003-9082（2016）05-0003-02

引言

Node.js是一款為服務器端web開發所設計的開源的，跨平臺運行環境。雖然Node.js并不是完全由JavaScript開發的框架，但其中許多基本模塊都是由javaScript編寫而成。支持異步加載，事件驅動的體系架構。

Qt是一款跨平臺的應用程序框架，由于其的輕量化以及運行快捷，被廣泛應用于硬件平臺開發領域，同時也可以運行在多個主流平臺。使用Qt編寫圖形界面依賴C++，運行效率高。

隨著我國互聯網時代的爆發，PC互聯網已接近飽和，移動互聯網發展速度飛快。《中國移動互聯網行業市場前瞻與投資戰略規劃分析報告前瞻》數據顯示，截止2013年底，中國手機網民超過5億，占比達81%。隨著wifi與移動4G的普及，移動互聯網網民呈爆發趨勢。

同時，無論是PC端，移動端，嵌入式平臺，都離不開多媒體播放器。然而在數據可視化，跨平臺方面還有很大的提升潛力，Qt與Node.js在圖形界面和web端都是非常強大的開發環境與框架。同時，大量的用戶使用也為hadoop， mapreduce， MongoDB等大數據處理工具提供了很好的應用場景。

一、總體設計

1.基本功能

多媒體播放器的基本功能：播放，暫停，切換，上傳，分享。這是無論任何播放器必須具備的功能。在此基礎上，本文設計的播放器增加了：音樂可視化，用戶音樂播放頻率統計等功能。使得播放器的體驗更豐富，同時通過收集web服務器與數據庫中用戶所產生的數據，利用大數據工具對用戶行為進行分析。同時，使用云服務器，為使用者提供存儲環境。

1.1整體架構

系統分為以下幾個部分：客戶端，web前端，web服務器，MongoDB數據庫，hadoop集群以及HDFS分布式文件系統。

2.整體設計

2.1 客戶端設計

客戶端設計的目的是為了方便經常使用PC與移動端App的用戶。與瀏覽器請求服務器數據類似，客戶端可以通過Qt實現界面，再通過向web服務器請求數據來實現，是一種典型的C/S架構。

2.2前端設計

前端通過html5技術，從服務器后端將數據得到之后通過webAudio接口，可以實現數據的實時可視化。通過對數據不同方式的處理，可以實現不同的2D圖形。同時，圖形可以跟隨音頻和音量改變波形，展現出更好的視覺效果.

2.3 web服務器端設計

Web服務器端需要實現數據庫與客戶端或前端之間的交互，數據流的傳遞。同時，web服務器端需要充分優化，以保證在大量用戶同時訪問時的高并發狀態，保證服務器的負載均衡，以及快速的響應時間。由于要實現對用戶隱私的保護和對點擊數據的收集，還需要增加服務器的數量以及安全性能。

2.4 hadoop集群與HDFS分布式存儲系統設計

文件系統數據采用分布式系統存儲，不僅能夠勝任大量用戶訪問的任務，同時后期也可以利用編寫MR程序來處理用戶使用所產生的大數據。

3.軟件設計與實現

3.1 web服務器實現

本系統的服務器端通過Node.js框架實現，分層采用MVC模式，通過連接MongoDB與文件系統，實現對結構化數據與非結構化數據的存儲，客戶端通過http協議與服務器交互。部分代碼如下：

var express = require（"express"）；

var router = express.Router（）；

var mediaPath = 'public/media'；

router.get（'/'， function（req， res）{

var fs = require（"fs"）；

fs.readdir（mediaPath， function（err， files）{

if（err）{

console.log（err）；

}else{

res.render（'index'， {title： 'bayer music'， music： files}）；

}

}）；

}）；

module.exports = router；

3.2 客戶端的實現

客戶端通過Qt實現，圖形界面需要提供播放多媒體流，菜單，暫停，上傳，下載按鈕等。核心代碼的實現如下：

void MyWidget：：InitPlayer（）

{

//窗口基本屬性

setWindowTitle（tr（"多媒體播放器"））；

setMinimumSize（320， 160）；

setMaximumSize（320， 160）；

media_object = new Phonon：：MediaObject（this）；

Phonon：：AudioOutput *audio_output = new Phonon：：AudioOutput（Phonon：：MusicCategory， this）；

Phonon：：createPath（media_object， audio_output）；

//設置播放動作

QToolBar *tool_bar = new QToolBar（this）；

play_action = new QAction（this）；

play_action->setIcon（QIcon（"：/images/1.png"））；

connect（play_action， SIGNAL（triggered（））， this， SLOT（SetPaused（）））；

//設置停止動作

stop_action = new QAction（this）；

stop_action->setIcon（QIcon（"：/images/stop.png"））；

connect（stop_action， SIGNAL（triggered（））， this， SLOT（stop（）））；

//設置下一首

skip_forward_action = new QAction（this）；

skip_forward_action->setIcon（QIcon（"：/images/skipForward.png"））；

skip_forward_action->setText（tr（"上一首（Ctrl+Right）"））；

skip_forward_action->setShortcut（QKeySequence（"Ctrl+Right"））；

connect（skip_forward_action， SIGNAL（triggered（））， this， SLOT（SkipForward（）））；

}

3.3可視化的實現

數據可視化（Data Visualization）是信息可視化的中的一類指將數據用統計圖的方式呈現出來，這種技術起源于與1960s計算機圖形學，使用計算機創建圖形圖表，可視化的將數據各種屬性變量呈現出來。一般有數據采集、分析、治理、管理、挖掘等一系列復雜的數據處理過程，然后在創建對應的可視化算法。例如餅圖，散點圖，柱狀圖等都是數據可視化常見應用。此播放器的動態柱狀圖就是根據節奏頻率的數據可視化而展現的，部分核心代碼展示：

/*可視化*/

MusicVisualizer.visualize = function（mv）{

mv.analyser.fftSize = mv.size * 2；

var arr = new Uint8Array（mv.analyser.frequencyBinCount）；

var requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame||window.oRequestAnimationFrame || window.mzRequestAnimationFrame；

MusicVisualizer.isFunction（mv.visualizer）&& requestAnimationFrame（v）；

}

MusicVisualizer.prototype.decode=function（arraybuffer， fun）{

var self=this；

MusicVisualizer.ac.decodeAudioData（arraybuffer， function（buffer）{

var bufferSourceNode = MusicVisualizer.ac.createBufferSource（）；

bufferSourceNode.buffer = buffer；

fun.call（bufferSourceNode）；

}，function（err）{

console.log（err）；

}）

}

二、結語

本文討論了一款基于Qt與node.js的跨平臺可視化多媒體播放器，該系統可以在web端，PC端，android客戶端，IOS客戶端等多平臺安全訪問。同時，本文還提出了一種客戶端與前端通過請求web服務器連接NoSQL，實時解析音頻文件生成圖像，通過音頻與音量實時變化，實現數據可視化的方案。

參考文獻

[1]孫增圻.系統分析與控制.清華大學出版社

[2]Brain Goetz 等 Java 并發編程實戰. 機械工業出版社

[3]Jasmin Blanchette 等 C++ GUI Qt4 編程. 電子工業出版社

[4]吳軍. 數學之美 .人民郵電出版社.

[5]陸文周. Qt5. 開發及實例. 電子工業出版社.