以下為初學者一步一步的操作，希望對您有所幫助

對Button按鈕的認識

Button有兩個元件，Image元件可以給按鈕新增背景圖片

Button元件可以設定動畫效果，和按鍵時的效果；

NormalColor按鍵正常時的顏色

HighlightedColor 滑鼠放在按鈕上後的顏色

PressedColor 滑鼠按下時的顏色

DisabledColor 禁用後的顏色，沒反應時的顏色

給按鈕新增動畫效果

建立一個Button按鈕，找到Button元件中的Transition，開啟找到Animation

元件下面有一個Auto Genrtate Animation選項，點選儲存。Ctrl+6點選

Scale。找到剛儲存的位置點選Button，將Highlighted和Pressed中的Loop Time取消對勾

血條製作 Button按鈕系列

先建立一個Button按鈕，刪除Text中的文字，在Source Image上新增一個全紅色的圖片

在調整Image Type選擇Filled 調整Fill Method為Horizontal水平

在調整Fill Origin 為Left 掛入指令碼即可，寫入程式可以模擬血量減少過程

publicclassEvent : MonoBehaviour {

publicImage image;

float timer = 0;

// Use this for initialization

void Start () {

}

// Update is called once per frame

void Update () {

timer += Time.deltaTime;

if (timer>2)

{

image.fillAmount -= 0.2f;

timer -= 2;

}

}

}

給按鈕新增案件順序

開啟導航 是按鈕互相之間產生連線箭頭  Visualiza

設定Navigation中的Explicit  根據英文和自己需要適當調整按鈕位置以便按鍵

選擇男女，一次只能勾選一個

建立一個Toggle

Gender，把做好的男女兩個Toggle放入空物體中作為子物體，給空物體新增Toggle

Grounp元件，在子物體中找到Group選項新增空物體，兩個Toggle中有一個勾選

Is On 就行。

頁面滾動

①  建立一個Image圖片拉長但不要超過Ganvas邊界

②  新增Scroll Rect 元件點掉豎直選項；

③  在圖片上建立空物體，拉長左邊與圖片對齊，右邊拉出邊框

④  在空物體中建立圖片，給圖片新增背景並調整位置左邊不要超出

⑤  適當複製圖片把空物體拖拽到掛載Scroll Rect元件的圖片中，放在Content中完成滾動

⑥  消除Image框外的圖片，在Image上掛載Mask元件點掉對勾背景透明

拓展：在圖片下方放一個滾動條

建立一個Scrobar，將建好的Scrobar拖入Image圖片中Scroll Rect元件中的Horizontal Scrollbar   也可把滾動條豎立起來

選擇男女，只選一個

建立一個空物體，給空物體新增Toggle Grounp元件，在空物體中建立兩個Toggle，修改Lable可修改顯示的內容，Background可修改按鍵背景顏色，Checkmark可把對勾修改成其他標識。

注:記住密碼，和此操作大同小異，不做詳細解析；

切換介面操作

①  建立一個空物體，掛載Toggle Group元件

②  在空物體中建立一個Toggle,刪除Backgroud下的checkmark,得到一個空白的按鍵

③  建立三個不同顏色，等大小等位置的圖片，用來模擬三個不同的介面，分別放入三個Toggle中的Backgroud中

④  在Toggle中Graphic掛入剛建立的圖片，Group掛入空物體；

⑤  Is On按鈕三個Toggle有一個勾選即可；