unity第n+1堂課
UI 講師:水母
目錄
Scene
場景
這是什麼
在開啟一個新專案時,Unity Editor會自動生成一個「Sample Scene」
可以直接在裡面做開發
但當我們要做一些完全不同的畫面or切換關卡時
新增一個不同的Scene是個好選擇

新增場景

在scenes資料夾裡面點右鍵選「Create」選「Scene」
就能建立一個新的場景
場景切換
當有多個Scene,在遊戲中需要進行切換時可以使用SceneManager.LoadScene來進行scene的更換
要使用SceneManager的話,最上方要先引入UnityEngine.SceneManagement名稱空間
- 先將場景新增到Build Settings
- 選取場景拖移到Scenes in build內
- 有顯示在裡面就代表有新增成功了



場景切換
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;
public class SceneLoader : MonoBehaviour
{
private void LoadnextScene()
{
SceneManager.LoadScene("Level1");
}
}
第一種方法是用名稱讀取
但如果改了場景名稱這裡也需要修改
場景切換
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;
public class SceneLoader : MonoBehaviour
{
private void LoadnextScene()
{
SceneManager.LoadScene(1);
}
}
剛剛加入Build settings的時候可能會注意到旁邊有一排從0開始的數字
那個就是場景的index
我們也可以用這個index來讀取到場景

場景切換
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;
public class SceneLoader : MonoBehaviour
{
private void LoadnextScene()
{
SceneManager.LoadScene(SceneManager.GetActiveScene().buildIndex +1);
}
}
當需要切換的場景是依序的時候(ex:3 4 5)
可以用另一種方式依序往下讀取
每次都讀取當前index+1的場景
Canvas
畫布
這是什麼
Canvas是所有UI物件的基礎
所有UI物件都要被放在Canvas裡,作為他的子物件才能運行

建立:在Hierarchy裡按右鍵 --> UI --> Canvas
CanvaS

創建的同時Editor會自動建立一個EventSystem
那跟後面的互動部分有關

點到Canvas可以發現他比我們原本的編輯區大很多
CanvaS

首先要先改Canvas大小的設定
看到右邊Inspector裡的Canvas Scaler組件
裡面有一個UI Scale Mode
以像素為單位訂定的固定大小
除非調整Canvas組件設定否則無法變動
符合螢幕大小,可指定螢幕的大小數值
(通常用這個)
沒用過,但不建議固定
改成Scale with Screen Size
CanvaS

把Reference Resolution改成1920*1080(Full HD)
Game Panel的顯示比例也要改16:9,才不會跑掉

Image
圖片
Image

對Canvas按右鍵選UI -> Image新增一個Image物件
Image組件有點類似一般的Sprite Renderer,可以理解為UI裡的Sprite Renderer
上面的Rect Transform也可以理解成一般Transform的進階版


Image


點一下錨點圖可以用GUI改
位置
長寬
錨點(不用改,可以影響座標基準點)
中心點(預設在中心
旋轉
大小
圖片,可以理解成一般的Sprite Renderer放圖像資源的地方
沒有圖片時的純色填充
材質
可否被Mask蓋住
TextMeshPro
文字
TextMeshPro
這是Unity新版的文字
舊版的可以改的東西比較少,同時也可能比較快被移除或成為過時組件
所以本節課以新版為例

在Canvas上點右鍵 --> UI --> Text - TextMeshPro
TextMeshPro

會彈出這個視窗
把兩個都import
TextMeshPro
我們看到右邊Inspector下方的TextMeshPro - Text (UI)組件
文字,預設New Text
各種預設好的文字樣式,可以自己試試
字型,等等教你們怎麼新增
文字樣式,由左到右:粗體、斜體、下劃線、刪除線、小寫、大寫
材質
是否根據目前文字框長寬調整文字大小至完全符合換行
文字大小

TextMeshPro
接續上一頁
可以調整字元之間、單字之間、行之間跟段落之間的間隔大小
對齊選項
當超出大小後的顯示模式,預設顯示,也可以調遮住等等
啟用/停用自動換行

文字顏色
自訂字體
首先下載你想使用的字體
並且把字體檔(.ttf)放進Assets/TextMesh Pro/Fonts裡面
接著對字體檔點右鍵,選Create --> TextMeshPro --> Font Asset


自訂字體
再來就可以點到剛剛的TextMeshPro物件
把Font Asset拖進TextMeshPro - Text(UI)組件裡的Font Asset欄位
字體就定義好了 耶



Button
按鈕
Button

在Canvas上點右鍵之後 UI --> Button - TextMeshPro
創建一個帶有TextMeshPro文字物件的按鈕
Button

物件旁邊有個箭頭可以下拉
有TextMeshPro物件可以調整按鈕上的文字
右邊的Image組件
上面的Source Image可以改變按鈕的背景圖

Button

按鈕互動時會變換顏色的圖(預設是按鈕背景)
按鈕互動時會變換顏色的圖(預設是按鈕背景)
一般狀況下的顏色
滑鼠移動到上面的顏色
按下瞬間的顏色
按下後還沒點擊其他地方的顏色
禁用(不可點擊)時的顏色
漸變時常
Button
我們可以把前面學的場景切換結合button
先創一個腳本叫SceneLoader
把旁邊的程式貼上去
把腳本拖到canvas上
using System.Collections;
using System.Collections.Generic;
using UnityEngine;
using UnityEngine.SceneManagement;
public class SceneLoader : MonoBehaviour
{
public void LoadnextScene()
{
SceneManager.LoadScene(1);
//index改自己要切換的
}
}

Button
接下來進到Button組件裡面
找到On Click()列表
按「+」加入一個事件

附帶有按鈕按下後要執行的函式的遊戲物件
所以我們要把剛剛放有腳本的canvas拖進去
Button

這裡是按下按鈕要執行的事
總之就是
如果是要修改值的,填入的都是修改後的值(要把A改成B則欄位中填B)
沒有要修改值的就是直接選擇函式就可以執行了
有幾種常用的類別
ex:讓Canvas按下後消失:Canvas --> bool enabled
讓GameObject被停用:GameObject --> SetActive (bool)
改一個GameObject的名稱:GameObject --> string name
Button

直接選SceneLoader(或你自己的腳本名稱) --> LoadnextScene()(或你自己的函式名稱)
來執行
unity-ui
By jellyfish
unity-ui
- 96