2015年9月2日 星期三

【Unity】UI Scrollbar & Scroll Rect

這次要講的是Unity內UI元件 - Scrollbar和Scroll Rect,用來製作有捲動效果的選單,關於Scrollbar前些日子有寫過一篇,但並不需要那麼麻煩,使用Scroll Rect就可以達到同樣的效果。
(Unity - 捲動選單 scroll list)

這次的結果。

首先我們需要新增GameObject->UI ->Panel或Image,作為顯示的區塊Rect,然後在Rect下新增內容,這裡使用GameObject->UI ->Text。
Scrollbar & Scroll Rect

接著回到Rect上,新增Component - Scroll Rect。
Scrollbar & Scroll Rect

新增完後Scroll Rect裡會有Content的項目,將Text加入,這時候執行就可以使用滑鼠拖曳或滾輪捲動Text。
Scrollbar & Scroll Rect

Scrollbar & Scroll Rect

在Rect上新增Mask,顯示的範圍就會只局限於Rect的區塊大小。
Scrollbar & Scroll Rect

接著我們回到Scroll Rect上的參數。
Scrollbar & Scroll Rect

Horizontal:決定水平軸是否要捲動。
Vertical;決定垂直軸是否要捲動。
Movement Type有以下三種:
Unrestricted:無範圍限制的移動。
Elastic:當移動狀態結束時會自動回到中心點,底下有Elasticity參數可以調整回到中心的速度
Clamped:移動範圍會限制在Content的大小。
Inertia:可決定是否要有慣性,如果有的話Deceleration Rate可以調整減速的值。
Scroll Sensitivity:捲動的靈敏度,主要在滑鼠滾輪有比較明顯的效果。
Horizontal Scrollbar:控制水平軸的Scrollbar。
Vertical Scrollbar控制垂直軸的Scrollbar。

最後在Rect底下新增UI->Scrollbar,加到Vertical Scrollbar上。
Scrollbar & Scroll Rect

Scrollbar的Direction為Bottom To Top,長度調整到與Rect相同,至於bar的長度在執行後會自動調整。
以下是執行結果,可以使用滑鼠拖曳、滑鼠滾輪或bar捲動。
Scrollbar & Scroll Rect

這次就到這裡。

沒有留言:

張貼留言

【自製小遊戲】水平思考猜謎(海龜湯)

遊戲連結 海龜湯的玩法是由出題者提出一個難以理解的事件,參與猜題者可以提出任何問題以試圖縮小範圍並找出事件背後真正的原因。但出題者僅能以「是」、「不是」或「沒有關係」來回答問題。 本遊戲蒐集各種論壇、平台的42個題目,提供給想玩海龜湯卻愁找不到題目的你們。 ...