使用Scroll Bar完成滑動檢視功能。

1️⃣ 建立「Panel」物件(需放置於Canvas底下,創建Panel時會自動新增Canvas)
 「Hierarchy」底下右鍵→「UI」→「Panel」。


2️⃣ 建立GameObject(放置於Panel底下)
 於Panel物件上按右鍵→「Create Empty」。

3️⃣ 設定大小
 設定Panel及GameObject之大小,使用左上方工具列之「Rect tool」。

 Panel:欲顯示之區域,滑動時可視範圍,圖中灰色部分。
 GameObiect:放置內容(圖片/文字)之完整大小,圖中藍點框出之部分。

4️⃣ 建立欲顯示之物件
 將欲顯示之物件(文字或圖片)新增並放置於GameObject底下,並對齊GameObiect之框格大小(只要將物件放置於GameObject範圍中即可)


4️⃣ 新增Scroll Bar
 於Canvas底下新增ScrollBar物件。
 「Hierarchy」底下右鍵→「UI」→「Scrollbar」。

5️⃣ 拉動設定Scrollbar
 將Scrollbar拉動,長度與Panel相同(以上下拉動為例,左右拉動則寬度與Panel相同)。

 於Scrollbar設定「Inspector」中,將Direction設置為「Top To Bottom」也就是設置為上下拉動。
在此Canvas底下物件如下圖。

6️⃣ 設定Canvas
於Canvas設定「Inspector」中,新增Component「Scroll Rect(Script)」及「Mask」。
其中Scroll Rect設置,
Content→GameObject;Vertical Scrollbar
→Scrollbar(若為左右滑動,則Horzontal Scrollbar→Scrollbar)

 設定完成後,啟動程式即可滑動視窗顯示。

文章標籤
創作者介紹
創作者 May 的頭像
May

Walking

May 發表在 痞客邦 留言(0) 人氣()