LVGL 控件之线条（lv_line）

---

一、概述

线条部件只有一个组成部分：主体 LV_PART_MAIN。

通过一组点绘制出相连的直线，通过 lv_line_create 创建相应的对象。

二、线条

1、设置连接点

线条是由多个点连接而成的对象，用户可以使用 lv_point_t 类型的数组存储这些坐标点，并调用 lv_line_set_points 函数，把这些坐标点传递给线条部件，它将会把这些点连接起来，最终绘制成线条。

例：

static lv_point_t line_points[] = { {5, 5}, {70, 70}, {120, 10},
                                    {180, 60}, {240, 10} };

void my_gui(void)
{
    lv_obj_t *line1 = lv_line_create(lv_scr_act());
    lv_line_set_points(line1, line_points, 5);
    lv_obj_center(line1);
}

上图中，因为线条部件被居中对齐，所以坐标原点在该部件居中后的左上方，如下图所示：

2、自适应大小

默认情况下，线条部件的宽度和高度都是 LV_SIZE_CONTENT，这意味着它将自动设置自身的大小，以适应所有的点。如果用户设置了线条部件的大小，则超出的部分可能不可见。

如果启用，则在设置点后，将根据点之间的最大 x 和 y 坐标更改对象的宽度和高度。该自动调整大小默认情况下启用。lv_line_set_auto_size(line, true)

3、翻转 y 轴

默认情况下，y == 0 点是在 line 对象的顶部最左侧。这在某些情况下可能是不直观的（LCD 坐标系），这时候可以使用 lv_line_set_y_invert(line, true) 函数来反转y坐标 。在这种情况下， y == 0 将是物体的底部最左侧(直角坐标系)。

默认不反转 y 轴。

lv_line_set_y_invert(line1, true);

4、样式

4.1 设置宽度

lv_obj_set_style_line_width(line1, 10, LV_PART_MAIN);

4.2 末端形态

可以看到，当线条边粗后，线条末端显得很僵硬。不过我们可以通过函数 lv_obj_set_style_line_rounded 调整。

线条末端可以是圆的或者直线：

lv_obj_set_style_line_rounded(line1, true, LV_PART_MAIN);

4.3 虚线

虚线只能是水平或者垂直方向。通过 lv_obj_set_style_line_dash_width 和 lv_obj_set_style_line_dash_gap 设置实线和空部分的宽度。

static lv_point_t line_points[] = { {50, 50}, {270, 50}};

void my_gui(void)
{
    lv_obj_t *line1 = lv_line_create(lv_scr_act());
    lv_line_set_points(line1, line_points, 2);
    
    lv_obj_set_style_line_width(line1, 10, LV_PART_MAIN);
    lv_obj_set_style_line_rounded(line1, true, LV_PART_MAIN);

    lv_obj_set_style_line_dash_width(line1, 10, LV_PART_MAIN);
    lv_obj_set_style_line_dash_gap(line1, 20, LV_PART_MAIN);
    
    lv_obj_center(line1);
}

5、API 函数

函数	描述
lv_line_create()	创建线条部件
lv_line_set_points()	设置一个点数组，线条对象将这些点连接起来
lv_line_set_y_invert()	启用或禁用Y 坐标反转
lv_line_get_y_invert()	获取Y 坐标反转属性