基于Qt的高性能網(wǎng)絡(luò)音樂播放器的設(shè)計與實現(xiàn)

鄢 濤, 劉永紅, 趙衛(wèi)東, 余 悅, 曾 誼, 于 曦

(1.成都大學(xué) 模式識別與智能信息處理四川省高校重點實驗室, 四川 成都 610106； 2.成都大學(xué) 信息科學(xué)與工程學(xué)院, 四川 成都 610106)

基于Qt的高性能網(wǎng)絡(luò)音樂播放器的設(shè)計與實現(xiàn)

鄢 濤1,2, 劉永紅1,2, 趙衛(wèi)東1,2, 余 悅2, 曾 誼2, 于 曦1,2

(1.成都大學(xué) 模式識別與智能信息處理四川省高校重點實驗室, 四川 成都 610106； 2.成都大學(xué) 信息科學(xué)與工程學(xué)院, 四川 成都 610106)

目前基于網(wǎng)絡(luò)的音樂播放器功能普遍存在2個主要問題：廣告太多；在后臺運行不必要的進(jìn)程而導(dǎo)致性能較低.針對這些情況，設(shè)計并實現(xiàn)了一款基于Qt的高性能網(wǎng)絡(luò)音樂播放器.該播放器利用開放的音樂搜索應(yīng)用程序編程接口，實現(xiàn)了在線搜索、在線播放、下載音樂及桌面歌詞等功能.此外，用戶界面設(shè)計中采用雙緩沖繪圖技術(shù)，并且程序經(jīng)過大量代碼層面的優(yōu)化，使得該播放器純凈并擁有非常良好的性能表現(xiàn).

Qt；在線音樂；播放器；高性能；雙緩沖

0 引 言

互聯(lián)網(wǎng)上有非常豐富的音樂資源，也有不少基于這些資源的音樂播放器.這些音樂播放器普遍功能都較強大，但出于商業(yè)因素，通常會嵌入很多廣告、新聞，甚至?xí)?jīng)常出現(xiàn)彈窗給用戶帶來影響.同時，由于軟件功能的多樣化和復(fù)雜性，這些音樂播放器很難做到性能優(yōu)異[1-2].Qt是一個基于C++的跨平臺圖形用戶界面(Graphical User Interface,GUI)應(yīng)用程序開發(fā)框架，它提供給應(yīng)用程序開發(fā)者建立藝術(shù)級GUI所需的所有功能，允許組件編程，且易擴展.此外，Qt提供了較豐富的套接字、傳輸控制協(xié)議、文件傳輸協(xié)議等與平臺無關(guān)的類，能夠方便地進(jìn)行網(wǎng)絡(luò)功能開發(fā)[3-7].本研究討論了利用Qt的GUI框架和網(wǎng)絡(luò)功能，以及雙緩沖技術(shù)，實現(xiàn)了一款純凈、高性能的音樂播放器，其既具有網(wǎng)絡(luò)音樂播放器的常用功能，也可以實現(xiàn)播放本地音樂.

1 核心功能設(shè)計

1.1 網(wǎng)絡(luò)功能應(yīng)用程序編程接口(Application Programming Interface,API)的封裝

要實現(xiàn)在線試聽，需要有相關(guān)的音樂搜索API.目前，許多播放器公司都提供開放的音樂搜索API，如酷狗音樂的API為：http://mobilecdn.kugou.com/api/v3/search/song?format=jsonp&keyword={0}&page={1}&pagesize={2}″&showtype=1&callback=kgJSONP238513750.其中，{0}表示需要搜索的歌曲或歌手，{1}表示查詢的頁碼數(shù)，{2}表示當(dāng)前頁的返回數(shù)量.

以上API的請求方式為GET，返回數(shù)據(jù)為一個JSON對象，通過對JSON進(jìn)行解析，就可以得到想要的數(shù)據(jù).Qt已經(jīng)提供了JSON解析的相關(guān)類，只需要根據(jù)酷狗音樂的JSON數(shù)據(jù)規(guī)則編寫相關(guān)解析代碼即可，

