Giter VIP home page Giter VIP logo

lvgl's Introduction

English | 中文 | Português do Brasil | 日本語


 

 

Light and Versatile Graphics Library

 

   

Website | Docs | Forum | Demos | Services


📒 Overview

Mature and Well-known
LVGL is the most popular free and open source embedded graphics library to create beautiful UIs for any MCU, MPU and display type. It's supported by industry leading vendors and projects like  Arm, STM32, NXP, Espressif, Nuvoton, Arduino, RT-Thread, Zephyr, NuttX, Adafruit and many more.

Feature Rich
It has all the features to create modern and beautiful GUIs: 30+ built-in widgets, a powerful style system, web inspired layout managers, and a typography system supporting many languages. To integrate LVGL into your platform, all you need is at least 32kB RAM and 128 kB Flash, a C compiler, a frame buffer, and at least an 1/10 screen sized buffer for rendering.

Services
Our team is ready to help you with graphics design, UI implementation and consulting services. Contact us if you need some support during the development of your next GUI project.

🚀 Features

Free and Portable

  • A fully portable C (C++ compatible) library with no external dependencies.
  • Can be compiled to any MCU or MPU, with any (RT)OS.
  • Supports monochrome, ePaper, OLED or TFT displays, or even monitors. Porting Guide
  • Distributed under the MIT license, so you can easily use it in commercial projects too.
  • Needs only 32kB RAM and 128 kB Flash, a frame buffer, and at least an 1/10 screen sized buffer for rendering.
  • OS, External memory and GPU are supported but not required.

Widgets, Styles, Layouts and more

  • 30+ built-in Widgets:  Button, Label, Slider, Chart, Keyboard, Meter, Arc, Table and many more.
  • Flexible Style system with  ~100 style properties to customize any part of the widgets in any state.
  • Flexbox and Grid-like layouts engines to automatically size and position the widgets in a responsive way.
  • Texts are rendered with UTF-8 encoding supporting CJK, Thai, Hindi, Arabic, Persian writing systems.
  • Word wrapping, kerning, text scrolling, sub-pixel rendering, Pinyin-IME Chinese input, Emojis in texts.
  • Rendering engine supporting animations, anti-aliasing, opacity, smooth scrolling, shadows, image transformation, etc  
  • Supports Mouse, Touchpad, Keypad, Keyboard, External buttons, Encoder Input devices.
  • Multiple display support.

Binding and Build Support

  • Micropython Binding exposes LVGL API
  • PikaScript Binding python on MCU lighter and easier.
  • No custom build system is used. You can build LVGL as you build the other files of your project.
  • Support for Make and CMake is included out of the box.
  • Develop on PC and use the same UI code on embedded hardware.
  • Convert the C UI code to HTML file with our Emscripten port.

Docs, Tools, and Services

❤️ Sponsor

If LVGL saved you a lot of time and money or you just had fun using it, consider Supporting its Development.

How do we spend the donations?
Our goal is to provide financial compensation for people who do the most for LVGL. It means not only the maintainers but anyone who implements a great feature should get a payment from the accumulated money. We use the donations to cover our operational costs like servers and related services.

How to donate?
We use GitHub Sponsors where you can easily send one time or recurring donations. You can also see all of our expenses in a transparent way.

How to get paid for your contribution?
If someone implements or fixes an issue labeled as Sponsored he or she will get a payment for that work. We estimate the required time, complexity and importance of the issue and set a price accordingly. To jump in just comment on a Sponsored issue saying "Hi, I'd like to deal with it. This is how I'm planning to fix/implement it...". A work is considered ready when it's approved and merged by a maintainer. After that you can submit and expense at opencollective.com and you will receive the payment in a few days.

Organizations supporting LVGL
Sponsors of LVGL

Individuals supporting LVGL
Backers of LVGL

📦 Packages

LVGL is available as:

🤖 Examples

See some examples of creating widgets, using layouts and applying styles. You will find C and MicroPython code, and links to try out or edit the examples in an online MicroPython editor.

For more examples check out the Examples folder.

Hello world label

Simple Hello world label example in LVGL

C code
/*Change the active screen's background color*/
lv_obj_set_style_bg_color(lv_screen_active(), lv_color_hex(0x003a57), LV_PART_MAIN);

