Bar (lv_bar)¶

Overview¶

The bar object has a background and an indicator on it. The width of the indicator is set according to the current value of the bar.

Vertical bars can be created if the width of the object is smaller than its height.

Not only the end, but also the start value of the bar can be set, which changes the start position of the indicator.

Parts and Styles¶

LV_PART_MAIN The background of the bar and it uses the typical background style properties. Adding padding makes the indicator smaller or larger. The anim_time style property sets the animation time if the values set with LV_ANIM_ON.
LV_PART_INDICATOR The indicator itself; also also uses all the typical background properties.

Usage¶

Value and range¶

A new value can be set by lv_bar_set_value(bar, new_value, LV_ANIM_ON/OFF). The value is interpreted in a range (minimum and maximum values) which can be modified with lv_bar_set_range(bar, min, max). The default range is 1..100.

The new value in lv_bar_set_value can be set with or without an animation depending on the last parameter (LV_ANIM_ON/OFF).

Modes¶

The bar can be one the following modes:

LV_BAR_MODE_NORMAL A normal bar as described above
LV_BAR_SYMMETRICAL Draw the indicator from the zero value to current value. Requires a negative minimum range and positive maximum range.
LV_BAR_RANGE Allows setting the start value too by lv_bar_set_start_value(bar, new_value, LV_ANIM_ON/OFF). The start value always has to be smaller than the end value.

Events¶

LV_EVENT_DRAW_PART_BEGIN and LV_EVENT_DRAW_PART_END are sent for both main and indicator parts to allow hooking the drawing. For more detail on the main part see the Base object's documentation. For the indicator the following fields are used: clip_area, draw_area, rect_dsc, part.

Learn more about Events.

Keys¶

No Keys are processed by the object type.

Learn more about Keys.

Example¶

C¶

Simple Bar¶

#include "../../lv_examples.h"
#if LV_USE_BAR && LV_BUILD_EXAMPLES

void lv_example_bar_1(void)
{
    lv_obj_t * bar1 = lv_bar_create(lv_scr_act());
    lv_obj_set_size(bar1, 200, 20);
    lv_obj_center(bar1);
    lv_bar_set_value(bar1, 70, LV_ANIM_OFF);
}

#endif

Styling a bar¶

#include "../../lv_examples.h"
#if LV_USE_BAR && LV_BUILD_EXAMPLES

/**
 * Example of styling the bar
 */
void lv_example_bar_2(void)
{
    static lv_style_t style_bg;
    static lv_style_t style_indic;

    lv_style_init(&style_bg);
    lv_style_set_border_color(&style_bg, lv_palette_main(LV_PALETTE_BLUE));
    lv_style_set_border_width(&style_bg, 2);
    lv_style_set_pad_all(&style_bg, 6); /*To make the indicator smaller*/
    lv_style_set_radius(&style_bg, 6);
    lv_style_set_anim_time(&style_bg, 1000);

    lv_style_init(&style_indic);
    lv_style_set_bg_opa(&style_indic, LV_OPA_COVER);
    lv_style_set_bg_color(&style_indic, lv_palette_main(LV_PALETTE_BLUE));
    lv_style_set_radius(&style_indic, 3);

    lv_obj_t * bar = lv_bar_create(lv_scr_act());
    lv_obj_remove_style_all(bar);  /*To have a clean start*/
    lv_obj_add_style(bar, &style_bg, 0);
    lv_obj_add_style(bar, &style_indic, LV_PART_INDICATOR);

    lv_obj_set_size(bar, 200, 20);
    lv_obj_center(bar);
    lv_bar_set_value(bar, 100, LV_ANIM_ON);
}

#endif

Temperature meter¶

#include "../../lv_examples.h"
#if LV_USE_BAR && LV_BUILD_EXAMPLES

static void set_temp(void * bar, int32_t temp)
{
    lv_bar_set_value(bar, temp, LV_ANIM_ON);
}

/**
 * A temperature meter example
 */
void lv_example_bar_3(void)
{
    static lv_style_t style_indic;

    lv_style_init(&style_indic);
    lv_style_set_bg_opa(&style_indic, LV_OPA_COVER);
    lv_style_set_bg_color(&style_indic, lv_palette_main(LV_PALETTE_RED));
    lv_style_set_bg_grad_color(&style_indic, lv_palette_main(LV_PALETTE_BLUE));
    lv_style_set_bg_grad_dir(&style_indic, LV_GRAD_DIR_VER);

    lv_obj_t * bar = lv_bar_create(lv_scr_act());
    lv_obj_add_style(bar, &style_indic, LV_PART_INDICATOR);
    lv_obj_set_size(bar, 20, 200);
    lv_obj_center(bar);
    lv_bar_set_range(bar, -20, 40);

    lv_anim_t a;
    lv_anim_init(&a);
    lv_anim_set_exec_cb(&a, set_temp);
    lv_anim_set_time(&a, 3000);
    lv_anim_set_playback_time(&a, 3000);
    lv_anim_set_var(&a, bar);
    lv_anim_set_values(&a, -20, 40);
    lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
    lv_anim_start(&a);
}