QVector analysis(QNetworkReply *reply)

{

QByteArray json=reply->readAll();/*API返回的是

JSON數(shù)據(jù)*/

QJsonParseError error;

QJsonDocument doucoument=QJsonDocument::fromJson(json,

&error);

QJsonObject obj=doucoument.object();

QJsonArray jsArray=obj.take(″data″).toObject().take

(″info″).toArray();/*有效數(shù)據(jù)*/

int size=jsArray.size();

QVector t(size);

for (int i=0;i

{

t[i].hashCode=jsArray[i].toObject().take(″hash″).

toString();/*音樂哈希碼，通過它來實現(xiàn)播放*/

t[i].musicName=jsArray[i].toObject().take

(″songname″).toString();/*音樂名*/

t[i].singer=jsArray[i].toObject().take

(″singername″).toString();/*歌手名*/

t[i].duration=jsArray[i].toObject().take

(″duration″).toInt();/*音樂時長*/

}

return t;

}

1.2 定時器與界面更新

音樂播放的過程中，需要隨時對主界面進(jìn)行更新，更新的內(nèi)容包括進(jìn)度條及歌詞等.這時，就需要使用操作系統(tǒng)提供的“定時器”功能，每隔一段時間對界面進(jìn)行一次更新.Qt已經(jīng)把“定時器”封裝成一個叫做QTimer的類，這個類的使用也是非常簡單的，只需要編寫好處理函數(shù)即可.處理函數(shù)如下，

void update()

{

auto intToString=[this](size-t)->QString/*匿名函數(shù)，

用于把時間轉(zhuǎn)換成一定格式的字符串*/

{

size-t min,sec;

QString minStr,secStr;

min=t/60;

t-=min*60;

sec=t;

minStr+=QString::number(min);

if (min<10)

{

minStr.push-front(′0′);

}

secStr+=QString::number(sec);

if (sec<10)

{

secStr.push-front(′0′);

}

return minStr+′:′+secStr;

};

playProgress=player->position();/*同步已播放的長度*/

lyricsBar->updateLyrics(playProgress);/*重繪桌面歌詞*/

if (playProgress-lastUpdateTime>1000)/*進(jìn)度條不必隨

時更新，1 000 ms更新一次即可*/

{

lastUpdateTime=playProgress;

progress->setText(intToString(playProgress/1000)+

′/′+intToString(maxDuration/1000));

songSlider->setValue(playProgress/1000);

}

}

2 界面設(shè)計

2.1 無邊框窗口拖動

每個GUI程序都可以通過標(biāo)題欄來實現(xiàn)窗口拖動.為了音樂播放器的美觀，通常會省略標(biāo)題欄.如果想要任意拖動窗口，就需要編寫相關(guān)事件代碼來實現(xiàn).

Windows系統(tǒng)中，存在各種“消息”，如鼠標(biāo)消息、按鍵消息等.Qt已經(jīng)把想要的“消息”封裝成3個函數(shù)：mousePressEvent、mouseMoveEvent、mouseReleaseEvent.通過重寫這些函數(shù)，即可實現(xiàn)對鼠標(biāo)行為的定制，

void mouseReleaseEvent(QMouseEvent*event)

{

isPress=false;

}

void mousePressEvent(QMouseEvent*event)

{

lastPos=event->globalPos();/*記錄鼠標(biāo)的當(dāng)前位置*/

isPress=true;/*標(biāo)記鼠標(biāo)是否在主面板上按下*/

}

void mouseMoveEvent(QMouseEvent*event)

{

if (isPress)/*鼠標(biāo)按下的時候才移動，防止從子控件移

動到主面板上時產(chǎn)生的“瞬移”*/

{

int dx=event->globalX()-lastPos.x();

int dy=event->globalY()-lastPos.y();

lastPos=event->globalPos();

move(x()+dx,y()+dy);/*通過鼠標(biāo)上次出現(xiàn)的位

置與當(dāng)前位置的差，求出窗口的移動方向和長度*/

}

}其中，isPress是播放器的一個內(nèi)部變量，它的存在十分關(guān)鍵.Qt提供了很多種無邊框窗口移動的代碼，但其幾乎都沒有isPress的存在.這種情況下，如果在播放器主面板的一個子控件上按下鼠標(biāo)，然后把鼠標(biāo)移動到主面板上，播放器窗口就會出現(xiàn)“瞬移”現(xiàn)象，因此必須引入isPress才能解決問題.

2.2 用QSS美化界面

QSS(Qt Style Sheets)是一種類似于WEB設(shè)計中層疊樣式表(Cascading Style Sheets,CSS)技術(shù)的設(shè)計語言，它的目標(biāo)和CSS相同，即實現(xiàn)表現(xiàn)與內(nèi)容分離.通過QSS，可以很方便地實現(xiàn)界面的美化，而不需要編寫大量用于控件自繪的代碼.比如，設(shè)置按鈕的背景圖片，

QPushButton#closeBt

{

border-image:url(″data/icon/closeNormal.png″);

height:18px;

width:23px;

border:0px;

}

QPushButton#closeBt:hover

{

border-image:url(″data/icon/closeHover.png″);

height:18px;

width:23px;

border:0px;

}

QPushButton#closeBt:pressed

{

border-image:url(″data/icon/closePress.png″);

height:18px;

width:23px;

border:0px;

}

同時，QSS還能對按鈕closeBt的普通、懸停、按下3個狀態(tài)分別設(shè)置不同背景圖片(見圖1).

圖1 QSS美化之后的播放器界面

2.3 皮膚更換

QSS能完成絕大多數(shù)界面美化工作，但不包括播放器主面板這個頂級窗口的美化.一方面，讓用戶通過修改QSS的方式來更換皮膚是非常不人性化的；另一方面，QSS也難以應(yīng)對用戶選擇圖片當(dāng)皮膚的需求.所以，要實現(xiàn)皮膚更換，只有重寫paintEvent實現(xiàn)窗口自繪.主要功能代碼如下，

void paintEvent(QPaintEvent*e)

{

QPainter painter(this);

painter.drawPixmap(rect(),skin);/*按照窗口的大小繪制

圖片*/

QWidget::paintEvent(e);/*調(diào)用父類的繪圖函數(shù)，保證其

他部分能正確繪制*/

}

其中，skin是一個QPixmap類的對象，里面容納著當(dāng)前的皮膚.更換皮膚時，只需要修改skin，然后重繪界面即可.

3 歌詞的處理

3.1 用正則表達(dá)式解析歌詞

歌詞的處理看似簡單，實際上比較復(fù)雜.目前，一種主流的歌詞文件格式是.Lrc，要解析的正是這種格式的歌詞文件.Lrc文件的每一行格式如下，

[mm:ss.xx]歌詞內(nèi)容

其中，mm表示分鐘數(shù)，ss表示秒數(shù)，xx表示百分之一秒數(shù).這個數(shù)據(jù)指明某一句歌詞出現(xiàn)的具體時間，而中括號后面的內(nèi)容則是歌詞的正式內(nèi)容.

Lrc文件的規(guī)律性如此之強，以至于可以直接使用正則表達(dá)式來對其進(jìn)行解析.很多廠商都提供了正則表達(dá)式解析引擎，C++ 11標(biāo)準(zhǔn)也讓正則表達(dá)式解析進(jìn)入了C++的標(biāo)準(zhǔn).不過由于播放器基于Qt開發(fā)，所以最終采用Qt提供的解析器.正則表達(dá)式的解析代碼如下，

QRegExp regexp;

regexp.setPattern(″\d{2}(?=:)″);/*設(shè)置匹配模式，匹配 一個長度為2的數(shù)字及:*/

regexp.indexIn(lyrics);

int minute=regexp.cap(0).toInt();/*將匹配到的第一個作為 分鐘數(shù)*/

regexp.setPattern(″\d{2}(?=\.)″);/*匹配一個長度為 2的數(shù)字及.*/

regexp.indexIn(lyrics);

int second=regexp.cap(0).toInt();/*將匹配到的第一個作為 秒數(shù)*/

regexp.setPattern(″\d{2}(?=\])″);/*匹配一個長度為 2的數(shù)字及]*/

