Unity UGUI的ScrollRect（捲動檢視）元件的介紹及使用

1. 什麼是ScrollRect元件？

ScrollRect（捲動檢視）是Unity UGUI中的一個常用元件，用於在UI介面中建立可捲動的區域。通過ScrollRect元件，可以實現在有限的空間內顯示大量的內容，並且可以通過滑動手勢來瀏覽內容。

2. ScrollRect元件的工作原理

ScrollRect元件通過將內容放置在一個可捲動的矩形區域內，然後通過拖動或滑動手勢來改變內容的顯示位置。ScrollRect元件包含一個Viewport（視口）和一個Content（內容）兩個子物件，Viewport用於限制Content的顯示範圍，而Content則包含了實際的內容。

3. ScrollRect元件的常用屬性

Content：用於放置實際的內容的RectTransform物件。
Horizontal：是否允許水平方向的捲動。
Vertical：是否允許垂直方向的捲動。
Movement Type：捲動的型別，可選的型別有：Unrestricted（不受限制）、Elastic（彈性）、Clamped（限制）。
Inertia：是否啟用慣性捲動。
Deceleration Rate：慣性捲動的減速率。
Scroll Sensitivity：捲動的靈敏度。

4. ScrollRect元件的常用函數

ScrollTo：捲動到指定位置。
StopMovement：停止捲動。
OnBeginDrag：開始拖拽時呼叫的函數。
OnDrag：拖拽過程中呼叫的函數。
OnEndDrag：結束拖拽時呼叫的函數。

5. 範例程式碼

範例1：基本的捲動檢視

using UnityEngine;
using UnityEngine.UI;

public class ScrollRectExample : MonoBehaviour
{
    public ScrollRect scrollRect;

    void Start()
    {
        // 設定Content的大小
        RectTransform content = scrollRect.content;
        content.sizeDelta = new Vector2(0, 1000);

        // 設定捲動檢視的捲動範圍
        scrollRect.verticalNormalizedPosition = 1;
    }
}

操作步驟：

建立一個空的GameObject，並新增ScrollRect元件。
在Hierarchy面板中選中ScrollRect物件，將Content物件拖拽到ScrollRect的Content屬性中。
將範例程式碼新增到ScrollRectExample指令碼中，並將ScrollRect物件拖拽到scrollRect屬性中。
執行遊戲，可以看到捲動檢視中的內容可以通過滑動手勢進行卷動。

範例2：限制捲動範圍

using UnityEngine;
using UnityEngine.UI;

public class ScrollRectExample : MonoBehaviour
{
    public ScrollRect scrollRect;

    void Start()
    {
        // 設定Content的大小
        RectTransform content = scrollRect.content;
        content.sizeDelta = new Vector2(0, 1000);

        // 設定捲動檢視的捲動範圍
        scrollRect.verticalNormalizedPosition = 1;
        scrollRect.movementType = ScrollRect.MovementType.Clamped;
    }
}

操作步驟：

建立一個空的GameObject，並新增ScrollRect元件。
在Hierarchy面板中選中ScrollRect物件，將Content物件拖拽到ScrollRect的Content屬性中。
將範例程式碼新增到ScrollRectExample指令碼中，並將ScrollRect物件拖拽到scrollRect屬性中。
執行遊戲，可以看到捲動檢視中的內容在捲動到邊界時會受到限制。

範例3：慣性捲動

using UnityEngine;
using UnityEngine.UI;

public class ScrollRectExample : MonoBehaviour
{
    public ScrollRect scrollRect;

    void Start()
    {
        // 設定Content的大小
        RectTransform content = scrollRect.content;
        content.sizeDelta = new Vector2(0, 1000);

        // 設定捲動檢視的捲動範圍
        scrollRect.verticalNormalizedPosition = 1;
        scrollRect.inertia = true;
        scrollRect.decelerationRate = 0.5f;
    }
}

操作步驟：

建立一個空的GameObject，並新增ScrollRect元件。
在Hierarchy面板中選中ScrollRect物件，將Content物件拖拽到ScrollRect的Content屬性中。
將範例程式碼新增到ScrollRectExample指令碼中，並將ScrollRect物件拖拽到scrollRect屬性中。
執行遊戲，可以看到捲動檢視中的內容在滑動結束後會有慣性捲動的效果。

範例4：捲動到指定位置

using UnityEngine;
using UnityEngine.UI;

public class ScrollRectExample : MonoBehaviour
{
    public ScrollRect scrollRect;

    void Start()
    {
        // 設定Content的大小
        RectTransform content = scrollRect.content;
        content.sizeDelta = new Vector2(0, 1000);

        // 設定捲動檢視的捲動範圍
        scrollRect.verticalNormalizedPosition = 1;

        // 捲動到指定位置
        scrollRect.ScrollTo(new Vector2(0, 500), 0.5f);
    }
}

操作步驟：

建立一個空的GameObject，並新增ScrollRect元件。
在Hierarchy面板中選中ScrollRect物件，將Content物件拖拽到ScrollRect的Content屬性中。
將範例程式碼新增到ScrollRectExample指令碼中，並將ScrollRect物件拖拽到scrollRect屬性中。
執行遊戲，可以看到捲動檢視會自動捲動到指定位置。

範例5：停止捲動

using UnityEngine;
using UnityEngine.UI;

public class ScrollRectExample : MonoBehaviour
{
    public ScrollRect scrollRect;

    void Start()
    {
        // 設定Content的大小
        RectTransform content = scrollRect.content;
        content.sizeDelta = new Vector2(0, 1000);

        // 設定捲動檢視的捲動範圍
        scrollRect.verticalNormalizedPosition = 1;

        // 停止捲動
        scrollRect.StopMovement();
    }
}

操作步驟：

建立一個空的GameObject，並新增ScrollRect元件。
在Hierarchy面板中選中ScrollRect物件，將Content物件拖拽到ScrollRect的Content屬性中。
將範例程式碼新增到ScrollRectExample指令碼中，並將ScrollRect物件拖拽到scrollRect屬性中。
執行遊戲，可以看到捲動檢視會停止捲動。

6. 注意事項

ScrollRect元件需要配合其他UI元件（如Mask）一起使用，以限制內容的顯示範圍。
在使用ScrollRect元件時，需要注意Content的大小和捲動範圍的設定，以確保內容能夠正確地顯示和捲動。

7. 參考資料

Unity官方檔案 - ScrollRect