轉(zhuǎn)載請說明原出處，謝謝~~

? ? ? ? ?昨天把大致布局分析了一下，昨天晚上把布局寫好實現(xiàn)了，今天把大致的功能完成了一下，現(xiàn)在的外觀已經(jīng)和原酷狗的換膚界面完全一樣，其中的調(diào)整播放列表透明度和設(shè)置整個軟件透明度的代碼已經(jīng)完成了，先把效果圖貼一下，然后開發(fā)說開發(fā)過程。

??

開發(fā)步驟一：

? ? ? ?布局的部分我就不說了，昨天已經(jīng)分析了，只要用好素材，花點時間就能把界面效果做出來，其中“官方皮膚”和

“我的皮膚”調(diào)用CTabLayout可以實現(xiàn)兩個界面的切換，如圖：

??

? ? ? 原酷狗在切換這兩個界面時是有動畫效果的，所以在這個地方我是用來 擴(kuò)展后的CTabLayout控件

CUIAnimationTabLayout,實現(xiàn)了切換時的動畫效果。

開發(fā)步驟二：

? ? ?接下來我先把設(shè)置播放列表透明度和設(shè)置皮膚透明度的功能完成。

? ? ? ?在點擊了列表透明的組合框后會彈出個含有滑動條控件的界面來設(shè)置透明度，當(dāng)鼠標(biāo)移出它的范圍時會自動銷毀

? ? ??

? ? ? 從功能外觀上這是屬于組合框的范疇，但是在和duilib的組合框的功能對比后發(fā)現(xiàn)，duilib無法實現(xiàn)這樣的效果，實際上duilib的組合框CComboUI的彈出界面是出現(xiàn)在下方而不是上方，第二CComboUI的內(nèi)容一般是多個文字選項，第

三CComboUI的文字需要通過點擊它下拉菜單的選項來改變而無法單獨設(shè)置。綜上三點不適合用CComboUI來做這部

分。

? ? ? 那應(yīng)該怎么做？我首先想到的是使用已經(jīng)寫好的菜單控件來做這個功能，的確，菜單從功能上還是外觀都可以勝

任，不過有一點就是菜單不會在鼠標(biāo)移除范圍時自動銷毀。反過來一想我又覺得用菜單不合適，一來菜單的功能比這

個復(fù)雜得多，編寫菜單用了1000多行代碼，用在這里感覺降低程序性能，二來不至于為了自動銷毀功能再去修改菜單

的代碼。所以干脆我又寫了一個名叫CPopupWidget的專門用于彈出小掛件的類，這個類就是個簡單的彈出窗體類，

繼承了CWindowWnd和INotifyUI。整個類代碼只用了大概250行，和其他窗體類沒什么太大區(qū)別。

? ? ? 自動銷毀這個功能很容易實現(xiàn)，只要在HandleMessage函數(shù)中處理WM_MOUSERLEAVE消息，調(diào)用close()函數(shù)

就可以了。使用這個CPopupWidget類的時候傳入xml布局文件進(jìn)去來決定他的外觀。

? ? ? 在這個窗體中有一個CSliderUI控件，這個控件在滑動時會去改變主窗體的播放列表的透明度，為此我需要把

CSliderUI控件的滑動事件通知到主窗體，這部分的實現(xiàn)代碼已經(jīng)在《為duilib的MenuDemo增加消息響應(yīng)，優(yōu)化代

碼和顯示效果》點擊打開鏈接，這里講過了，使用的是第一種消息通知方法。

? ? ? ?主窗體接收到了_T("valuechanged") 或者 _T("movevaluechanged")消息后，先判斷是否是要改變播放列表透明

度的事件，確認(rèn)后去改變透明度。有些朋友不知道怎么去改變duilib的一個控件的透明度，其實很簡單:為對應(yīng)的控件

設(shè)置一個背景圖并且設(shè)置fade屬性，比如bkimage="file='UI\LeftTab\List_bk.png' fade='122'"，背景圖是任意的，關(guān)鍵

在于fade屬性，他是改變圖片透明度的屬性，所以只要動態(tài)修改這個屬性的值就可以改變?nèi)我饪丶谋尘暗耐该鞫?/span>