/*Create a white label, set its text and align it to the center*/
lv_obj_t * label = lv_label_create(lv_screen_active());
lv_label_set_text(label, "Hello world");
lv_obj_set_style_text_color(lv_screen_active(), lv_color_hex(0xffffff), LV_PART_MAIN);
lv_obj_align(label, LV_ALIGN_CENTER, 0, 0);
MicroPython code | Online Simulator
# Change the active screen's background color
scr = lv.screen_active()
scr.set_style_bg_color(lv.color_hex(0x003a57), lv.PART.MAIN)

# Create a white label, set its text and align it to the center
label = lv.label(lv.screen_active())
label.set_text("Hello world")
label.set_style_text_color(lv.color_hex(0xffffff), lv.PART.MAIN)
label.align(lv.ALIGN.CENTER, 0, 0)

Button with Click Event

LVGL button with label example

C code
lv_obj_t * button = lv_button_create(lv_screen_active());                   /*Add a button to the current screen*/
lv_obj_center(button);                                             /*Set its position*/
lv_obj_set_size(button, 100, 50);                                  /*Set its size*/
lv_obj_add_event_cb(button, button_event_cb, LV_EVENT_CLICKED, NULL); /*Assign a callback to the button*/

lv_obj_t * label = lv_label_create(button);                        /*Add a label to the button*/
lv_label_set_text(label, "Button");                             /*Set the labels text*/
lv_obj_center(label);                                           /*Align the label to the center*/
...

void button_event_cb(lv_event_t * e)
{
  printf("Clicked\n");
}
MicroPython code | Online Simulator
def button_event_cb(e):
  print("Clicked")

# Create a Button and a Label
button = lv.button(lv.screen_active())
button.center()
button.set_size(100, 50)
button.add_event_cb(button_event_cb, lv.EVENT.CLICKED, None)

label = lv.label(button)
label.set_text("Button")
label.center()

Checkboxes with Layout

Checkboxes with layout in LVGL

C code
lv_obj_set_flex_flow(lv_screen_active(), LV_FLEX_FLOW_COLUMN);
lv_obj_set_flex_align(lv_screen_active(), LV_FLEX_ALIGN_CENTER, LV_FLEX_ALIGN_START, LV_FLEX_ALIGN_CENTER);

lv_obj_t * cb;
cb = lv_checkbox_create(lv_screen_active());
lv_checkbox_set_text(cb, "Apple");
lv_obj_add_event_cb(cb, event_handler, LV_EVENT_ALL, NULL);

cb = lv_checkbox_create(lv_screen_active());
lv_checkbox_set_text(cb, "Banana");
lv_obj_add_state(cb, LV_STATE_CHECKED);
lv_obj_add_event_cb(cb, event_handler, LV_EVENT_ALL, NULL);

cb = lv_checkbox_create(lv_screen_active());
lv_checkbox_set_text(cb, "Lemon");
lv_obj_add_state(cb, LV_STATE_DISABLED);
lv_obj_add_event_cb(cb, event_handler, LV_EVENT_ALL, NULL);

cb = lv_checkbox_create(lv_screen_active());
lv_obj_add_state(cb, LV_STATE_CHECKED | LV_STATE_DISABLED);
lv_checkbox_set_text(cb, "Melon\nand a new line");
lv_obj_add_event_cb(cb, event_handler, LV_EVENT_ALL, NULL);
MicroPython code | Online Simulator
def event_handler(e):
    code = e.get_code()
    obj = e.get_target_obj()
    if code == lv.EVENT.VALUE_CHANGED:
        txt = obj.get_text()
        if obj.get_state() & lv.STATE.CHECKED:
            state = "Checked"
        else:
            state = "Unchecked"
        print(txt + ":" + state)


lv.screen_active().set_flex_flow(lv.FLEX_FLOW.COLUMN)
lv.screen_active().set_flex_align(lv.FLEX_ALIGN.CENTER, lv.FLEX_ALIGN.START, lv.FLEX_ALIGN.CENTER)

cb = lv.checkbox(lv.screen_active())
cb.set_text("Apple")
cb.add_event_cb(event_handler, lv.EVENT.ALL, None)

