根据浮生梦老师的前端课程内容，我来帮你优化这个背包列表容器函数。主要问题是布局计算没有根据容器方向进行调整，还有item_show的创建位置需要修正。
```lua
-- 创建背包列表容器函数
---@param parent: 父节点
---@param bagData: 背包数据（从服务端获取）
---@param itemsPerRow: 每行显示几个item_show
---@param totalItems: 总共需要显示多少个item_show
---@param containerDirection: 容器方向 1:垂直 2:水平
---@param padding: 间距
---@param ListView_x: 列表容器x坐标
---@param ListView_y: 列表容器y坐标
---@param itemWidth: item宽度
---@param itemHeight: item高度
---@return table: 返回所有item_layout控件的引用表
function item_show(parent, bagData, itemsPerRow, totalItems, containerDirection, padding, ListView_x, ListView_y,
itemWidth, itemHeight)
if GUI:Win_IsNull(parent) then
SL:print("错误：父节点为空")
return
end
if bagData == nil then
SL:print("错误：背包数据为空")
return
end
totalItems = totalItems or 20
totalItems = #bagData > totalItems and #bagData or totalItems
itemsPerRow = itemsPerRow or 2
containerDirection = containerDirection or 1
padding = padding or 1
itemWidth = itemWidth or 60
itemHeight = itemHeight or 60
local tick_imagePath = "res/public/1900000678_4.png" -- 勾选图片路径
local item_imgbg = "res/custom/LongMaiJueXing/60x60.png"
local startX = 20
local startY = 0
ListView_x = ListView_x or 0
ListView_y = ListView_y or 0
local size = GUI:getContentSize(parent)
-- 创建列表容器
local listView = GUI:ListView_Create(parent, "ListView_Container", ListView_x, ListView_y,
size.width, size.height, containerDirection)
-- 存储所有item_layout的引用
local itemLayouts = {}
local function createItem_show(layout, col, x, y)
-- 创建item背景框
local itemBg = GUI:Image_Create(layout, "item_bg" .. col, x, y, item_imgbg)
return itemBg
end
-- 根据容器方向调整布局计算
if containerDirection == 1 then -- 垂直滚动
for row = 1, math.ceil(totalItems / itemsPerRow) do
local layout = GUI:Layout_Create(listView, "item_layout" .. row, 0, 0, 60, 60)
for col = 1, itemsPerRow do
local index = (row - 1) * itemsPerRow + col
if index > totalItems then break end
local x = startX + (col - 1) * (itemWidth + padding)
local y = startY
local itemBg = createItem_show(layout, col, x, y)
GUI:setPosition(itemBg, x, y)
end
-- 将layout添加到列表容器
GUI:ListView_pushBackCustomItem(listView, layout)
end
elseif containerDirection == 2 then -- 水平滚动
for col = 1, math.ceil(totalItems / itemsPerRow) do
local layout = GUI:Layout_Create(listView, "item_layout" .. col, 0, 0, 60, 60)
for row = 1, itemsPerRow do
local index = (col - 1) * itemsPerRow + row
if index > totalItems then break end
local x = startX
local y = startY + (row - 1) * (itemHeight + padding)
local itemBg = createItem_show(layout, row, x, y)
GUI:setPosition(itemBg, x, y)
end
-- 将layout添加到列表容器
GUI:ListView_pushBackCustomItem(listView, layout)
end
end
-- 创建item_show并添加点击事件
local index = 1
for row = 1, math.ceil(totalItems / itemsPerRow) do
local layout = GUI:getChildByName(listView, "item_layout" .. row)
if layout then
local children = GUI:getChildren(layout)
for k, v in ipairs(children) do
if bagData[index] == nil then break end
local itemData = {
index = bagData[index].Index,
look = true,
bgVisible = false,
count = bagData[index].OverLap,
color = 255
}
-- 在背景图上创建item_show
local item = GUI:ItemShow_Create(v, "ItemShow_" .. index, 0, 0, itemData)
if item then
-- 创建可点击的layout层
local item_layout = GUI:Layout_Create(item, "item_clink" .. index, 0, 0, itemWidth, itemHeight)
GUI:Layout_setBackGroundImage(item_layout, tick_imagePath)
GUI:setTouchEnabled(item_layout, true)
GUI:setSwallowTouches(item_layout, false)
-- 存储引用
itemLayouts[index] = item_layout
GUI:addOnClickEvent(item_layout, function()
SL:Print("单击触发---" .. index)
end)
end
index = index + 1
end
end
end
-- 返回listView和itemLayouts表
return listView, itemLayouts
end
```
主要改进点：
1. **方向判断**：增加了`containerDirection`的判断，分别处理垂直和水平布局
2. **正确添加子节点**：使用`GUI:ListView_pushBackCustomItem()`将layout添加到列表容器
3. **item_show位置修正**：创建item_show时坐标设为(0,0)，让它居中显示在背景图上
4. **边界处理**：添加了index边界判断，防止超出总数
5. **获取子节点**：使用`GUI:getChildByName()`获取已创建的layout
注意：`GUI:ItemShow_Create()`的第三个参数是x坐标偏移，第四个参数是y坐标偏移，设为(0,0)让item显示在背景图中央。