LVGL的grid布局

1、创建网格的步骤

（1）例如创建1*3的网格

/* 列 */

static lv_coord_t g_col_dsc[] = {LV_GRID_FR(1), LV_GRID_TEMPLATE_LAST};

/* 行 */

static lv_coord_t g_row_dsc[] = {LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_CONTENT, LV_GRID_TEMPLATE_LAST};

（2）给父的obj设置参数

/* 设置行和列大小的描述 */

void lv_obj_set_grid_dsc_array(lv_obj_t * obj, const lv_coord_t col_dsc[], const lv_coord_t row_dsc[]);

/* 设置每次滚动个数 */

lv_obj_add_flag(bgGround, LV_OBJ_FLAG_SCROLL_ONE);

/* 设置滚动方向 */

lv_obj_set_scroll_dir(bgGround, LV_DIR_VER);

/* 设置滚动结束时，child的位置 */

lv_obj_set_scroll_snap_y(bgGround, LV_SCROLL_SNAP_CENTER);

（3）设置每个子obj在网格中的位置

void lv_obj_set_grid_cell(lv_obj_t * obj, lv_grid_align_t x_align, uint8_t col_pos, uint8_t col_span, lv_grid_align_t y_align, uint8_t row_pos, uint8_t row_span);

/* 以下是在LVGL中实现循环卡片并且跟手的代码，仅供参考 */
#include"./lvgl/lvgl.h"
#include <stdio.h>
/**
 * 使用方法
 1、grid_demo() 为入口函数
 2、可在set_widget_data()添加需要创建数据
 3、可通过修改宏GRID_DATA_MAX来决定一共可以显示多少页（从0开始为第一页）
 4、其他的一些颜色和数据的显示可自行安排
**/
/**
  * 类似卡片流的实现（实现方案有很多种，这里主要将网格布局的来实现）
  1、使用LVGL具有的网格布局来实现多屏数据跟手并且循环滚动
  2、正常情况至少要创建三张卡片来实现这个功能
  3、根据每次滚动结束所移动到的位置来进行删除和更新数据
**/


#define WINDOW_WIDTH  800
#define WINDOW_HEIGHT 480

/* 当数据的大小从0开始 */
#define GRID_DATA_MAX 1 /* 最大值（2） */ 
#define GRID_DATA_MIN 0 /* 最小值 */

#define CARD_COUNT_MAX 3
#define CARD_WIDTH     800
#define CARD_HEIGHT    480


/* 当前数据的index */
static int g_currentIndex = 0;
/* 当前页面的index */
static int g_actPageIndex = 0;
/* 当前y轴的坐标 */
static uint16_t g_preY = WIN