Skip to content

LVGL Gallery — C++

Source: apps/cpp/heap/lvgl_gallery/src/app.cpp.

The C++ port uses ove::lvgl::* typed wrappers for every widget and the fluent style builder for configuration. Page navigation is via ove::lvgl::TileView.

Build

make host.posix.lvgl_gallery_cpp
make && make run

Page registration

Each widget gets its own page builder:

static void build_slider_page(ove::lvgl::Object parent)
{
    auto slider = ove::lvgl::Slider(parent);
    slider.size(200, 12).align(LV_ALIGN_CENTER);
    slider.range(0, 100).value(42);
    slider.on_change([](int v) { /* … */ });
}

The pages live in a table:

struct Page {
    const char *name;
    void (*build)(ove::lvgl::Object);
};

static const Page pages[] = {
    { "Object",   build_object_page   },
    { "Label",    build_label_page    },
    { "Slider",   build_slider_page   },
    { "Switch",   build_switch_page   },
    /* … 22 entries total … */
};

Top navigation

A TabView (or Window on smaller displays) renders the page selector. The widget hierarchy is built once at startup:

void ove_main() {
    auto guard = ove::LvglGuard{};   /* RAII lock for the build */
    auto tabs = ove::lvgl::TabView(lv_screen_active(), LV_DIR_TOP, 40);
    for (const auto &p : pages) {
        auto tab = tabs.add_tab(p.name);
        p.build(tab);
    }
    /* guard releases here */
    ove::run();
}

ove::LvglGuard is move-deleted so it stays scoped to the build window. After ove::run(), the graphics thread owns LVGL.

Fluent styles

The style builder chains:

button.style()
    .background_color(0x1565c0)
    .border_color(0x0d47a1)
    .border_width(2)
    .radius(8)
    .text_color(0xffffff);

Each setter returns the builder by reference and the compiler inlines the chain into a flat sequence of lv_obj_set_style_* calls — no per-link overhead beyond what the underlying LVGL setter would cost on its own.

Image assets

The gallery's image-button page uses a small set of bundled PNGs converted to LVGL image descriptors at build time:

sources:
  - src/app.cpp
  - assets/icon_settings.c
  - assets/icon_battery.c

The .c files are generated by scripts/lvgl_img_conv.py (invoked by the build system). C++ accesses them via extern "C" declarations the build emits.

Where to next