滚动容器
🤖 回答引擎: 前端Lua |
🕒 时间: 2026-07-16 17:08:56 |
👁️ 阅读: 12
滚动容器是996引擎中用于处理可滚动内容的UI组件，主要使用`ScrollView`来实现。
## 主要功能函数
### 创建滚动容器
```lua
local scrollView = GUI:ScrollView_Create(parent, "ScrollView_1", 100, 100, 300, 400, 1)
```
参数说明：
- `parent`: 父节点对象
- `"ScrollView_1"`: 唯一ID
- `100, 100`: 位置坐标
- `300, 400`: 宽度和高度
- `1`: 滚动方向（1=垂直，2=水平）
### 设置滚动方向
```lua
GUI:ScrollView_setDirection(scrollView, 1) -- 垂直滚动
GUI:ScrollView_setDirection(scrollView, 2) -- 水平滚动
```
### 设置背景
```lua
-- 设置背景颜色
GUI:ScrollView_setBackGroundColor(scrollView, "#FF0000")
-- 设置渐变背景色
GUI:ScrollView_setBackGroundColor(scrollView, {"#FF0000", "#FFFFFF"})
GUI:ScrollView_setBackGroundColorType(scrollView, 2) -- 2表示渐变色
-- 设置背景图片
GUI:ScrollView_setBackGroundImage(scrollView, "res/public/1900000610.png")
-- 移除背景图片
GUI:ScrollView_removeBackGroundImage(scrollView)
```
### 添加内容
```lua
-- 创建子节点
local childWidget = GUI:Widget_Create(scrollView, "child_widget", 50, 50, 200, 100)
-- 添加到滚动容器
GUI:ScrollView_addChild(scrollView, childWidget)
-- 删除所有子节点
GUI:ScrollView_removeAllChildren(scrollView)
```
### 滚动控制
```lua
-- 滚动到顶部（带衰减效果）
GUI:ScrollView_scrollToTop(scrollView, 0.5, true)
-- 滚动到底部
GUI:ScrollView_scrollToBottom(scrollView, 0.5, true)
-- 滚动到指定百分比位置（垂直）
GUI:ScrollView_scrollToPercentVertical(scrollView, 50, 0.5, true) -- 滚动到50%位置
-- 滚动到指定百分比位置（水平）
GUI:ScrollView_scrollToPercentHorizontal(scrollView, 30, 0.5, true) -- 滚动到30%位置
```
### 事件监听
```lua
GUI:ScrollView_addOnScrollEvent(scrollView, function()
SL:print("滚动容器正在滚动")
end)
```
### 其他设置
```lua
-- 设置是否裁切内容
GUI:ScrollView_setClippingEnabled(scrollView, true)
-- 设置是否有回弹效果
GUI:ScrollView_setBounceEnabled(scrollView, true)
-- 设置内部容器大小
GUI:ScrollView_setInnerContainerSize(scrollView, 500, 800) -- 设置内容区域大小
```
## 使用示例
```lua
-- 创建父窗口
local parent = GUI:Win_Create("MainWindow", 0, 0, 0, 0, false, false, true, false, false, false, 1)
-- 创建垂直滚动容器
local scrollView = GUI:ScrollView_Create(parent, "MyScrollView", 50, 50, 300, 400, 1)
-- 设置背景
GUI:ScrollView_setBackGroundColor(scrollView, "#333333")
-- 添加多个内容项
for i = 1, 10 do
local item = GUI:Widget_Create(scrollView, "item_"..i, 10, (i-1)*80, 280, 70)
GUI:setOpacity(item, 200)
end
-- 设置内容区域大小
GUI:ScrollView_setInnerContainerSize(scrollView, 300, 800)
```
这个滚动容器可以用来创建任务列表、聊天记录、背包物品等需要滚动显示的内容。
← 返回问答库