Examples, tutorials and applications for the LVGL embedded GUI library

Overview

⚠️ This library is now obsolete. Please use https://github.com/lvgl/lvgl/tree/master/demos instead. ⚠️

Demos for LVGL

Add the examples to your projects

  1. Clone this repository: git clone https://github.com/lvgl/lv_demos.git.
  2. The lv_demos directory should be next to the lvgl directory in your project.

Similarly to lv_conf.h there is a configuration file for the examples too. It is called lv_demo_conf.h.

  1. Copy lv_demos/lv_demo_conf_template.h next to lv_demos directory
  2. Rename it to lv_demo_conf.h
  3. Change the first #if 0 to #if 1 to enable the file's content
  4. Enable or Disable demos

Demos

Widgets

Shows how the widgets look like out of the box using the built-in material theme.   See in lv_demo_widgets folder.

Basic demo to show the widgets of LVGL

Music player

The music player demo shows what kind of modern, smartphone-like user interfaces can be created on LVGL. It works the best with display with 480x272 or 272x480 resolution.

See in lv_demo_music folder.

Music player demo with LVGL

Keypad and encoder

LVGL allows you to control the widgets with a keypad and/or encoder without a touchpad. This demo shows how to handle buttons, drop-down lists, rollers, sliders, switches, and text inputs without touchpad. Learn more about the touchpad-less usage of LVGL here.

See in lv_demo_keypad_encoder folder.

Keypad and encoder navigation in LVGL embedded GUI library

Benchmark

A demo to measure the performance of LVGL or to compare different settings. See in lv_demo_benchmark folder. Benchmark demo with LVGL embedded GUI library

Stress

A stress test for LVGL. It contains a lot of object creation, deletion, animations, style usage, and so on. It can be used if there is any memory corruption during heavy usage or any memory leaks. See in lv_demo_stress folder. Stress tes tfor LVGL

Contributing

For contribution and coding style guidelines, please refer to the file docs/CONTRIBUTNG.md in the main LVGL repo:   https://github.com/lvgl/lvgl

