ugui实现listview效果

我们今天要实现listview的效果
ugui实现listview效果_第1张图片
首先看下ui结构
ugui实现listview效果_第2张图片
根节点是画布,Store节点只是为了固定锚点.
抛开背景和标题,核心部分只有ScrollRect,ViewPoint,Slots,Scrollbar
ScrollRect是滑动布局,content是滑动布局中的全部内容,ViewPort是观察范围,Scrollbar是滚动条
我们是垂直布局,所以选用Vertical相关的属性
ugui实现listview效果_第3张图片
ViewPort上面放了一个mask,挡住多余的item
如果是3D效果的UI,选Mask组件,我这个只是2D
ugui实现listview效果_第4张图片
Slots里有一个grid layout group垂直自动布局和fitter大小适配,Slots下挂载了80个方格
ugui实现listview效果_第5张图片

你可能感兴趣的:(unity)