跳转到内容

cellular-list

蜂窝列表组件,将指定结构的数组渲染成蜂窝状列表。

* 排列方式
* 19___20
* |
* | 7___8___9
* | | \
* 18 | 1___2 10
* / | \ \ \
* 17 6 0 3 11
* \ \ / /
* 16 5___4 12
* \ /
* 15___14___13

不支持

支持通用属性

名称类型默认值
content<array>-蜂窝列表数据内容,详见content-item数据结构
center-index<number>-居中图标位置索引,不填写则居中索引为 0 的图标

content-item 数据结构

名称类型默认值必填描述
name<string>-图标名称
image<string>-图标图片地址,仅支持本地图片

支持通用样式

名称类型默认值必填描述
outer-radius<length>80px图标外半径,用来控制图标与图标之间的距离
inner-radius<length>64px图标内半径,用来控制图标的大小

支持通用事件

名称参数描述
iconclickICON_EVENT当前图标被点击时触发,返回索引位置和名称
wheelfocusICON_EVENT中心图标放大到最大时触发,返回索引位置和名称
参数名类型说明
index<Integer>当前被点击图标索引位置
name<String>当前被点击图标名称