cb = lv.checkbox(lv.screen_active())
cb.set_text("Banana")
cb.add_state(lv.STATE.CHECKED)
cb.add_event_cb(event_handler, lv.EVENT.ALL, None)

cb = lv.checkbox(lv.screen_active())
cb.set_text("Lemon")
cb.add_state(lv.STATE.DISABLED)
cb.add_event_cb(event_handler, lv.EVENT.ALL, None)

cb = lv.checkbox(lv.screen_active())
cb.add_state(lv.STATE.CHECKED | lv.STATE.DISABLED)
cb.set_text("Melon")
cb.add_event_cb(event_handler, lv.EVENT.ALL, None)

Styling a Slider

Styling a slider with LVGL

C code
lv_obj_t * slider = lv_slider_create(lv_screen_active());
lv_slider_set_value(slider, 70, LV_ANIM_OFF);
lv_obj_set_size(slider, 300, 20);
lv_obj_center(slider);

/*Add local styles to MAIN part (background rectangle)*/
lv_obj_set_style_bg_color(slider, lv_color_hex(0x0F1215), LV_PART_MAIN);
lv_obj_set_style_bg_opa(slider, 255, LV_PART_MAIN);
lv_obj_set_style_border_color(slider, lv_color_hex(0x333943), LV_PART_MAIN);
lv_obj_set_style_border_width(slider, 5, LV_PART_MAIN);
lv_obj_set_style_pad_all(slider, 5, LV_PART_MAIN);

/*Create a reusable style sheet for the INDICATOR part*/
static lv_style_t style_indicator;
lv_style_init(&style_indicator);
lv_style_set_bg_color(&style_indicator, lv_color_hex(0x37B9F5));
lv_style_set_bg_grad_color(&style_indicator, lv_color_hex(0x1464F0));
lv_style_set_bg_grad_dir(&style_indicator, LV_GRAD_DIR_HOR);
lv_style_set_shadow_color(&style_indicator, lv_color_hex(0x37B9F5));
lv_style_set_shadow_width(&style_indicator, 15);
lv_style_set_shadow_spread(&style_indicator, 5);
4
/*Add the style sheet to the slider's INDICATOR part*/
lv_obj_add_style(slider, &style_indicator, LV_PART_INDICATOR);

/*Add the same style to the KNOB part too and locally overwrite some properties*/
lv_obj_add_style(slider, &style_indicator, LV_PART_KNOB);

lv_obj_set_style_outline_color(slider, lv_color_hex(0x0096FF), LV_PART_KNOB);
lv_obj_set_style_outline_width(slider, 3, LV_PART_KNOB);
lv_obj_set_style_outline_pad(slider, -5, LV_PART_KNOB);
lv_obj_set_style_shadow_spread(slider, 2, LV_PART_KNOB);
MicroPython code | Online Simulator
# Create a slider and add the style
slider = lv.slider(lv.screen_active())
slider.set_value(70, lv.ANIM.OFF)
slider.set_size(300, 20)
slider.center()

# Add local styles to MAIN part (background rectangle)
slider.set_style_bg_color(lv.color_hex(0x0F1215), lv.PART.MAIN)
slider.set_style_bg_opa(255, lv.PART.MAIN)
slider.set_style_border_color(lv.color_hex(0x333943), lv.PART.MAIN)
slider.set_style_border_width(5, lv.PART.MAIN)
slider.set_style_pad_all(5, lv.PART.MAIN)

# Create a reusable style sheet for the INDICATOR part
style_indicator = lv.style_t()
style_indicator.init()
style_indicator.set_bg_color(lv.color_hex(0x37B9F5))
style_indicator.set_bg_grad_color(lv.color_hex(0x1464F0))
style_indicator.set_bg_grad_dir(lv.GRAD_DIR.HOR)
style_indicator.set_shadow_color(lv.color_hex(0x37B9F5))
style_indicator.set_shadow_width(15)
style_indicator.set_shadow_spread(5)

# Add the style sheet to the slider's INDICATOR part
slider.add_style(style_indicator, lv.PART.INDICATOR)
slider.add_style(style_indicator, lv.PART.KNOB)

