.

数据库系列教程—表格输出组件:数据信息展示/排行榜/获奖名单

小常发表于:2021年08月02日 10:37:38更新于:2021年08月11日 16:48:18


一、案例效果

image.png

《中奖信息滚动播放展示》


二、场景应用

表格输出组件帮助我们以表格形式直观展示相关的数据信息,比如游戏排行榜、获奖名单等等,并且可以通过触发数据刷新来随时更新表格数据。


三、学习准备

表格输出主要用来展示数据信息,而数据信息主要来源于后台数据库。如果对数据库基础操作不够熟悉,建议先系统学习下数据库教程。


四、组件用法

1.添加表格输出组件

点击顶部工具栏——高级组件菜单——数据应用——表格输出组件,成功添加组件到画布。

image.png


2.设置组件属性及样式

① 找到右侧元素信息面板,我们可以根据自己实际的展示需求,设置表格的行数、列数、行高和列宽等基础属性,以及表格整体的尺寸大小和坐标位置。

image.png

② 右侧第二栏背景及边框面板,可以帮助我们设置表格的背景颜色及边框样式。

image.png

③ 文本样式面板,可以修改表格输出组件中的显示字体及字体颜色等等。

image.png


3.绑定数据

首先确定作品中已添加数据表,然后选定已添加的表格输出组件,通过右侧属性面板——数据绑定进行数据关联设置,针对每一列不同的输出内容,绑定到数据表里所对应的字段。

勾选☑️【下拉刷新】后,在表格顶部使用下拉手势时,可以刷新获取最新数据;

勾选☑️【加载更多】可以在初始行数数据展示完成后,通过继续向上滑动的手势,加载到其他更多的数据。

image.png


GIF演示绑定数据操作:

001610759412f7d18b34dd9ec03f0c8