#使用技巧#轮播控件如何一页展示多条数据原创
金蝶云社区-波吉王子
波吉王子
13人赞赏了该文章 918次浏览 未经作者许可,禁止转载编辑于2023年01月30日 17:30:08

知识分类:开发类

关键词:轮播,轮播控件 ,首页卡片

 

一、问题描述/需求描述:

苍穹官方官方知识文档 轮播容器 (kingdee.com) 给出了轮播控件的基础属性及简单的实例:每页显示一个页签+一张图片。
    当需要展示多条数据时,发现修改了设计界面的轮播数量不会正常生效。本文将分享如何正确的给轮播控件上添加多条数据。

 

二、思路与方案:

界面控件设计+二开插件支持

背景:现在需要将一个文档单据列表中的数据,按一页5条的标准展示在轮播控件,其中每条数据包含两条标;同时需要支持点击每条标题后跳转到对应链接。

 

三、实现过程:

1、 界面设计:确定好当前轮播页展示效果
> 每条数据使用一个轮播布局容器,里面放两个标签,第一标签这里用来显示标题前缀内容,后一个标签用来显示标题内容
> 每个页面展示5条数据,这里重复添加五个布局容器
(注:由于轮播容器的高度布局是固定的,动态添加容器无法在代码插件中进行,这里请根据界面实际高度去确定轮播容器展示的具体条数)

image.png

2、 插件开发:
> 构造轮播容器每页每条的数据
获取容器,获取单据数据
image.png

取出每页的数据,构造后,插入到轮播容器中
初始化一个map对象,存放轮播每页的数据:
每页的数据需要保持元数据标识和界面一致,
如界面中标签是从label1到label5,这里就需要给每页的map对象重复赋值
image.png
> 监听轮播容器对应页面子控件点击事件
监听容器内标签的点击事件,根据事件参数中的页数和标签具体字段获取标题的url信息,构造url并打开

image.png

四、效果图:

单据列表

image.png


轮播-第一页

image.png


轮播-第二页

image.png


五、开发环境版本

苍穹版本号

V4.0.020

 

六、参考资料:

轮播容器 (kingdee.com)


赞 13