# Add the same style to the KNOB part too and locally overwrite some properties
slider.set_style_outline_color(lv.color_hex(0x0096FF), lv.PART.KNOB)
slider.set_style_outline_width(3, lv.PART.KNOB)
slider.set_style_outline_pad(-5, lv.PART.KNOB)
slider.set_style_shadow_spread(2, lv.PART.KNOB)

English, Hebrew (mixed LTR-RTL) and Chinese texts

English, Hebrew and Chinese texts with LVGL

C code
lv_obj_t * ltr_label = lv_label_create(lv_screen_active());
lv_label_set_text(ltr_label, "In modern terminology, a microcontroller is similar to a system on a chip (SoC).");
lv_obj_set_style_text_font(ltr_label, &lv_font_montserrat_16, 0);
lv_obj_set_width(ltr_label, 310);
lv_obj_align(ltr_label, LV_ALIGN_TOP_LEFT, 5, 5);

lv_obj_t * rtl_label = lv_label_create(lv_screen_active());
lv_label_set_text(rtl_label,"מעבד, או בשמו המלא יחידת עיבוד מרכזית (באנגלית: CPU - Central Processing Unit).");
lv_obj_set_style_base_dir(rtl_label, LV_BASE_DIR_RTL, 0);
lv_obj_set_style_text_font(rtl_label, &lv_font_dejavu_16_persian_hebrew, 0);
lv_obj_set_width(rtl_label, 310);
lv_obj_align(rtl_label, LV_ALIGN_LEFT_MID, 5, 0);

lv_obj_t * cz_label = lv_label_create(lv_screen_active());
lv_label_set_text(cz_label,
                  "嵌入式系统(Embedded System),\n是一种嵌入机械或电气系统内部、具有专一功能和实时计算性能的计算机系统。");
lv_obj_set_style_text_font(cz_label, &lv_font_simsun_16_cjk, 0);
lv_obj_set_width(cz_label, 310);
lv_obj_align(cz_label, LV_ALIGN_BOTTOM_LEFT, 5, -5);
MicroPython code | Online Simulator
ltr_label = lv.label(lv.screen_active())
ltr_label.set_text("In modern terminology, a microcontroller is similar to a system on a chip (SoC).")
ltr_label.set_style_text_font(lv.font_montserrat_16, 0);

ltr_label.set_width(310)
ltr_label.align(lv.ALIGN.TOP_LEFT, 5, 5)

rtl_label = lv.label(lv.screen_active())
rtl_label.set_text("מעבד, או בשמו המלא יחידת עיבוד מרכזית (באנגלית: CPU - Central Processing Unit).")
rtl_label.set_style_base_dir(lv.BASE_DIR.RTL, 0)
rtl_label.set_style_text_font(lv.font_dejavu_16_persian_hebrew, 0)
rtl_label.set_width(310)
rtl_label.align(lv.ALIGN.LEFT_MID, 5, 0)

font_simsun_16_cjk = lv.font_load("S:../../assets/font/lv_font_simsun_16_cjk.fnt")

cz_label = lv.label(lv.screen_active())
cz_label.set_style_text_font(font_simsun_16_cjk, 0)
cz_label.set_text("嵌入式系统(Embedded System),\n是一种嵌入机械或电气系统内部、具有专一功能和实时计算性能的计算机系统。")
cz_label.set_width(310)
cz_label.align(lv.ALIGN.BOTTOM_LEFT, 5, -5)

▶️ Get started

This list will guide you to get started with LVGL step-by-step.

Get Familiar with LVGL

  1. Check the Online demos to see LVGL in action (3 minutes)
  2. Read the Introduction page of the documentation (5 minutes)
  3. Get familiar with the basics on the Quick overview page (15 minutes)

Start to Use LVGL

  1. Set up a Simulator (10 minutes)
  2. Try out some Examples
  3. Port LVGL to a board. See the Porting guide or check the ready to use Projects

Become a Pro

  1. Read the Overview page to get a better understanding of the library (2-3 hours)
  2. Check the documentation of the Widgets to see their features and usage

Get Help and Help Others

  1. If you have questions go to the Forum
  2. Read the Contributing guide to see how you can help to improve LVGL (15 minutes)

🤝 Services

