滾動框架

*此內容是使用 AI(Beta 測試版)翻譯,可能含有錯誤。若要以英文檢視此頁面,請按一下這裡

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

範例滾動框架在螢幕上,包含有標籤的類別欄和一系列可供玩家考慮購買的魔法物品的列表。

畫布

畫布ScrollingFrame 的主要區域,可以包含其他 GuiObjects。滾動行為會在以下情況下自動適應:

框架設置結果
框架的 CanvasSize 高度大於其整體高度;具體來說,CanvasSize.Y 的總和超過 Size.Y 的總和。垂直滾動啟用,並且出現垂直滾動條。
框架的 CanvasSize 寬度大於其整體寬度;具體來說,CanvasSize.X 的總和超過 Size.X 的總和。水平滾動啟用,並且出現水平滾動條。
框架的 AutomaticCanvasSize 設置為 YXY,並且其內容(子 GuiObjects)的總高度超過其 Size.Y 的總和。垂直滾動啟用,並且出現垂直滾動條。
框架的 AutomaticCanvasSize 設置為 XXY,並且其內容(子 GuiObjects)的總寬度超過其 Size.X 的總和。水平滾動啟用,並且出現水平滾動條。

CanvasPosition 屬性反映了畫布在框架內的 當前 位置偏移量(以像素為單位),並根據此設置滾動條的位置。請注意,如果滾動條不可見,則此屬性不會起作用。

邊距

滾動框架的 CanvasSize 可能會受到 VerticalScrollBarInset 和/或 HorizontalScrollBarInset 屬性的影響。在下面的示例圖中,一個垂直滾動框架使用 100% 的畫布寬度。當 VerticalScrollBarInset 設置為 None(預設值)時,畫布擴展到滾動框架的全寬,稍微隱藏了一部分內容在滾動條下方。相反,當 VerticalScrollBarInset 設置為 AlwaysScrollBar 時,畫布的邊距由 ScrollBarThickness 的量設定,這樣畫布就與滾動條的邊緣邊緣對齊。

滾動條

框架的 滾動條 反映當前畫布位置,並提供自動拖動滾動的互動性。對於垂直滾動條,VerticalScrollBarPosition 屬性可將滾動條的位置切換到畫布的左側或右側,但水平滾動條只能位於畫布下方。

滾動條的構造由三個資產屬性組成:

  • TopImage — 顯示在垂直滾動條的頂部,或水平滾動條的左側(對於水平滾動條旋轉 90° 逆時針)。
  • MidImage — 佔據 TopImageBottomImage 之間的區域(對於水平滾動條旋轉 90° 逆時針)。
  • BottomImage — 顯示在垂直滾動條的底部,或水平滾動條的右側(對於水平滾動條旋轉 90° 逆時針)。
顯示三個圖像資產元素的圖表,這些元素構建滾動框架的滾動條。

每個圖像的縮放基於 ScrollBarThickness 屬性,該屬性改變垂直滾動條的寬度或水平滾動條的高度。

還可以通過 ScrollBarImageColor3ScrollBarImageTransparency 屬性進行其他視覺上的修改,這些屬性分別為滾動條的圖像資產上色和修改其不透明度。

彈性

默認情況下,ScrollingFrames 在支持觸控的設備上顯示彈性滾動行為,這意味著用戶可以將畫布拖得比邊界稍遠,並且在放開後,畫布將彈回到其最小或最大限制。如果您想完全移除彈性行為,並確保畫布永遠不會超出其限制,請將 ElasticBehavior 屬性設置為 Never

©2026 Roblox Corporation、Roblox、Roblox 標誌及 Powering Imagination 是我們在美國及其他國家地區的部分註冊與未註冊商標。