[網頁遊戲開發]容器的使用及自定義Tab，RadioGroup，List，ViewStack

Morn裏面，容器和其餘普通組件不一樣，無需皮膚，因此也不能從組件樹種拖動建立(Tab，RadioGroup例外)，只能轉換而來

Morn的容器組件主要有Box，Container，Panel，Tab，RadioGroup，List，ViewStack，他們的區別請查看教程《進一步瞭解Morn UI及工做流》

添加容器的操做步驟

1.選擇要被包含在容器中的對象，好比我選擇了一個label和button

2.用快捷鍵Ctrl+B轉換爲容器

 

這樣就把label和button包含到了容器內

 

Box，Container，Panel等容器都是上面的操做方法

進入容器進行編輯

上面已經把label和button包含在容器裏了，操做容器，就能同時操做label和button，好比設置位置，alpha屬性等

若是想編輯容器內的label怎麼操做呢？

只需雙擊這個容器對象，就能夠進入容器內部了，而後就能夠隨意對內部組件進行操做修改，雙擊容器外區域，就又返回容器視圖

 

Box，Container，Panel容器操做都比較簡單，下面說一下Tab，RadioGroup，List，ViewStack自定義方式

Tab，RadioGroup普通建立方式

1.把一個按鈕命名爲tab_xxx

2.拖動到編輯器視圖便可建立一個普通Tab

3.經過設置labels屬性來改變標籤的內容，設置direction屬性能夠控制Tab是水平仍是垂直佈局

 

這樣就完成了一個Tab的建立

RadioGroup操做方式和Tab類同，只需把一個RadioButton命名爲radiogroup_xxx，拖動到視圖而且設置屬性便可

自定義Tab，RadioGroup，List，ViewStack的顯示

若是遇到個性化需求，好比每一個按鈕顏色不一樣，被放置的位置隨意而且沒有規律，上述方法明顯不能控制每一個按鈕並讓他們個性化

而自定義的方式實現的Tab，RadioGroup就能輕鬆實現個性化需求。

自定義方式和Box操做相似，下面咱們自定義一個RadioGroup

1.在編輯器視圖中拖動兩個RadioButton，這時對這些按鈕作一下個性化修改，好比我讓一個RadioButton的Label顏色設置爲紅色，另一個字體改成粗體

 

2.分別把他們的name屬性命名爲item0,item1等等(若是更多就是item2，item3)

 

3.而後同時選擇這兩RadioButton，Ctrl+B換行爲RadioGroup容器

這樣就完成了一個自定義RadioGroup組件，很是簡單而且很靈活吧，Tab，List，ViewStack等容器自定義和上面類同

關於List和ViewStack的使用，會在後面單獨進行更爲詳細的講解，敬請期待