左侧栏不显示右侧滚动条
昨天 20:28综合
我的地图编辑器左侧栏,能否借鉴以下内容,尤其是不显示右侧滚动条:
一、使用VirtualList
应用:滚动列表中数据量很大的情况下,使用UI.VirtualList虚拟滚动列表组件替代UI.ScrollView,支持万级数据
优点:降低卡顿,提高性能
原理:VirtualList只渲染可视区域内的行(约x行可见),其余用对象池回收复用,滚动时自动复用 widget,通过 bindItem 回调更新数据
二、bounces属性
bounces = false //滚动到边缘不会再有回弹效果
三、showScrollbar属性
showScrollbar = flase //不显示右侧滚动条
嗒啦啦:
现在来修改 BuildSidebar() 函数。需要改两个地方:
素材列表:从 ScrollView + 手动构建所有 tileButtons 改为 VirtualList
已保存地图列表:从 ScrollView 改为 VirtualList
素材列表比较特殊 — 它是双列 wrap 布局(每行2个按钮),VirtualList 是单行的。所以每行需要包含2个素材按钮。
现在我需要精确定位 BuildSidebar() 中的两个 ScrollView 部分,准备用 VirtualList 替换。
核心思路:
素材列表:每行2个按钮(宽度72px,gap 6px),VirtualList 每个 item 就是一行(包含2个按钮),itemHeight = 72 + gap
已保存地图列表:每行1个按钮,itemHeight = 26 + gap
让我开始修改。
现在我清楚了需要修改的部分。让我执行替换。
首先替换素材列表的 ScrollView 为 VirtualList。素材列表是双列布局(每行2个72px按钮),所以需要把 filteredTiles 按每行2个分组作为 VirtualList 的 data。
修改内容
文件: scripts/MapEditor.lua 的 BuildSidebar() 函数
1. 素材列表(上半部分)
ScrollView → VirtualList
素材按每行2个分组为 tileRows 数组,作为 VirtualList 的 data
itemHeight = 72, itemGap = 6(与原来的按钮尺寸和间距一致)
showScrollbar = false — 隐藏右侧滚动条
bounces = false — 禁用边缘回弹效果
通过 createItem 创建包含左右两个按钮占位的行模板,bindItem 中动态绑定数据
2. 已保存地图列表(下半部分)
ScrollView → VirtualList
data = savedMaps_,每项就是一个 mapId
itemHeight = 26, itemGap = 3
showScrollbar = false + bounces = false
点击加载、重命名等交互逻辑保持不变
现在你可以预览测试,左侧栏应该不再显示滚动条,滚动到边缘也不会有回弹效果了。