LVGL LLC was established to provide a solid background for LVGL library and to offer several type of services to help you in UI development. With 15+ years of experience in the user interface and graphics industry we can help you the bring your UI to the next level.

  • Graphics design Our in-house graphics designers are experts in creating beautiful modern designs which fit to your product and the resources of your hardware.
  • UI implementation We can also implement your UI based on the design you or we have created. You can be sure that we will make the most out of your hardware and LVGL. If a feature or widget is missing from LVGL, don't worry, we will implement it for you.
  • Consulting and Support We can support you with consulting as well to avoid pricey and time consuming mistakes during the UI development.
  • Board certification For companies who are offering development boards, or production ready kits we do board certification which shows how board can run LVGL.

Check out our Demos as reference. For more information take look at the Services page.

Contact us and tell how we can help.

🌟 Contributing

LVGL is an open project and contribution is very welcome. There are many ways to contribute from simply speaking about your project, through writing examples, improving the documentation, fixing bugs or even hosting your own project under the LVGL organization.

For a detailed description of contribution opportunities visit the Contributing section of the documentation.

More than 300 people already left their fingerprint in LVGL. Be one them! See you here! 🙂

... and many other.

lvgl's People

Contributors

ali-rostami avatar aloysetech avatar amirgon avatar bjsylvia avatar brianpugh avatar c47d avatar dependabot[bot] avatar embeddedt avatar fastshift avatar github-actions[bot] avatar gorgonmeducer avatar guoweilkd avatar ino-josh avatar johennes avatar kdschlosser avatar kisvegabor avatar lhdjply avatar manison avatar mariotaku avatar mysterywolf avatar niklasf avatar paulpv avatar pete-pjb avatar seyyah avatar turoksama avatar w-mai avatar xaowang96 avatar xennex22 avatar xiaoxiang781216 avatar xuneo avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

lvgl's Issues

Suggestion for change to lv_btn_set_styles

First of all I am working with the latest beta and can see many many improvements. Two immediate changes are that fonts are clearer and the code seems smaller so thank you for that.

Would it be an idea to allow lv_btn_set_styles to use NULL for button styles which are not to be changed and just supply the ones you want to alter? Or is there already a function to do this?

Arduino IDE compability

i am desperate to get this to the Arduino IDE, but i get a huge list of errors when compiling and i can't figure it out due to lack of knowing lvgl well enough... perhaps port it to arduino as well?

Question on color16_t

Looking in the source I can see that color16_t is using uint16_t as opposed to uint8_t. Is there a reason for this?

Changing colour of buttons in lv_list

Looking for some advice. I have a populated lv_list and would like the button to permanently change colour if it is selected and switch back to the "normal" colour if another button is then selected (with the new button changing colour permanently).

I can get the colour to change by attaching a function to the release event and, in that function, doing an lv_btn_get_style on the passed lv_obj_t and then updating the ccolor and mcolor. I then store the passed lv_obj_t to change the colour back on the next button press. The first press works but the colour change on the next button doesn't reset the first button. Is there a way to do this?

3D render options?

