鸿蒙的分组列表list-item-group样子设置 原创

发布于 2021-1-24 00:37
浏览
1收藏

        鸿蒙的分组列表标签为<list-item-group>  </list-item-group>,以我们常规的习惯,设置样式的时候首先要定义显示区域的宽:width和高:height的大小,但不是每一组数据都有相同数量的数据,如果数据数量差异不是很大的话还能勉强凑合,但是一旦数据数量差异较大,那么显示区域设置的过大或过小都不合适,除非是手动的单个一对一的设置显示方式。

        举例说明,第一组数组有3个对象,第二组数组有4个对象,第三组数组有5个对象,那么我们应该怎么设置才能使它们各自适应自己高度呢?

1、首先请看常规情况下,设置了固定高宽的显示样式:

鸿蒙的分组列表list-item-group样子设置-开源基础软件社区鸿蒙的分组列表list-item-group样子设置-开源基础软件社区        如上图,三组“父子”数据中,利用循环调用的方式,共用一种样式“group1”,但是明显“菜单父项三”因有最多的5个数据,显示已经溢出了。

        那么除了把三组数据分开一对一设置样式以外,利用循环调用并且共用一种显示样式的情况下,能不能使三组数据灵活显示呢?当然有,就是在使用“分组列表list-item-group”设置显示样式时,不要设置高度:hetght的值就行了。如下图:

        鸿蒙的分组列表list-item-group样子设置-开源基础软件社区

下面是各级菜单展开后的效果:

鸿蒙的分组列表list-item-group样子设置-开源基础软件社区

鸿蒙的分组列表list-item-group样子设置-开源基础软件社区鸿蒙的分组列表list-item-group样子设置-开源基础软件社区鸿蒙的分组列表list-item-group样子设置-开源基础软件社区

©著作权归作者所有,如需转载,请注明出处,否则将追究法律责任
2
收藏 1
回复
举报
回复
添加资源
添加资源将有机会获得更多曝光,你也可以直接关联已上传资源 去关联
    相关推荐