regexp.indexIn(lyrics);

int millisecond = regexp.cap(0).toInt();/*將匹配到的第一個 作為百分之一秒數(shù)*/

int duration=minute*60000+second*1000+millisecond*10; /*簡單的時間轉(zhuǎn)換*/

regexp.setPattern(″\[\d{2}:\d{2}\.\d{2}\]″);

QString lrcString=lyrics.replace(regexp,″″);/*將所有的時間戳

替換成空字符串，結(jié)果即為歌詞*/

以上代碼只說明了解析的過程，實際代碼要更復(fù)雜一些.

3.2 滾動歌詞的實現(xiàn)

大多數(shù)播放器顯示歌詞時，都會給歌詞添加一點“動態(tài)”效果，看起來就像在“滾動”一樣.實際上，所謂的“滾動”效果，實現(xiàn)起來并不復(fù)雜.繪制歌詞時，繪制兩層文字：第一層完全繪制，第二層則根據(jù)進(jìn)度來繪制其中某些部分.由于界面更新速度非常快，所以看起來就好像是歌詞在滾動一般.相關(guān)實現(xiàn)為，

void paint()

{

QPainter painter(this);

painter.setFont(font);

painter.setPen(QColor(0,0,0));

painter.drawText(1,1,800,58,Qt::AlignVCenter|Qt::

AlignLeft,first);/*繪制一層黑色文字作為

基底，讓歌詞顯得更有質(zhì)感*/

painter.setPen(QPen(normalGradient1,0));/*繪制第一層

漸變文字，漸變可以被用戶所設(shè)置*/

painter.drawText(0,0,800,58,Qt::AlignVCenter|Qt::

AlignLeft,first);/*對齊方式為左對齊*/

painter.setPen(QPen(maskGradient1,0));/*繪制遮罩層*/

painter.drawText(0,0,progress*maxPix,58,Qt::

AlignVCenter|Qt::AlignLeft,first);/*progress是當(dāng)前進(jìn)度，

通過這個參數(shù)可以控制遮罩部分的寬度*/

}