了。

? ? ? ? 最終的設(shè)置列表透明度的效果如下：

? ? ?

開發(fā)步驟三：

? ? ? ?接下來完成設(shè)置窗體透明度的部分，在原酷狗里面，這個窗體透明度的的彈出窗體的外觀和設(shè)置播放列表的透明

度的外觀是一樣的，這就大大減少了我的工作量，如圖

? ? ? ?

? ? ? ? ?同樣的原理，在主窗體接收到滑動消息后，先確認(rèn)是改變窗體透明度的消息，然后開始設(shè)置，在duilib的

CPaintManager類中已經(jīng)有現(xiàn)成的函數(shù)SetTransparent，直接拿來用就可以改變整個窗體的透明度，不用想也知道其

實就是調(diào)用了 系統(tǒng)的SetLayeredWindowAttributes函數(shù)實現(xiàn)的。我就不贅述了。

? ? ? ? ?比較麻煩的一點就是，在主窗體、皮膚設(shè)置窗體和小掛件窗體之間有許多共享的信息，這些信息的溝通就只能

靠傳遞相應(yīng)的參數(shù)來實現(xiàn)了，主窗體的指針要傳到皮膚設(shè)置窗體，好讓皮膚設(shè)置窗體得知一些主窗體的透明度信息來

初始化自己的控件，小掛件窗體需要獲取主窗體的CPaintManager實例的指針來發(fā)送消息，同時也需要皮膚設(shè)置窗體

的指針來改變這兩個組合框內(nèi)的值，。小掛件的參數(shù)的傳遞主要都在他

的Init函數(shù)中，Init函數(shù)的參數(shù)我已經(jīng)做了注釋，大家可以自己看源碼。

? ? ? ?實際上，那個看似組合框的控件并不是組合框，而是一個按鈕，只不過背景圖片中添加了個小箭頭來達(dá)到視覺上

的效果。^_^~~

開發(fā)步驟四：

? ? ?做完了兩個功能，接下來把自定義皮膚按鈕的功能做一下，在單擊自定義皮膚按鈕時會彈出系統(tǒng)的打開對話框去選

擇一個圖片來做皮膚，這個功能實現(xiàn)起來最簡單，只需要用GetOpenFileName函數(shù)來封裝一個打開對話框的函數(shù)去調(diào)

用就可以了，最后把返回的路徑的值處理一下就可以用了。

結(jié)束：

? ? ?今天就寫這么多代碼吧，另外還有幾個沒實現(xiàn)的功能等明天再做。第一個沒實現(xiàn)的功能是調(diào)色板功能，原酷狗的調(diào)

色板如下：

? ??

? ? ? 在這里任意選擇顏色后可以應(yīng)用到整個窗體。

? ? ? ?第二個沒做其實就是換膚，實際上我還沒有寫換膚的代碼，就是點擊一個圖片就讓整個軟件的所有窗口的背景圖

統(tǒng)一變換。但是實際這個最簡單的功能，無非就是通知所有窗口換個背景圖，所以不著急做這個功能。

? ? ? 第三個沒有做的是每個顯示的背景圖的小圖的動態(tài)外觀，原酷狗的背景圖的小圖標(biāo)，有normal、hover、down等

多種狀態(tài)，如圖

? ? ? 當(dāng)鼠標(biāo)經(jīng)過時會有個黑色圖片覆蓋，并且在他上面顯示出作者的一些信息。要實現(xiàn)這個效果應(yīng)該另外開發(fā)一個控

件來支持動態(tài)的信息展示效果，不過這個控件的開發(fā)難度比起播放列表控件要簡單得多，應(yīng)該很容易做出來。

? ? ? CWidgetPopup類的下載地址：點擊打開鏈接

? ? ?Redrain ?2014.8.7 ?18:15

? ?

轉(zhuǎn)載于:https://www.cnblogs.com/redrainblog/p/4275833.html

總結(jié)

以上是生活随笔為你收集整理的仿酷狗音乐播放器开发日志十八——换肤功能的实现二：改变控件和窗体透明度（附挂件类源码）...的全部內(nèi)容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內(nèi)容還不錯，歡迎將生活随笔推薦給好友。