基本使用

image.png

  1.     // 创建容器container
  2.     lv_obj_t* container = lv_cont_create(lv_scr_act(), NULL);
  3.     // 设置布局
  4.     lv_cont_set_layout(container, LV_LAYOUT_COLUMN_LEFT);
  5.     // 设置大小适应
  6.     lv_cont_set_fit(container, LV_FIT_PARENT);
  8.     // 水平、垂直方向
  9.     //lv_cont_set_fit2(container, LV_FIT_PARENT, LV_FIT_PARENT);
  10.     // 上下左右方向
  11.     //lv_cont_set_fit4(container, LV_FIT_PARENT, LV_FIT_PARENT, LV_FIT_PARENT, LV_FIT_PARENT);
  13.     // 设置背景样式
  14.     static lv_style_t style;
  15.     lv_style_init(&style);
  16.     lv_style_set_radius(&style, LV_STATE_DEFAULT, 0);
  17.     lv_style_set_border_color(&style, LV_STATE_DEFAULT, LV_COLOR_RED);
  18.     lv_style_set_border_width(&style, LV_STATE_DEFAULT, 2);
  20.     // 设置内边距
  21.     lv_style_set_pad_all(&style, LV_STATE_DEFAULT, 0);
  22.     lv_style_set_pad_top(&style, LV_STATE_DEFAULT, 30);
  23.     lv_style_set_pad_left(&style, LV_STATE_DEFAULT, 10);
  24.     lv_style_set_pad_right(&style, LV_STATE_DEFAULT, 0);
  25.     lv_style_set_pad_bottom(&style, LV_STATE_DEFAULT, 0);
  27.     // 设置子控件之间的距离
  28.     lv_style_set_pad_inner(&style, LV_STATE_DEFAULT, 0);
  30.     // 设置外边距 此处无效
  31.     lv_style_set_margin_all(&style, LV_STATE_DEFAULT, 0);
  32.     lv_style_set_margin_top(&style, LV_STATE_DEFAULT, 10);
  33.     lv_style_set_margin_left(&style, LV_STATE_DEFAULT, 30);
  34.     lv_obj_add_style(container, LV_OBJ_PART_MAIN, &style);
  36.     // 添加子控件btn1
  37.     lv_obj_t* btn1 = lv_btn_create(container, NULL);
  38.     lv_obj_t* label1 = lv_label_create(btn1, NULL);
  39.     lv_label_set_text(label1, "button1");
  40.     static lv_style_t style1;
  41.     lv_style_init(&style1);
  42.     lv_style_set_radius(&style1, LV_STATE_DEFAULT, 0);
  43.     lv_style_set_border_color(&style1, LV_STATE_DEFAULT, LV_COLOR_BLUE);
  44.     lv_obj_add_style(btn1, LV_OBJ_PART_MAIN, &style1);
  46.     // 添加子控件btn2
  47.     lv_obj_t* btn2 = lv_btn_create(container, NULL);
  48.     lv_obj_t* label2 = lv_label_create(btn2, NULL);
  49.     lv_label_set_text(label2, "button2");
  50.     static lv_style_t style2;
  51.     lv_style_init(&style2);
  52.     lv_style_set_radius(&style2, LV_STATE_DEFAULT, 0);
  53.     lv_style_set_border_color(&style2, LV_STATE_DEFAULT, LV_COLOR_BLUE);
  54.     lv_obj_add_style(btn2, LV_OBJ_PART_MAIN, &style2);

常用方法

lv_cont_set_layout

  • 设置布局：lv_cont_set_layout(container, LV_LAYOUT_COLUMN_LEFT);
  • LV_LAYOUT_OFF
    • 子对象必须通过lv_obj_set_pos方法设置位置
  • LV_LAYOUT_COLUMN_LEFT
    • 子对象从左边 自上到下排列

  • LV_LAYOUT_PRETTY_TOP

    • 子对象从左到右，从上到下排列，并且每一行均匀分布

      enum {
LV_LAYOUT_OFF = 0, /**< No layout */
LV_LAYOUT_CENTER, /**< Center objects */

LV_LAYOUT_COLUMN_LEFT,      /**< Column left align*/
LV_LAYOUT_COLUMN_MID,       /**< Column middle align*/
LV_LAYOUT_COLUMN_RIGHT,     /**< Column right align*/

LV_LAYOUT_ROW_TOP,          /**< Row top align*/
LV_LAYOUT_ROW_MID,          /**< Row middle align*/
LV_LAYOUT_ROW_BOTTOM,       /**< Row bottom align*/

LV_LAYOUT_PRETTY_TOP,       /**< Row top align*/
LV_LAYOUT_PRETTY_MID,       /**< Row middle align*/
LV_LAYOUT_PRETTY_BOTTOM,    /**< Row bottom align*/

LV_LAYOUT_GRID,   /**< Align same-sized object into a grid*/

_LV_LAYOUT_LAST
};
typedef uint8_t lv_layout_t;

      lv_cont_set_fit

  • 设置大小适应：lv_cont_set_fit(container, LV_FIT_PARENT);

  • LV_FIT_PARENT
    • 填充父容器
  • LV_FIT_TIGHT
    • 包裹子控件大小
      enum {
LV_FIT_NONE,  /**< Do not change the size automatically*/
LV_FIT_TIGHT, /**< Shrink wrap around the children */
LV_FIT_PARENT, /**< Align the size to the parent's edge*/
LV_FIT_MAX,  /**< Align the size to the parent's edge first but if there is an object out of it
                then get larger */
_LV_FIT_LAST
};
typedef uint8_t lv_fit_t;