#endif

Stripe pattern and range value¶

#include "../../lv_examples.h"
#if LV_USE_BAR && LV_BUILD_EXAMPLES

/**
 * Bar with stripe pattern and ranged value
 */
void lv_example_bar_4(void)
{
    LV_IMG_DECLARE(img_skew_strip);
    static lv_style_t style_indic;

    lv_style_init(&style_indic);
    lv_style_set_bg_img_src(&style_indic, &img_skew_strip);
    lv_style_set_bg_img_tiled(&style_indic, true);
    lv_style_set_bg_img_opa(&style_indic, LV_OPA_30);

    lv_obj_t * bar = lv_bar_create(lv_scr_act());
    lv_obj_add_style(bar, &style_indic, LV_PART_INDICATOR);

    lv_obj_set_size(bar, 260, 20);
    lv_obj_center(bar);
    lv_bar_set_mode(bar, LV_BAR_MODE_RANGE);
    lv_bar_set_value(bar, 90, LV_ANIM_OFF);
    lv_bar_set_start_value(bar, 20, LV_ANIM_OFF);
}

#endif

Bar with RTL and RTL base direction¶

#include "../../lv_examples.h"
#if LV_USE_BAR && LV_BUILD_EXAMPLES

/**
 * Bar with LTR and RTL base direction
 */
void lv_example_bar_5(void)
{
    lv_obj_t * label;


    lv_obj_t * bar_ltr = lv_bar_create(lv_scr_act());
    lv_obj_set_size(bar_ltr, 200, 20);
    lv_bar_set_value(bar_ltr, 70, LV_ANIM_OFF);
    lv_obj_align(bar_ltr, LV_ALIGN_CENTER, 0, -30);

    label = lv_label_create(lv_scr_act());
    lv_label_set_text(label, "Left to Right base direction");
    lv_obj_align_to(label, bar_ltr, LV_ALIGN_OUT_TOP_MID, 0, -5);

    lv_obj_t * bar_rtl = lv_bar_create(lv_scr_act());
    lv_obj_set_style_base_dir(bar_rtl, LV_BASE_DIR_RTL, 0);
    lv_obj_set_size(bar_rtl, 200, 20);
    lv_bar_set_value(bar_rtl, 70, LV_ANIM_OFF);
    lv_obj_align(bar_rtl, LV_ALIGN_CENTER, 0, 30);

    label = lv_label_create(lv_scr_act());
    lv_label_set_text(label, "Right to Left base direction");
    lv_obj_align_to(label, bar_rtl, LV_ALIGN_OUT_TOP_MID, 0, -5);
}

#endif

Custom drawr to show the current value¶

#include "../../lv_examples.h"
#if LV_USE_BAR && LV_BUILD_EXAMPLES

static void set_value(void *bar, int32_t v)
{
    lv_bar_set_value(bar, v, LV_ANIM_OFF);
}

static void event_cb(lv_event_t * e)
{
    lv_obj_draw_part_dsc_t * dsc = lv_event_get_param(e);
    if(dsc->part != LV_PART_INDICATOR) return;

    lv_obj_t * obj= lv_event_get_target(e);

    lv_draw_label_dsc_t label_dsc;
    lv_draw_label_dsc_init(&label_dsc);
    label_dsc.font = LV_FONT_DEFAULT;

    char buf[8];
    lv_snprintf(buf, sizeof(buf), "%d", lv_bar_get_value(obj));

    lv_point_t txt_size;
    lv_txt_get_size(&txt_size, buf, label_dsc.font, label_dsc.letter_space, label_dsc.line_space, LV_COORD_MAX, label_dsc.flag);

    lv_area_t txt_area;
    /*If the indicator is long enough put the text inside on the right*/
    if(lv_area_get_width(dsc->draw_area) > txt_size.x + 20) {
        txt_area.x2 = dsc->draw_area->x2 - 5;
        txt_area.x1 = txt_area.x2 - txt_size.x + 1;
        label_dsc.color = lv_color_white();
    }
    /*If the indicator is still short put the text out of it on the right*/
    else {
        txt_area.x1 = dsc->draw_area->x2 + 5;
        txt_area.x2 = txt_area.x1 + txt_size.x - 1;
        label_dsc.color = lv_color_black();
    }

    txt_area.y1 = dsc->draw_area->y1 + (lv_area_get_height(dsc->draw_area) - txt_size.y) / 2;
    txt_area.y2 = txt_area.y1 + txt_size.y - 1;

    lv_draw_label(&txt_area, dsc->clip_area, &label_dsc, buf, NULL);
}

