用户工具

站点工具


icore4tlvgl_28
银杏科技有限公司旗下技术文档发布平台
技术支持电话0379-69926675-801
技术支持邮件Gingko@vip.163.com
技术论坛http://www.eeschool.org
版本 日期 作者 修改内容
V1.0 2020-12-30 yang 初次建立

实验二十八:lv_table表格

一、表格

表格通常是由包含文本的行、列和单元格构建的。在LVGL中表格仅存储文本,因此 table 对象占用的空间很少。表格的主要部分称为 LV_TABLE_PART_BG ,它是一个类似于矩形的背景,并使用所有典型的背景样式属性。表格只支持通用事件,并且放置在页面上时可滚动。表格中的单元格不是实际的对象,而是动态绘制的,它有 4 个虚拟部分并且使用所有典型的背景样式属性。

二、表格设置

2.1、行和列

使用函数 lv_table_set_row_cnt(table, row_cnt) 可以设置表格的行数,使用 lv_table_set_col_cnt(table, col_cnt) 可以设置表格的列数。

2.2、宽和高

表格的列宽可以用 lv_table_set_col_width(table, col_id, width) 设置,其中参数 col_id 为列号,第一列的列号为0 。表格对象的总宽度会自动调整为各列宽的总和。

表格的行高是根据单元格样式(字体、填充等)和行数自动计算得出的。

2.3、对齐

单元格中的文本对齐方式可以使用 lv_table_set_cell_align(table, row, col, LV_LABEL_ALIGN_LEFT/CENTER/RIGHT) 进行单独调整,参数 row、col 为单元格的行号和列号,对齐方式有左对齐、居中对齐、右对齐三种。

2.4、单元格样式

函数 lv_table_set_cell_type(table, row, col, type) 用来设置单元格样式,每个单元格都具有样式(1、2、3 或 4),该样式指示要在其上应用哪个部分的样式,例如表头、第一栏、突出显示一个单元格等等:

  • LV_TABLE_PART_CELL1
  • LV_TABLE_PART_CELL2
  • LV_TABLE_PART_CELL3
  • LV_TABLE_PART_CELL4

三、表格操作

3.1、设置单元格值

单元格的值由函数 lv_table_set_cell_value(table, row, col, “Content”) 设置,单元格只能存储文本,因此在将数字显示在表格之前,需要将数字转换为文本。文本由表格保存,因此它也可以是局部变量,而且文本中可以使用换行符来换行,例如 “Value\n60” 。单元格中的文本样式是从单元格或背景继承的。

3.2、合并单元格

单元格可以合并,使用 lv_table_set_cell_merge_right(table, col, row, true) 可以将坐标单元格与其右边相邻的单元格合并。若要合并更多的单元格,需要对每个单元格使用这个函数。

3.3、裁剪文字

默认情况下,文字会自动换行以适合单元格的宽度,并且单元格的高度会自动调整。要禁用自动换行功能并裁剪文本内容可以使用 lv_table_set_cell_crop(table, row, col, true)

LV_FONT_DECLARE(kai_16);                                              /* 声明中文字体 */
void lv_gui_run(void){
	lvgl2rtt_init("lcd");                                         /* 初始化lvgl2rtt */
	lv_obj_t * table = lv_table_create(lv_scr_act(), NULL);       /* 创建表格 */
	lv_obj_set_style_local_text_font(table, LV_LABEL_PART_MAIN, LV_STATE_DEFAULT, &kai_16); /* 设置字体 */
	lv_table_set_col_cnt(table, 2);                               /* 设置列数 */
	lv_table_set_row_cnt(table, 5);                               /* 设置行数 */
	lv_table_set_col_width(table, 0, 200);                        /* 设置第一列宽 */
	lv_table_set_col_width(table, 1, 100);                        /* 设置第二列宽 */
	lv_obj_align(table, NULL, LV_ALIGN_CENTER, 0, 0);             /* 设置位置 */
	lv_table_set_cell_align(table, 0, 0, LV_LABEL_ALIGN_CENTER);  /*设置第一行中心对齐*/
	lv_table_set_cell_align(table, 0, 1, LV_LABEL_ALIGN_CENTER);
	lv_table_set_cell_align(table, 1, 1, LV_LABEL_ALIGN_RIGHT);   /* 设置价格右对齐 */
	lv_table_set_cell_align(table, 2, 1, LV_LABEL_ALIGN_RIGHT);
	lv_table_set_cell_align(table, 3, 1, LV_LABEL_ALIGN_RIGHT);
	lv_table_set_cell_align(table, 4, 1, LV_LABEL_ALIGN_RIGHT);
 
	lv_table_set_cell_value(table, 0, 0, " 名称 ");               /* 设置单元格值 */
	lv_table_set_cell_value(table, 1, 0, " 鱼香肉丝盖浇饭 ");
	lv_table_set_cell_value(table, 2, 0, " 宫保鸡丁盖浇饭 ");
	lv_table_set_cell_value(table, 3, 0, " 牛肉砂锅面 ");
	lv_table_set_cell_value(table, 4, 0, " 羊肉刀削面 ");
	lv_table_set_cell_value(table, 0, 1, " 价格 ");
	lv_table_set_cell_value(table, 1, 1, "\uF15710");
	lv_table_set_cell_value(table, 2, 1, "\uF15710");
	lv_table_set_cell_value(table, 3, 1, "\uF15714");
	lv_table_set_cell_value(table, 4, 1, "\uF15713");
}
icore4tlvgl_28.txt · 最后更改: 2021/01/04 10:19 由 zgf