一個 ScrollingFrame 由可自訂的 畫布 和 滾動條 組成,具有內建的滾動互動性,以及不同的自訂滾動方式。ScrollingFrame 非常適合在有限空間中顯示大量資訊,並且與 列表 和 網格 格局搭配良好。

畫布
畫布 是 ScrollingFrame 的主要區域,可以包含其他 GuiObjects。滾動行為會在以下情況下自動適應:
| 框架設置 | 結果 |
|---|---|
| 框架的 CanvasSize 高度大於其整體高度;具體來說,CanvasSize.Y 的總和超過 Size.Y 的總和。 | 垂直滾動啟用,並且出現垂直滾動條。 |
| 框架的 CanvasSize 寬度大於其整體寬度;具體來說,CanvasSize.X 的總和超過 Size.X 的總和。 | 水平滾動啟用,並且出現水平滾動條。 |
| 框架的 AutomaticCanvasSize 設置為 Y 或 XY,並且其內容(子 GuiObjects)的總高度超過其 Size.Y 的總和。 | 垂直滾動啟用,並且出現垂直滾動條。 |
| 框架的 AutomaticCanvasSize 設置為 X 或 XY,並且其內容(子 GuiObjects)的總寬度超過其 Size.X 的總和。 | 水平滾動啟用,並且出現水平滾動條。 |
CanvasPosition 屬性反映了畫布在框架內的 當前 位置偏移量(以像素為單位),並根據此設置滾動條的位置。請注意,如果滾動條不可見,則此屬性不會起作用。
邊距
滾動框架的 CanvasSize 可能會受到 VerticalScrollBarInset 和/或 HorizontalScrollBarInset 屬性的影響。在下面的示例圖中,一個垂直滾動框架使用 100% 的畫布寬度。當 VerticalScrollBarInset 設置為 None(預設值)時,畫布擴展到滾動框架的全寬,稍微隱藏了一部分內容在滾動條下方。相反,當 VerticalScrollBarInset 設置為 Always 或 ScrollBar 時,畫布的邊距由 ScrollBarThickness 的量設定,這樣畫布就與滾動條的邊緣邊緣對齊。

滾動條
框架的 滾動條 反映當前畫布位置,並提供自動拖動滾動的互動性。對於垂直滾動條,VerticalScrollBarPosition 屬性可將滾動條的位置切換到畫布的左側或右側,但水平滾動條只能位於畫布下方。
滾動條的構造由三個資產屬性組成:
- TopImage — 顯示在垂直滾動條的頂部,或水平滾動條的左側(對於水平滾動條旋轉 90° 逆時針)。
- BottomImage — 顯示在垂直滾動條的底部,或水平滾動條的右側(對於水平滾動條旋轉 90° 逆時針)。

每個圖像的縮放基於 ScrollBarThickness 屬性,該屬性改變垂直滾動條的寬度或水平滾動條的高度。
還可以通過 ScrollBarImageColor3 和 ScrollBarImageTransparency 屬性進行其他視覺上的修改,這些屬性分別為滾動條的圖像資產上色和修改其不透明度。
彈性
默認情況下,ScrollingFrames 在支持觸控的設備上顯示彈性滾動行為,這意味著用戶可以將畫布拖得比邊界稍遠,並且在放開後,畫布將彈回到其最小或最大限制。如果您想完全移除彈性行為,並確保畫布永遠不會超出其限制,請將 ElasticBehavior 屬性設置為 Never。