/**
 * Custom drawer on the bar to display the current value
 */
void lv_example_bar_6(void)
{
    lv_obj_t * bar = lv_bar_create(lv_scr_act());
    lv_obj_add_event_cb(bar, event_cb, LV_EVENT_DRAW_PART_END, NULL);
    lv_obj_set_size(bar, 200, 20);
    lv_obj_center(bar);

    lv_anim_t a;
    lv_anim_init(&a);
    lv_anim_set_var(&a, bar);
    lv_anim_set_values(&a, 0, 100);
    lv_anim_set_exec_cb(&a, set_value);
    lv_anim_set_time(&a, 2000);
    lv_anim_set_playback_time(&a, 2000);
    lv_anim_set_repeat_count(&a, LV_ANIM_REPEAT_INFINITE);
    lv_anim_start(&a);

}

#endif

MicroPython¶

No examples yet.

API¶

Typedefs

typedef uint8_t lv_bar_mode_t¶

Enums

enum [anonymous]¶

Values:

enumerator LV_BAR_MODE_NORMAL¶

enumerator LV_BAR_MODE_SYMMETRICAL¶

enumerator LV_BAR_MODE_RANGE¶

Functions

lv_obj_t *lv_bar_create(lv_obj_t *parent)¶

Create a bar objects

Parameters: parent -- pointer to an object, it will be the parent of the new bar
Returns: pointer to the created bar

void lv_bar_set_value(lv_obj_t *obj, int32_t value, lv_anim_enable_t anim)¶

Set a new value on the bar

Parameters

bar -- pointer to a bar object
value -- new value
anim -- LV_ANIM_ON: set the value with an animation; LV_ANIM_OFF: change the value immediately

void lv_bar_set_start_value(lv_obj_t *obj, int32_t start_value, lv_anim_enable_t anim)¶

Set a new start value on the bar

Parameters

obj -- pointer to a bar object
value -- new start value
anim -- LV_ANIM_ON: set the value with an animation; LV_ANIM_OFF: change the value immediately

void lv_bar_set_range(lv_obj_t *obj, int32_t min, int32_t max)¶

Set minimum and the maximum values of a bar

Parameters

obj -- pointer to the bar object
min -- minimum value
max -- maximum value

void lv_bar_set_mode(lv_obj_t *obj, lv_bar_mode_t mode)¶

Set the type of bar.

Parameters

obj -- pointer to bar object
mode -- bar type from ::lv_bar_mode_t

int32_t lv_bar_get_value(const lv_obj_t *obj)¶

Get the value of a bar

Parameters: obj -- pointer to a bar object
Returns: the value of the bar

int32_t lv_bar_get_start_value(const lv_obj_t *obj)¶

Get the start value of a bar

Parameters: obj -- pointer to a bar object
Returns: the start value of the bar

int32_t lv_bar_get_min_value(const lv_obj_t *obj)¶

Get the minimum value of a bar

Parameters: obj -- pointer to a bar object
Returns: the minimum value of the bar

int32_t lv_bar_get_max_value(const lv_obj_t *obj)¶

Get the maximum value of a bar

Parameters: obj -- pointer to a bar object
Returns: the maximum value of the bar

lv_bar_mode_t lv_bar_get_mode(lv_obj_t *obj)¶

Get the type of bar.

Parameters: obj -- pointer to bar object
Returns: bar type from ::lv_bar_mode_t

Variables

const lv_obj_class_t lv_bar_class¶

struct _lv_bar_anim_t¶

Public Members

lv_obj_t *bar¶

int32_t anim_start¶

int32_t anim_end¶

int32_t anim_state¶

struct lv_bar_t¶

Public Members

lv_obj_t obj¶

int32_t cur_value¶: Current value of the bar

int32_t min_value¶: Minimum value of the bar

int32_t max_value¶: Maximum value of the bar

int32_t start_value¶: Start value of the bar

lv_area_t indic_area¶: Save the indicator area. Might be used by derived types

_lv_bar_anim_t cur_value_anim¶

_lv_bar_anim_t start_value_anim¶

lv_bar_mode_t mode¶: Type of bar