Egret ListView嵌套结构实现

Egret 的 List 嵌套功能,挺适合做复杂 UI 布局的,尤其是那种有主从关系的目录树或者商品分类页面。它用的是ListView,可以在一个列表里再嵌一个列表,结构清晰,交互自然。你只要准备好两级数据源,再用不同的模板渲染就行了,写起来还挺顺的。

ListView 的嵌套结构,其实就是父ListView里放子ListView,一层套一层。比如商城首页,大类是“男装”、“女装”,点开还能看到各自下面的分类列表,这种就合适用这个方式。

数据绑定也不麻烦,主ListView绑定大类,子ListView根据当前项的data生成。用BindingManager自动刷新,还挺方便的,不用手动管视图更新。

模板设计建议你分层来做,每个ListView用自己的itemRenderer,用Sprite或者Bitmap自由组合,想怎么排版都行。

事件上,不少人容易踩坑,比如子ListView点了按钮结果主ListView也响应了。这个可以通过event.stopPropagation()拦截下去,别忘了。

性能优化挺关键,尤其是长列表套列表。你可以用VirtualListView代替普通ListView,只渲染当前可见区域的内容,加载快、不卡顿。

布局上,配合VerticalLayout或者TileLayout这些类也挺好用,嵌套列表在大屏小屏上都能排得挺舒服。

如果你项目里有类似“多级菜单”或“图文混排列表”这种需求,试试 Egret 的 List 嵌套,写起来省事,扩展性也强。

zip 文件大小:1022.64KB