文章目錄
- 一、`lv_bar` 是什么?
- 二、基本使用
- 創建一個進度條
- 設置進度值
- 三、條形方向與填充方向
- 四、范圍模式(Range)
- 五、事件處理(可選)
- 六、自定義樣式(可選)
- 七、綜合示例
- 八、配合 `lv_timer` 或外部數據更新進度
lv_bar
是 LVGL 中的進度條控件,常用于顯示任務的完成度、電量、音量、進度等連續值的變化。它的功能和我們常見的“進度條”非常類似,支持設置最小值、最大值、當前值,還可以自定義樣式和動畫。
一、lv_bar
是什么?
- 是
lv_obj
的子類。 - 用于表示一個數值范圍內的當前進度。
- 可橫向、縱向顯示,也支持動畫、樣式自定義。
二、基本使用
創建一個進度條
lv_obj_t *bar = lv_bar_create(lv_scr_act()); // 在當前屏幕創建進度條
lv_obj_set_size(bar, 200, 20); // 設置尺寸
lv_obj_center(bar); // 居中顯示
設置進度值
lv_bar_set_range(bar, 0, 100); // 設置范圍,默認是 0 ~ 100
lv_bar_set_value(bar, 75, LV_ANIM_ON); // 設置當前值為 75,并開啟動畫
LV_ANIM_ON
表示過渡效果,LV_ANIM_OFF
表示立即生效。
三、條形方向與填充方向
雖然 LVGL 默認是從左到右填充,但我們也可以設置從下往上、右到左等方向:
lv_bar_set_mode(bar, LV_BAR_MODE_NORMAL); // 默認左→右
lv_bar_set_mode(bar, LV_BAR_MODE_SYMMETRICAL); // 兩端對稱(適合正負數顯示)
lv_bar_set_mode(bar, LV_BAR_MODE_RANGE); // 設置范圍段(如下節所述)
四、范圍模式(Range)
你可以給 lv_bar
設置一個范圍區段,比如表示電量閾值、安全值范圍等:
lv_bar_set_start_value(bar, 30, LV_ANIM_OFF); // 設置起始值(僅在 RANGE 模式下生效)
lv_bar_set_value(bar, 70, LV_ANIM_OFF); // 設置結束值
lv_bar_set_mode(bar, LV_BAR_MODE_RANGE); // 啟用范圍顯示模式
效果類似于表示「從 30% 到 70%」之間為某個特殊區段。
五、事件處理(可選)
通常不需要處理 lv_bar
的事件,但你可以監聽它的值變化等:
void bar_event_cb(lv_event_t *e) {if (lv_event_get_code(e) == LV_EVENT_VALUE_CHANGED) {int val = lv_bar_get_value(lv_event_get_target(e));printf("新進度值: %d\n", val);}
}lv_obj_add_event_cb(bar, bar_event_cb, LV_EVENT_ALL, NULL);
六、自定義樣式(可選)
lv_bar
有兩個部分:背景(背景槽) 和 指示器(填充部分),可以分別設置樣式:
static lv_style_t style_bg, style_indic;
lv_style_init(&style_bg);
lv_style_set_bg_color(&style_bg, lv_color_hex(0xcccccc));lv_style_init(&style_indic);
lv_style_set_bg_color(&style_indic, lv_color_hex(0x00ff00));lv_obj_add_style(bar, &style_bg, LV_PART_MAIN); // 設置背景部分
lv_obj_add_style(bar, &style_indic, LV_PART_INDICATOR); // 設置填充部分
七、綜合示例
void create_my_bar(void)
{lv_obj_t *bar = lv_bar_create(lv_scr_act());lv_obj_set_size(bar, 200, 20);lv_obj_center(bar);lv_bar_set_range(bar, 0, 100);lv_bar_set_value(bar, 50, LV_ANIM_ON); // 當前進度為50%
}
八、配合 lv_timer
或外部數據更新進度
可用于實時進度更新,如加載條、電池電量:
static lv_obj_t *bar;void update_bar_cb(lv_timer_t *timer)
{static int val = 0;val = (val + 1) % 101;lv_bar_set_value(bar, val, LV_ANIM_ON);
}void create_dynamic_bar(void)
{bar = lv_bar_create(lv_scr_act());lv_obj_set_size(bar, 200, 20);lv_obj_center(bar);lv_bar_set_range(bar, 0, 100);lv_bar_set_value(bar, 0, LV_ANIM_OFF);lv_timer_create(update_bar_cb, 100, NULL); // 每100ms更新一次
}