3.3 雙緩沖繪圖技術(shù)

播放器需要繪制的歌詞非常多，除了桌面歌詞，還有嵌在主面板的窗口歌詞，而這些歌詞需要經(jīng)常更新(設(shè)定50 ms更新一次).在Debug模式下，音樂播放器平均CPU占用為5%(CPU主頻為2.6 GHz).如果換用Release模式，理論上能把CPU占用減少到3%，但播放器的性能依然太差.

通過對代碼分析發(fā)現(xiàn)，形如painter.drawText這樣的代碼非常多，性能瓶頸也正是來自這樣的代碼.從內(nèi)存(顯存)向屏幕繪制圖像，速度非常慢.如果每50 ms都要進(jìn)行大量繪制工作，CPU的開銷就相當(dāng)大.這時，可采用雙緩沖繪圖技術(shù)，即先一次性把所有文字繪制到內(nèi)存(顯存)中，然后再一次性把內(nèi)存中的數(shù)據(jù)繪制到屏幕上.由于往內(nèi)存繪制文字的速度遠(yuǎn)遠(yuǎn)高于往屏幕繪制的速度，所以即使雙緩沖繪圖看起來多了一些額外工作，而實際上卻擁有更好的性能表現(xiàn).雙緩沖的原理如下，

void paint()

{

QPixmap pix(width,height);

pix.fill(Qt::transparent);/*新建畫布，并用透明色填充*/

QPainter painter(&pix);/*現(xiàn)在painter將在畫布上繪圖*/

painter.setFont(font);

painter.setPen(QColor(255,255,255));

painter.drawText(firstRect, Qt::AlignCenter, firstText);

…/*大量的文字繪制*/

painter.setPen(QColor(255,255,255));

painter.drawText(seventhRect,Qt::AlignCenter,seventhText);

painter.drawPixmap(rect(),pix);/*將畫布中的內(nèi)容一次

性繪制到屏幕上*/

}