Is there any chance of 3D functions to the engine?
Like lights, polygons, meshes, vertexes.
(There are some repos on GitHub for MCU's that have some of these features)

Text poistion in lv_ta

I have a question. If I would like to adjust the position of text in lv_ta, which vpad and hpad should I take?

  • Style of lv_ta
  • Style of scrollbar style_sb from lv_page_get_style_sb(ta)

I made some try. I use ptask to change vpad periodically.
I set vpad on style of lv_ta, it worked on the first time call lv_obj_set_style(ta, &ta_style), but it didn't work on the second time or set style to the other new lv_style_t.
About style_sb, It's no effect by changing its vpad.

Thanks!

Empty lv_list ignores lv_obj_set_size

Using the following code:

panelId = lv_list_create(sscrn, NULL);
lv_obj_set_size_us(panelId, LCD_GetXSize()-20, LCD_GetYSize() - 135);
lv_obj_set_pos_us(panelId, 10, 10);

I find that if the lv_list is empty then the panel size is a single line, i.e. it ignores the set_size. Is that deliberate?

Has any low level interface in this LIB?

LittlevGL is nice.
I figured it using some object drawing interface, but when I wana just draw a simple line or rectangle or just for testing the hardware, the Lib just stop in lv_refr_areas(), seems like I should enbale the area firstly?

Missing header file img_conf.h

img_add.c reporting error of a missing file
#include "img_conf.h"

I think there is no template file img_conf_tmpl.h which can tell what goes in img_conf.h

usage of LV_INDEV_POINT_MARKER throws compiler errors

so i set the LV_INDEV_POINT_MARKER to 5 to see my presses(?) in the lvgl config file

buuuut.... my IDE throws compiling errors.

the complete error log:

C:\Users\Ramon\Documents\Arduino\libraries\lvgl\src\lv_obj\lv_indev.c: In function 'indev_proc_point':

C:\Users\Ramon\Documents\Arduino\libraries\lvgl\src\lv_obj\lv_indev.c:286:9: error: unknown type name 'area_t'

         area_t area;

         ^

C:\Users\Ramon\Documents\Arduino\libraries\lvgl\src\lv_obj\lv_indev.c:287:13: error: request for member 'x1' in something not a structure or union

         area.x1 = (indev->act_point.x >> LV_ANTIALIAS) - (LV_INDEV_POINT_MARKER >> 1);

             ^

C:\Users\Ramon\Documents\Arduino\libraries\lvgl\src\lv_obj\lv_indev.c:288:13: error: request for member 'y1' in something not a structure or union

         area.y1 = (indev->act_point.y >> LV_ANTIALIAS) - (LV_INDEV_POINT_MARKER >> 1);

             ^

C:\Users\Ramon\Documents\Arduino\libraries\lvgl\src\lv_obj\lv_indev.c:289:13: error: request for member 'x2' in something not a structure or union

         area.x2 = (indev->act_point.x >> LV_ANTIALIAS) + ((LV_INDEV_POINT_MARKER >> 1) | 0x1);

             ^

C:\Users\Ramon\Documents\Arduino\libraries\lvgl\src\lv_obj\lv_indev.c:290:13: error: request for member 'y2' in something not a structure or union

         area.y2 = (indev->act_point.y >> LV_ANTIALIAS) + ((LV_INDEV_POINT_MARKER >> 1) | 0x1);

             ^

C:\Users\Ramon\Documents\Arduino\libraries\lvgl\src\lv_obj\lv_indev.c:291:18: warning: passing argument 1 of 'lv_rfill' from incompatible pointer type [-Wincompatible-pointer-types]

         lv_rfill(&area, NULL, LV_COLOR_MAKE(0xFF, 0, 0), LV_OPA_COVER);

                  ^

In file included from C:\Users\Ramon\Documents\Arduino\libraries\lvgl\src\lv_obj\lv_indev.c:16:0:

c:\users\ramon\documents\arduino\libraries\lvgl\src\lv_draw\lv_draw_rbasic.h:41:6: note: expected 'const lv_area_t * {aka const struct <anonymous> *}' but argument is of type 'int *'

 void lv_rfill(const lv_area_t * cords_p, const lv_area_t * mask_p,

      ^


Cannot build without FS interface

If I disable file system interface
USE_FSINT = 0

I am not able to build at all. So its not modular as such. Don't you think functions like:
lv_img_create_file should be protected with flags like

#if USE_FSINT && USE_UFS

password field not being updated correctly when lv_ta_del called

There looks to be an issue with a password text area field. The following:

lv_obj_t *pin_inp = lv_ta_create(lv_scr_act(), NULL);
 lv_ta_set_one_line(pin_inp, true);
 lv_ta_set_cursor_show(pin_inp, true);
 lv_ta_set_pwd_mode(pin_inp, true);
 lv_ta_set_text(pin_inp, "");
 lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
 lv_ta_add_char(pin_inp, '1');
 lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
 lv_ta_del(pin_inp);
 lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
 lv_ta_add_char(pin_inp, '2');
 char buff[3];
 strcpy(buff, lv_ta_get_txt(pin_inp));

Will leave "21" in buff instead of "2"

Using input widgets without a toutchscreen

Hi,

I would like to use the library on a system with just a clickable rotary encoder as an input device. How can I accomplish that since the library doesn't seem to have the active widget state?

i.e. rotate the encoder changes the active button (or list item or whatever) and clicking on it sends a "click" to the active widget.

Bigger free_num for lv_obj_t?

At present I'm using the free_num in the returned object to add an index on listview items but envisage that there will be more than 1000 items. Would it be possible to add a free_word or is there a better way to store the index values?

Confuse of memory defining

  1. LV_MEM_SIZE
    This is for LVGL working needed, there are lots of dynamic ram to be allocated.

  2. LV_VDB_SIZE, LV_VDB_ADR
    I use RGB interface in my stm32f4, so this memory is my display area. The screen will change immediately as I change something in this area.

  3. LV_VDB_DOUBLE, LV_VDB2_ADR
    The same as VDB, another parellel memory for double buffering. When I operate VDB1, LCD controller will fetch from VDB2, and swap in next cycle.

Is that right?

Suggestion: Move application out of lvgl

It is a small suggestion to keep library clean and independent. Is it possible to move lv_app/lv_appx out of lvgl source as they are not part of library as such. May it can be moved to a new repo just like hal/misc etc. This way lvgl as a source will have no code that may or may not be usable to others. One can always close the lvapp repo if he/she needs.

Multitouch Support

Some LCD display with capacitive touch have multi touch capability.

like for STM32, commonly typedef struct used is like this :

typedef struct
{
uint8_t touchDetected; /*!< Total number of active touches detected at last scan /
uint16_t touchX[TS_MAX_NB_TOUCH]; /
!< Touch X[0], X[1] coordinates on 12 bits /
uint16_t touchY[TS_MAX_NB_TOUCH]; /
!< Touch Y[0], Y[1] coordinates on 12 bits */

#if (TS_MULTI_TOUCH_SUPPORTED == 1)
uint8_t touchWeight[TS_MAX_NB_TOUCH]; /*!< Touch_Weight[0], Touch_Weight[1] : weight property of touches /
uint8_t touchEventId[TS_MAX_NB_TOUCH]; /
!< Touch_EventId[0], Touch_EventId[1] : take value of type @ref TS_TouchEventTypeDef /
uint8_t touchArea[TS_MAX_NB_TOUCH]; /
!< Touch_Area[0], Touch_Area[1] : touch area of each touch /
uint32_t gestureId; /
!< type of gesture detected : take value of type @ref TS_GestureIdTypeDef /
#endif /
TS_MULTI_TOUCH_SUPPORTED == 1 */

} TS_StateTypeDef;

So it's good if multi touch capability can be implemented in lvgl.

Cursor Style

Would it be possible to add additional cursor style?

for example:

  • block style
    block
  • block-outline style
    block-outline
  • underline style
    underline

Thank you!

Cursor disapear on one-line mode

  1. set a non-empty string without newline to lv_ta.
  2. enable lv_ta_set_one_line
  3. take lv_ta_cursor_right to move cursor from left to right .
  4. cursor will disappear once it reach the right-most character.

lv_ta password issue

The following code should leave "1234" in buff but actually leaves "***4":

lv_obj_t *pin_inp = lv_ta_create(lv_scr_act(), NULL);
lv_ta_set_one_line(pin_inp, true);
lv_ta_set_pwd_mode(pin_inp, true);
lv_ta_set_text(pin_inp, "");
lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
lv_ta_add_char(pin_inp, '1');
lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
lv_ta_add_char(pin_inp, '2');
lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
lv_ta_add_char(pin_inp, '3');
lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
lv_ta_add_char(pin_inp, '5');
lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
lv_ta_del(pin_inp);
lv_ta_set_cursor_pos(pin_inp, LV_TA_CUR_LAST);
lv_ta_add_char(pin_inp, '4');
char buff[5];
strcpy(buff, lv_ta_get_txt(pin_inp));

Symbol font update

I've optimized the font storage to use less memory.
@ajaybhargav please generate the symbol fonts again with the new python script: https://github.com/littlevgl/utils/blob/beta/font_create/fnt2c.py

Usage:
python fnt2c.py -f <font_name> [-o <output file> -s <start unicode> -e <end unicide>]

Or see python fnt2c.py -h for a detailed explanation.

If you have no time right now to deal with it just send me the fnt and png files and I will do this.

Thank you in advance!

Support for non-blocking display interface functions

First of all, great lib!

On most microcontrollers, copying the data from the memory to the display can be handled by a DMA controller or timers. If such method is used, the CPU is not utilized during data transfer to the display. So the CPU can perform other tasks, like rendering the next part of the screen.

In virtual drawing mode this can speedup the GUI a lot. Instead of one buffer, use two buffers. While the first buffer is being transferred to the screen by the DMA controller, the second buffer is filled by the CPU.

What do you think?
What needs to be changed in the lib to support this? At least the blocking interface API functions need to be changed.

Question about text area

I'm trying to use a text area which is one_line and pwd_mode both set true. Using lv_ta_set_cursor_pos LV_TA_CUR_LAST and lv_ta_add_char to append characters shows them on the screen before they are replaced by '*'. However, when I use lv_ta_get_txt I get 'Text area' returned and if I use lv_label_get_text I get an empty string. If I also use lv_label_append_text then I am able to get the text back that I would expect. Wouldn't it better to have lv_ta_get_txt return the contents of the text area or have I misunderstood how this works?

Is it possible to set z-order of objects?

I have the following sequence of events: Create list full width of screen -> create smaller list -> create screen 2 which covers the physical screen -> delete full width screen list -> delete screen 2. Now the smaller is list is below the full width list. I can see why this is happening (order based on creation time) but I wondered if it is possible within the existing code to change the order so that the smaller list always stays on top of the full width list?

New object Gauge

Is it possible to add a gauge object, similar operation to that or chart/progress bar maybe. Gauges looks great on displays and make it look more intuitive.

Improvement in memory management

If a system already provide malloc/free functions then there is no need to use misc/mem module. This will save lot of code space. You can move memory management to HAL instead so people can either write their own dm_* functions or enable USE_DYN* flag if system does not have malloc/free function.

Create a separate dm_mem.h file to define only the function prototypes of needed functions:

dm_init()
dm_alloc()
dm_free()
dm_realloc()

Regarding VDB and display update

I dont know how VDB is linked to objects, it seems display area is recreated on VDB everytime display needs to be updated (right?). I have gone through lv_refr.c and found that vdb is filled there and then flushed on to display row by row. Somehow this makes display update slower and one can see line by line update like raster scan. I was thinking it would be great if there is a way VDB gets filled first and then sent to display routine to flush it at once. Smaller VDB size makes it even worse. I am not taking about VDB=0 as its not good at all.

New object types in next release - ideas, suggestions, reviews

In the next release (v4.3.0) I'm planning to add new smart phone like object types.
I thought about the following types:

  • lv_split a hor. or ver. line for decoration purpose
  • lv_valset a label with "+" and "-" buttons
  • lv_tabview organise content with tabs (support swipe left/right)
  • lv_btngrp display more buttons to choose an option from them
  • lv_switch turn on/off by tap (a little slider)
  • lv_roller roller to select a value (like on smartphones)

If you have any new idea or suggestion don't hesitate to write a comment!

Sorted data in list

Would it be possible to add a sort function to the lv_list_add function or create a new lv_list_add_sorted function?

Possible issue with buttons

Using default style for container and buttons (each button has its own object):

Before pressing "1":
before

After pressing "1":
after

Note corner "decorations" which appear after pressing

Avoid abbreviations in API?

The next release will be a major release therefore it is possible to update API.
The question is: is it good to abbreviate in API function's name or not?
For example:

Current Idea
lv_obj_set_pos() lv_object_set_position()
lv_btn_set_state() lv_button_get_state()
lv_ddlist_set_options() lv_dropdownlist_set_options()
lv_ta_set_cursor_pos() lv_textarea_set_cursor_position()

The not abbreviated names are more descriptive but takes more time to write and read.
What's worth more? What is you opinion?

About Text area (lv_ta) style

I have some question about lv_ta on website's document

  1. text style

    http://www.gl.littlev.hu/object-types/text-area-lv_ta

    Style usage

    • ...
    • Text style is inherited from the parent page.

    Dose the "parent page" mean lv_ta's parent must be a lv_page object?
    But it seems that the text style can be accessed from label member in lv_ta.

  2. cursor style

    Style usage

    • ...
    • Cursor width and color comes from the parent's ccolor and line_width style properties.

    I try to create a lv_con as the parent of lv_ta, then change its ccolor and line_width, but it doesn't apply to cursor.

Thank you!

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.