經過一翻實驗總算找到一個方式來實做
以下是記錄 (一樣只記錄關鍵的地方)
1. 在 layout.h 增加一個新的 ColourChangeButton class
而最需要注意的地方，是 constructor 要有一個 ChangeListener 的 pointer 送進來
這個 pointer 是要在 ColourSelector 要設定 ChangeListener 的時候要拿來用的
需要這個 pointer 是因為這樣之後才能透過特定的 callback function 去變換背景顏色
2. 那 callback function 要寫在哪? pointer 又是指向誰?
答案就是 layout class
這邊讓 layout class 再多繼承 ChangeListener 這個 class，而因為繼承這個 class
必須去實做 changeListenerCallback() 這個 virtual function
最後，也再新增剛剛新建的 ColourChangeButton class 的 member object
3. 回到 layout.cpp，new 一個ColourChangeButton class object，並加入layout裡面
這邊可以看到，是將 this pointer 傳入
因為 tabbedComponent 是在 layout 這個 class 加的
所以只透過 layout 這個 class 來對 tabbedComponent 做設定
透過傳入 this pointer，這樣在之後的 callback function 裡面就可以直接對 tabbedComponent
做設定
4. 實做 callback function
主要概念是，當 ColourSelector 改變了顏色，因為有設定 ChangeListener
所以這個 callback function 就會被呼叫
加上之前有傳入指向 layout class 的 pointer
因此可以在這邊直接對 tabbedComponent 做背景顏色的設定
而要注意一點的是，除了改變 tabbedComponent 的背景顏色之外
也得必須讓 tab 裡面的原件知道這件事
就是 BigLotteryPage 和 PowerLotteryPage 裡面的原件
如果不做這個動作，會造成一些問題
例如: 在這兩個 tab 裡面的 Label component 的背景顏色，一開始都是寫死的
也就是最開始的背景顏色
但現在我們把背景顏色改掉，這樣 Label component 的背景顏色也要跟著改
不然整個 GUI 看起來就會很奇怪
首先，先透過 getTabContentComponent() 來拿到 contentComponent
也就是 BigLotteryPage 或 PowerLotteryPage
然後用 setColour() 去對 TabbedComponent::backgroundColourId 來做設定
解釋一下為什麼要這麼做
使用 setColour() 的原因是，一旦使用這個 function 來設定顏色
則我們可以透過 colourChanged() 這個 function 知道顏色不一樣了，並對此做出反應
而使用 TabbedComponent::backgroundColourId，是必須找一個方式讓 colourChanged()
知道新的顏色是什麼
意思就是，colourChanged() 只是知道顏色不一樣了，但是變成什麼顏色並不知道
因此這時候我們利用 TabbedComponent::backgroundColourId 來傳遞顏色資訊
概念就等同於使用 variable 來傳資訊一樣
而為什麼選 TabbedComponent::backgroundColourId
(1) 概念上符合我們在做的事 => 改變 tab 的背景顏色
(2) 這次的程式裡面，沒有打算在 tab 裡面再增加 tab，因此不會有其他人在看這個 color ID
如果不理會第一點的理由，只要選擇一個不會造成衝突的 color ID 就可以了
5. 上一個步驟有說，我們可以透過 colourChanged() 來知道顏色變了
接下來就是要實做 colourChanged()
到 BigLotteryPage 和 PowerLotteryPage 這兩個 class 新增 colourChanged()
以下用 BigLotteryPage 來做說明
這邊很簡單，先用 findColour() 配合 TabbedComponent::backgroundColourId 拿到新顏色
然後就依序對需要改變的原件做設定
6. 最後的成品
沒有留言:
張貼留言