實際上，以上代碼也只展示了雙緩沖繪圖的基本操作方式，實際代碼根據(jù)需要做了優(yōu)化，比如，不必每次都繪制底層文字，也不必每次都重新填充畫布，完全可以在繪制完所有底層文字之后，將畫布保存起來，以后每次更新時，只需往畫布上繪制遮罩層即可，直到歌詞內(nèi)容需要改變?yōu)橹?見圖2).

圖2 最終效果

采用雙緩沖繪圖技術(shù)優(yōu)化之后，播放器在Debug下的平均CPU占用減少到2.5%，在Release模式下更是減少到了1%.這樣的性能表現(xiàn)非常優(yōu)秀，因為主流播放器的平均CPU占用都在2%到3%之間.

4 結(jié) 論

本研究設(shè)計并實現(xiàn)了一款基于Qt技術(shù)的網(wǎng)絡(luò)音樂播放器.該播放器純凈無廣告、功能完善且性能高.此外，開發(fā)過程中所用到的無邊框窗口拖動技術(shù)，也可廣泛應(yīng)用于桌面開發(fā)中.需要指出的是，本研究提出的解決方案雖然不復(fù)雜，但卻比大多數(shù)方案更有效，其中，歌詞解析時靈活使用了正則表達(dá)式，而雙緩沖繪圖技術(shù)的應(yīng)用，更是大大提高了繪圖效率.這些技術(shù)的總結(jié)，對與Qt相關(guān)的多媒體開發(fā)具有重要參考價值.

[1]Blanchette J,Summerfield M.C++ GUI Qt 4編程[M].閆鋒欣,曾泉人,張志強,譯.北京:電子工業(yè)出版社,2013.

[2]焦正才,樊文俠.基于Qt/Embedded的MP3音樂播放器的設(shè)計與實現(xiàn)[J].電子設(shè)計工程,2012,20(7):148-150.

[3]Gregoire M,Solter N A,Klerper S J.C++高級編程[M].侯普秀,鄭思遙,譯.北京:清華大學(xué)出版社,2014.

[4]Wong Michael,IBM XL編譯器中國開發(fā)團(tuán)隊.深入理解C++ 11[M].北京:機械工業(yè)出版社,2016.

[5]蔡志明.精通Qt 4編程[M].北京:電子工業(yè)出版社,2011.

[6]Summerfield M.Qt高級編程[M].白建平,王軍鋒,閆鋒欣,譯.北京:電子工業(yè)出版社,2011.

[7]劉曉立,趙俊逸.基于Qt的音樂播放器[J].軟件導(dǎo)刊,2015,14(10):112-114.

Design and Implementation of High Performance Online Music Player Based on Qt

YANTao1,2,LIUYonghong1,2,ZHAOWeidong1,2,YUYue2,ZENGYi2,YUXi1,2

(1.Key Laboratory of Pattern Recognition and Intelligent Information Processing of Sichuan Province, Chengdu University, Chengdu 610106, China; 2.School of Information Science and Engineering, Chengdu University, Chengdu 610106, China)

Most music players based on Internet have their own powerful functions presently.However,there are two main problems in these music players:one is that there are too many advertisements and the other is that their performance is low due to some processes running background.In order to solve these problems,this paper designs and implements a high performance music player based on Qt software.By fully utilizing the open music search API,the player implements some functions such as online search,online playing,downloading music,desktop lyrics,etc.Furthermore,by using double-buffering technology UI design,and through the optimization of the coding,the player proposed now by this paper is pure and of high performance.

Qt;online music;player;high performance;double-buffering

1004-5422(2017)01-0055-05

2016-11-03.

四川省科技廳軟科學(xué)研究計劃(2017ZR0198)資助項目.

鄢 濤(1973 — )， 男， 碩士， 副教授， 從事計算機軟件工程研究.

TN912.23+1；TP311.52

A