嵌入式Qt開發(fā)一個(gè)音樂(lè)播放器
，進(jìn)行了OK3568開發(fā)板軟件開發(fā)環(huán)境搭建，通過(guò)編譯RK3568的源碼，可以得到Qt開發(fā)的交叉編譯相關(guān)工具。
本篇，就來(lái)在搭建好的軟件開發(fā)中，進(jìn)行Qt軟件的開發(fā)測(cè)試。由于Qt是支持跨平臺(tái)的，因此本篇的音樂(lè)播放器，先在Windows上編寫調(diào)試，功能調(diào)好后再通過(guò)交叉編譯，在Linux板子上測(cè)試。
在第一篇的開箱介紹中，體驗(yàn)了OK3568板子自帶的Qt界面，有視頻播放器、音樂(lè)播放器等，這些都實(shí)現(xiàn)了基本的播放功能，但沒(méi)有對(duì)操作界面做更加豐富的開發(fā)，所以，本篇來(lái)實(shí)現(xiàn)一個(gè)界面更加優(yōu)美，操作更新方便的音樂(lè)播放器軟件，可以實(shí)現(xiàn)音樂(lè)列表的顯示與選擇播放、歌詞顯示等，先來(lái)看下最終的效果：
本篇的Qt代碼從野火Linux開發(fā)板的例程中移植修改而來(lái)，下面分析下程序的代碼結(jié)構(gòu)。
1 音樂(lè)播放器開發(fā)總體結(jié)構(gòu)
整個(gè)Qt音樂(lè)播放器項(xiàng)目的代碼結(jié)構(gòu)如下：
主代碼中是音樂(lè)播放器相關(guān)的代碼，包括：
音樂(lè)播放器主界面
唱片動(dòng)畫界面：在音樂(lè)播放時(shí)顯示一個(gè)唱片轉(zhuǎn)動(dòng)的動(dòng)畫效果
操作按鈕界面：實(shí)現(xiàn)播放、暫停、繼續(xù)、上一首、下一首、進(jìn)度調(diào)節(jié)，音量調(diào)節(jié)
歌詞顯示界面：當(dāng)有對(duì)應(yīng)的歌詞時(shí)，顯示歌詞
歌詞加載與計(jì)算
Ui代碼中使用一些Qt的基本功能，包括：
一個(gè)Qt界面基類
滑條功能類
圖標(biāo)按鈕顯示類
列表功能類
Skin中是一些圖片資源和字體/皮膚定義
最后是編譯的中間文件和編譯結(jié)果存儲(chǔ)的目錄
先看下程序的主要代碼實(shí)現(xiàn)。
首先是整體的主界面部分，進(jìn)行各項(xiàng)功能的初始化顯示，主要包括：
唱片界面初始化
歌詞界面初始化
按鈕界面初始化
播放列表初始化
初始化各個(gè)界面后，還要連接對(duì)應(yīng)的槽函數(shù)，如點(diǎn)擊操作按鈕后的處理、切換播放列表中的音樂(lè)時(shí)的處理等。
2 自定義控件的代碼
在介紹音樂(lè)播放器代碼之前，需要先介紹一些Qt自定義控件的代碼，這些代碼屬于公共代碼，寫好了之后，不僅音樂(lè)播放器可以用，后續(xù)開發(fā)其它功能，也可以復(fù)用這部分代碼。
2.1 qtwidgetbase
這個(gè)cpp文件中定義了3個(gè)類：
2.1.1 QtWidgetBase
窗口基類，該類的一個(gè)主要功能是可以向窗口內(nèi)添加圖片形式的按鈕，并且通過(guò)鼠標(biāo)事件，給出哪個(gè)按鈕被按下：
2.1.2 QtWidgetTitleBar
窗口的標(biāo)題欄，用于繪制窗口上方的標(biāo)題，如顯示“音樂(lè)播放器”這幾個(gè)字，另外，標(biāo)題欄右側(cè)，還支持一個(gè)應(yīng)用退出(返回)的圖標(biāo)按鈕：
2.1.3 QtAnimationWidget
屬性動(dòng)畫移動(dòng)窗體，該類用于在窗口中實(shí)現(xiàn)一些簡(jiǎn)單的動(dòng)畫效果，如音樂(lè)播放器會(huì)有一個(gè)唱片轉(zhuǎn)動(dòng)和唱針抬起放下的動(dòng)作。
該類通過(guò)調(diào)用Qt的QPropertyAnimation屬性動(dòng)畫類，實(shí)現(xiàn)相關(guān)的功能:
QPropertyAnimation類的主要API接口：
setStartValue：指定動(dòng)作的初始狀態(tài)
setEndValue：指定動(dòng)作的最終狀態(tài)
setDuration：指定動(dòng)畫時(shí)長(zhǎng)，單位為毫秒
start：進(jìn)行動(dòng)畫播放
2.2 qtsliderbar
用于實(shí)現(xiàn)自定義滑條控件，分為水平滑條與豎直滑條，音樂(lè)播放器的播放進(jìn)度，需要用到水平滑條，音樂(lè)播放器的音量調(diào)節(jié)，需要用到豎直滑條?；瑮l的基本形狀是一個(gè)具有一定粗細(xì)的直線代表滑條，上面一個(gè)圓形代表滑塊，可以是兩個(gè)顏色不同的同心圓。
畫水平滑條的主要代碼如下：
2.3 qtpixmapbutton
圖片按鈕，顧名思義就是(小)圖片形式的按鈕，支持未按下和按下后的兩種樣式的圖片顯示。如音樂(lè)播放器的這些操作按鈕，都是圖片形式的按鈕
該類在構(gòu)造函數(shù)時(shí)，將按鈕的id，圖片按鈕要顯示的位置，未按下時(shí)和按下時(shí)要展示的圖片，通過(guò)參數(shù)傳入即可：
2.4 qtlistwidget ?
這個(gè)cpp文件中定義了2個(gè)類：
QtListWidgetItem
QtListWidget
2.4.1 QtListWidgetItem
該類用于表示列表中的每一個(gè)項(xiàng)，可以是字符，并且可以帶有圖片(圖標(biāo))：
2.4.2 QtListWidget
項(xiàng)目的顯示，可以按列顯示，也可以按行顯示，并且支持鼠標(biāo)的滑動(dòng)顯示，音樂(lè)播放器的音樂(lè)列表，就是按列顯示的：
該組件的類定義如下：
3 音樂(lè)播放器代碼
上面介紹了一些公用的自定義組件，下面就是利用這些自定義組件，以及Qt的各種功能，實(shí)現(xiàn)一個(gè)音樂(lè)播放器。
3.1 音樂(lè)播放
音樂(lè)播放部分，主要有三部分功能：
音頻解碼播放：使用Qt自帶的媒體播放器組件QMediaPlayer進(jìn)行音頻播放
播放時(shí)的按鈕操作：上一首、暫停/繼續(xù)、下一首、播放進(jìn)度調(diào)節(jié)、音量調(diào)節(jié)、音樂(lè)列表按鈕
唱片動(dòng)畫界面：在音樂(lè)播放時(shí)顯示一個(gè)唱片轉(zhuǎn)動(dòng)的動(dòng)畫效果，以及唱針?lè)畔绿鸬膭?dòng)作
3.1.1 QMediaPlayer播放音頻
這里使用Qt自帶的QMediaPlayer組件進(jìn)行音頻的播放，QMediaPlayer播放音頻的基本步驟為：
創(chuàng)建一個(gè)QMediaPlayer
連接播放位置變化的槽函數(shù)
設(shè)置播放的音樂(lè)文件
設(shè)置音量
開始播放
3.1.2 播放操作按鈕
音樂(lè)播放時(shí)，需要用到播放、暫停、繼續(xù)、上一首、下一首、進(jìn)度調(diào)節(jié)、音量調(diào)節(jié)等操作按鈕，這里的對(duì)應(yīng)按鈕使用圖標(biāo)顯示為對(duì)應(yīng)的按鈕，通過(guò)加載QPixmap來(lái)實(shí)現(xiàn)：
3.1.3 播放時(shí)的動(dòng)畫界面
為了在播放時(shí)能有視覺上的動(dòng)態(tài)效果，這里加了一個(gè)唱片轉(zhuǎn)動(dòng)的動(dòng)畫效果，當(dāng)音樂(lè)播放時(shí)，唱針移動(dòng)到唱片上，唱片開始轉(zhuǎn)動(dòng)。
3.2 播放列表
播放列表功能用來(lái)實(shí)現(xiàn)音頻文件的顯示，以及手動(dòng)指定切換要播放的音樂(lè)。
3.2.1 讀取音樂(lè)文件
這里使用Qt的QMediaPlaylist組件來(lái)實(shí)現(xiàn)音樂(lè)列表的管理。QMediaPlaylist是一個(gè)列表，它可以保存媒體文件，包括媒體路徑等信息，它具有著列表的性質(zhì)，比如添加刪除插入等，但它能做的，比單純的儲(chǔ)存要多得多。設(shè)置播放順序，對(duì)播放的控制，保存到本地，從本地讀取，都可以很方便地實(shí)現(xiàn)。
3.2.2 音樂(lè)列表界面
音樂(lè)列表的具體界面實(shí)現(xiàn)，主要是在對(duì)應(yīng)的矩形位置，顯示各個(gè)音樂(lè)文件的名稱：
3.3 歌詞顯示
歌詞顯示功能，需要在音樂(lè)播放的時(shí)候，能根據(jù)播放的進(jìn)度，顯示對(duì)應(yīng)的歌詞。
3.3.1 歌詞顯示界面
歌詞界面的具體界面實(shí)現(xiàn)，主要是在對(duì)應(yīng)的矩形位置，顯示當(dāng)前音樂(lè)播放位置前后的音樂(lè)歌詞，并高亮當(dāng)前播放的那句歌詞：
3.3.2 歌詞顯示時(shí)間計(jì)算
通過(guò)下面這個(gè)函數(shù)，計(jì)算當(dāng)前音樂(lè)播放的位置：
4 交叉編譯與測(cè)試
如果是在Windows上編寫的程序，并且支持Windows上運(yùn)行，在Qt程序編寫好后，可以先在Windows查看運(yùn)行效果。
通過(guò)交叉編譯，來(lái)測(cè)試音樂(lè)播放器在OK3568-C板子上的播放效果。
為了方便每次的編譯，我這里編寫一個(gè)my3568build.sh的編譯腳本：
然后執(zhí)行該腳本即可編譯:
將編譯成功的可執(zhí)行文件MusicPlayer復(fù)制到OK3568-C板子中，然后在其同目錄下創(chuàng)建一個(gè)music文件夾，里面放入若干個(gè)mp3音樂(lè)文件和對(duì)應(yīng)的歌詞文件，然后就可以測(cè)試了：
文件復(fù)制到板子，我這里使用的ADB無(wú)線傳輸?shù)姆绞剑容^方便，具體ADB操作演示，可參考上篇文章最后的Qt交叉編譯與測(cè)試部分
5 總結(jié)
本篇介紹了使用Qt開發(fā)一個(gè)音樂(lè)播放器，首先是一個(gè)Qt自定義控件的介紹，包括滑條、圖標(biāo)按鈕、列表等，然后使用這些自定義組件，以及Qt的各種功能，實(shí)現(xiàn)一個(gè)音樂(lè)播放器，具有基礎(chǔ)的音樂(lè)播放、暫停繼續(xù)、歌曲列表顯示，歌曲切換等功能。代碼可以在Windows上運(yùn)行，通過(guò)交叉編譯，可以在OK-3568這塊Linux板子上運(yùn)行。