Issues
  • Rework the examples repo

    Rework the examples repo

    This repo should be reworked to make people easier to get started.

    My vision is the following

    Simple examples

    Add very simple examples. It would be nice to use these examples in the documentation too (add lv_examples as a submodule to docs). I was collecting the recurring questions which could be answered with examples:

    • [x] mbox: modal (@embeddedt, lv_ex_mbox_2)
    • [x] slider: move the slider and set a label's text (@embeddedt, lv_ex_slider_2)
    • [ ] button: styling
    • [x] image: recolor (@embeddedt, lv_ex_img_2)
    • [ ] label: styling
    • [x] label: text shadow (@embeddedt, lv_ex_label_2)
    • [x] text area: password and one line mode (@embeddedt, lv_ex_ta_2)
    • [ ] text area: finish on Enter
    • [ ] text area: format text (e.g automatically add dots for IP address)
    • [ ] image: slide show animation
    • [ ] image: mosaic wallpaper
    • [x] display driver test (aded in FAQ)

    Ready to use / easy to modify applications

    • [x] Android like menu LINK
    • [ ] Car dashboard
    • [ ] File browser
    • [ ] Home automatization
    • [ ] Audio players
    • [ ] WiFi connect
    • [ ] All in one example to show LittlevGL's features Example

    External libraries

    Create a separate repo for examples when external libraries are used:

    • [x] PNG decoder
    • [ ] JPG decoder
    • [ ] Video player
    • [x] QR code
    • [x] FatFS and Windows/Unix fs integration. Here I've already started something
    • [x] FreeType

    Blog post

    Create blog posts about longer, more complex topics

    • [ ] responsive: fit, auto realign, layout, LV_DPI
    • [ ] optimizations for monocrome: round, pixel_wr
    • [ ] OSD menu
    • [x] FAQ: added to the documentation's welcome page instead

    Tutorials

    • lv_tutorial should be removed as it makes the examples and documentation fragile

    Tests

    • lv_tests are not designed for the users, so they can go to a separate repo: lv_tets

    Feedback is very welcome

    help wanted pinned 
    opened by kisvegabor 61
  • Mpy examples

    Mpy examples

    These are my micropython examples. I tried to do a "word by word" translation from the C originals. The examples using images may not run yet on the simulator. However, I prepared examples with the extension ...sim.py for which a conversion to a program running on the simulator should be easy. Only the filename of the binary file must be changed to the URL of the binary image. Please check

    opened by uraich 48
  • Error with live examples

    Error with live examples

    @embeddedt I've released v7.6.1 but now the live examples are not working. It shows 404 error instead of the examples and I can't find the html files anywhere.

    BTW, if the html files are added into the gh-pages branch how can we manage more branches (other than the master)?

    bug 
    opened by kisvegabor 16
  • lv_demo_widgets, no display

    lv_demo_widgets, no display

    Hello

    See my configuration below. All demos works, except lv_demo_widgets. Is there maybe a bug?

    Thank you

      //lv_demo_music(); // OK
      lv_demo_widgets(); // NOT OK
      //lv_demo_benchmark(); // OK
      //lv_demo_keypad_encoder(); // OK
      //lv_demo_stress(); // OK
    
    [env:disco_f746ng]
    platform = ststm32
    board = disco_f746ng
    framework = arduino
    lib_deps = 
    	lvgl/[email protected]^8.1.1-dev
    	lvgl/[email protected]^8.1.0
    
    opened by epikao 14
  • Compilation error

    Compilation error

    When compiling the examples with the Makefile I get an error:

    lv_examples/src/lv_demo_stress/lv_demo_stress.c:246:37: error: cast between incompatible function types from ‘void (*)(lv_obj_t *, uint16_t)’ {aka ‘void (*)(struct _lv_obj_t *, short unsigned int)’} to ‘void (*)(void *, lv_anim_value_t)’ {aka ‘void (*)(void *, short int)’} [-Werror=cast-function-type]
      246 |             lv_anim_set_exec_cb(&a, (lv_anim_exec_xcb_t)lv_arc_set_end_angle);
          |                                     ^
    lv_examples/src/lv_demo_stress/lv_demo_stress.c:256:37: error: cast between incompatible function types from ‘void (*)(lv_obj_t *, uint16_t)’ {aka ‘void (*)(struct _lv_obj_t *, short unsigned int)’} to ‘void (*)(void *, lv_anim_value_t)’ {aka ‘void (*)(void *, short int)’} [-Werror=cast-function-type]
      256 |             lv_anim_set_exec_cb(&a, (lv_anim_exec_xcb_t)lv_linemeter_set_angle_offset);
    

    I got rid of it adding -Wno-cast-function-type I am using gcc (Ubuntu 9.3.0-17ubuntu1~20.04) 9.3.0

    stale 
    opened by uraich 12
  • How to run hello world?

    How to run hello world?

    I've a basic script, based on lv_examples/lv_tutorial/1_hello_world:

    /* gui.c */
    #include "lvgl/lvgl.h"
    
    int main()
    {	 	 
        return 0;
    }
    
    void gui(void)
    {
        lv_obj_t * scr = lv_disp_get_scr_act(NULL); /* just one line from the example */
    }
    

    I compile it with gcc gui.c and get the following error:

    /tmp/cca5tFm7.o: In function `gui':
    gui.c:(.text+0x2c): undefined reference to `lv_disp_get_scr_act'
    collect2: error: ld returned 1 exit status
    

    Where does lv_disp_get_scr_act() come from and what am I missing?

    Thanks in advance!

    opened by JimmyTheNerd 11
  • update to work with Arduino

    update to work with Arduino

    I made the lv_demo_widgetsfrom lv_examples buildable with the Arduino IDE for an ESP32 board and a 480x320 display. I also update the lvgl library. Most changes were done by text replacements:

    1. replace #if defined(LV_LVGL_H_INCLUDE_SIMPLE) with #if defined(LV_LVGL_H_INCLUDE_SIMPLE) || defined( ARDUINO )

    2. replace #include <lv_examples/lv_demo.h> with #ifdef ARDUINO #include <lv_demo.h> #else #include <lv_examples/lv_demo.h> #endif

    3. replace e == with e->code ==

    opened by ataweg 10
  • keyboard tutorial crashes when Yes or No is pressed

    keyboard tutorial crashes when Yes or No is pressed

    This seems to be related to deleting the mbox in mbox_action.

    I'm running this under mbed but not multi-threading. I'm using the NUCLEO-F446RE dev board with this display connected in 16-bit parallel. lv_tic_inc and lv_task_handler are called from the main loop context, not from a timer. I can get it to not crash if I hide the mbox instead of deleting it in mbox_action.

    In mbox_action, if I call

    lv_obj_set_hidden(lv_obj_get_parent(mbox), true); 
    

    instead of

    lv_obj_del(lv_obj_get_parent(mbox));
    

    The app does not crash. If I create a variable to save the mbox on creation

    static lv_obj_t * mbox = NULL;
    

    Then I can change enable_action to delete the 'old' mbox and create a new one. This works fine.

    static lv_res_t enable_action(lv_obj_t * btn)
    {
       /*If the butto nsi released the show message box to be sure about the Enable*/
       if(lv_btn_get_state(btn) == LV_BTN_STATE_REL) {
          if (mbox != NULL) {
             printf("mbox existed previously, deleting prior to creating new.\r\n");
             lv_obj_del(lv_obj_get_parent(mbox));    /*Delete the black background. (it will delete the mbox too)*/
          }
    ...
          /*Create a message box*/
          //lv_obj_t * mbox = lv_mbox_create(bg, NULL);
          mbox = lv_mbox_create(bg, NULL);
    

    Based on the crash report and the memory map, it seems to be crashing in memcpy after the object is deleted.

    Is it possible that somehow a touch is trying to be delivered to the deleted mbox and deleting it later is ok?

    opened by rbultman 10
  • demo, wrong pixel / lines ( glitched rendering )

    demo, wrong pixel / lines ( glitched rendering )

    Hello

    With benchmark or keypad demo, sometimes I see wrong pixel/lines, see pictures below. What's that? Do I have possibly a bug with my display driver code?

    Thank you

    image

    opened by epikao 9
  • ERROR IN lv_img_set_src from bin file

    ERROR IN lv_img_set_src from bin file

    hi,I use the following code,An error occurred,maybe 《lv_fs_file_t * file_p》 Parameter transfer error void test(void) { lv_obj_t *img; img = lv_img_create(lv_scr_act(), NULL); lv_img_set_src(img, "c:/1.bin"); } bin1 bin2 bin3 but i used gif testcode,no error occurred; void gif_demo(void) { lv_obj_t * img = lv_gif_create_from_file(lv_scr_act(), "c:/1.gif");

    } GIF GIF1

    I USE LVGL "LV_EXAMPLES"&"LVGL_NEW_FS_API"&"lv_fs_if"&"lv_lib_gif"

    stale 
    opened by zq190kg 9
  • Examples and assets include paths

    Examples and assets include paths

    Hello,

    I'm working on rework-7 branch, tried to bring-up 7.0 tests. I came across issue with lvgl.h include paths - all demos, examples and assets are using:

    #include "lvgl/lvgl.h"

    This doesn't follow style used in rest of the framework and breaks build. Shouldn't be there a construction like:

    #if defined(LV_CONF_INCLUDE_SIMPLE)
    #include "lvgl.h"
    #else
    #include "lvgl/lvgl.h"
    #endif 
    

    or is it a problem in my integration only? I use LV_CONF_INCLUDE_SIMPLE=1 and LV_EX_CONF_INCLUDE_SIMPLE=1 for work.

    Jozef

    opened by jozba 9
Releases(v5.2-rc)
Owner
LVGL
Light and Versatile Embedded Graphics Library
LVGL
LVGL - Light and Versatile Graphics Library

Powerful and easy-to-use embedded GUI library with many widgets, advanced visual effects (opacity, antialiasing, animations) and low memory requirements (16K RAM, 64K Flash).

LVGL 9.8k Jul 1, 2022
Simple and portable (but not inflexible) GUI library in C that uses the native GUI technologies of each platform it supports.

libui: a portable GUI library for C This README is being written. Status It has come to my attention that I have not been particularly clear about how

Pietro Gagliardi 10.3k Jun 30, 2022
This is a collection of widgets and utilities for the immediate mode GUI (imgui) that I am developing for the critic2 GUI

ImGui Goodies This is a collection of widgets and utilities for the immediate mode GUI (imgui) that I am developing for the critic2 GUI. Currently, th

null 95 Jun 22, 2022
FlatUI is a immediate mode C++ GUI library for games and graphical applications.

FlatUI is a immediate mode C++ GUI library for games and graphical applications. Go to our landing page to browse our documentation.

Google 600 Jun 22, 2022
The HorusUI library allows you to quickly develop GUIs for your applications by leveraging the ease of use provided by immediate mode GUI concepts.

Immediate Mode Graphical User Interface for Tools OVERVIEW The HorusUI library allows you to quickly develop GUIs for your applications by leveraging

null 130 Jun 20, 2022
Free open-source modern C++17 / C++20 framework to create console, forms (GUI like WinForms) and unit test applications on Microsoft Windows, Apple macOS and Linux.

xtd Modern C++17/20 framework to create console (CLI), forms (GUI like WinForms) and tunit (unit tests like Microsoft Unit Testing Framework) applicat

Gammasoft 319 Jun 22, 2022
wxWidgets is a free and open source cross-platform C++ framework for writing advanced GUI applications using native controls.

About wxWidgets is a free and open source cross-platform C++ framework for writing advanced GUI applications using native controls. wxWidgets allows y

null 4.4k Jun 28, 2022
Minimalistic C++/Python GUI library for OpenGL, GLES2/3, Metal, and WebAssembly/WebGL

NanoGUI NanoGUI is a minimalistic cross-platform widget library for OpenGL 3+, GLES 2/3, and Metal. It supports automatic layout generation, stateful

Mitsuba Physically Based Renderer 1k Jun 27, 2022
A barebones single-header GUI library for Win32 and X11.

luigi A barebones single-header GUI library for Win32 and X11. Building example Windows Update luigi_example.c to #define UI_WINDOWS at the top of the

Nakst 168 Jun 17, 2022
raygui is a simple and easy-to-use immediate-mode-gui library.

raygui is a simple and easy-to-use immediate-mode-gui library.

Ray 1.8k Jul 3, 2022
HastyBadger is a branch of the excellent widget and GUI library Turbo Badger.

Branch Notice - HastyBadger Hasty is not Turbo. HastyBadger is a branch of the excellent widget and GUI library Turbo Badger. Notabe additions are c++

Michael Tesch 36 Oct 21, 2021
Elements C++ GUI library

Elements C++ GUI library Introduction Elements is a lightweight, fine-grained, resolution independent, modular GUI library. Elements is designed with

Cycfi Research 2.3k Jun 25, 2022
A single-header ANSI C immediate mode cross-platform GUI library

Nuklear This is a minimal-state, immediate-mode graphical user interface toolkit written in ANSI C and licensed under public domain. It was designed a

Immediate Mode UIs, Nuklear, etc. 5.8k Jul 1, 2022
A library for creating native cross-platform GUI apps

Yue A library for creating native cross-platform GUI apps. Getting started Documentations FAQ Development Examples Sample apps (with screenshots) Muba

Yue 2.8k Jun 26, 2022
Minimalistic GUI library for OpenGL

NanoGUI NanoGUI is a minimalistic cross-platform widget library for OpenGL 3.x or higher. It supports automatic layout generation, stateful C++11 lamb

Wenzel Jakob 4.1k Jun 24, 2022
Cross-platform GUI library

Harbour Nuklear backend This backend provides support for Nuklear. It works on on all supported platforms with an OpenGL backend, including iOS and An

Rafał Jopek 2 Jan 19, 2022
Fishui - CutefishOS GUI library, based on Qt Quick.

FishUI FishUI is a GUI library based on QQC2 (Qt Quick Controls 2), every Cutefish application uses it. Features Light and Dark Mode Borderless window

CutefishOS 184 Jun 27, 2022
libui-ng: a portable GUI library for C

libui-ng: a portable GUI library for C Fork of andlabs/libui. This README is being written. Status See CHANGELOG.md Old announcements can be found in

null 187 Jun 27, 2022
Nana is a C++ standard-like GUI library

Nana C++ Library Linux (gcc 8.3.0 and 9.2) including (nana-demos) Windows (Microsoft (R) Build Engine version 15.9.21) Nana is a C++ standard-like GUI

Jinhao 2k Jun 30, 2022