lvgl/docs/README.md

# Littlev Graphics Libraray

![LittlevGL cover](http://www.gl.littlev.hu/home/main_cover_small.png)

Littlev Graphics Library provides everithing you need to add graphical user interface to your embedded stytem which meets the requirements in the 21th century.

Homepage: http://gl.littlev.hu

### Table Of Content
* [Key features](#key-features)
* [Porting](#porting)
  * [Tick interface](#tick-interface)
  * [Display interface](#display-interface)
  * [Input device interface](#input-device-interface)
* [Project set-up](#project-set-up)
* [PC simulator](#pc-simulator)
* [Contributing](#contributing)
* [Donate](#donate)

## Key features
- Everithing you need to build a GUI (buttons, charts, list, images etc)
- Animations, opacity, smooth scrolling, anti aliasing to impress your cutomers
- Multi language support with UTF-8 decoding
- Fully customizable appearance
- Scalable to operate with a few memory (80 kB flash, 10 kB RAM)
- Hardware independent to use with any MCU or display (TFT, LCD, monochrome)
- Touchpad, mouse, keyboard and external button support 
- Only a sinlge frame buffer required in internal RAM or in an external display conroller 
- OS, External memory or GPU suppoted but not required  
- Written in C for maximal compability
- PC simulator to develop without embedded hardware
- Tutorials, code exampes, style themes for rapid development
- Clear online documentation
- Advanced support, and professional GUI development service
- Free and open source

## Porting
### Tick interface
The LittlevGL uses a system tick. Your only task is to call `lv_tick_handler()` in every milliseconds in an interrupt.

### Display interface
To set up a diplay an `lv_disp_drv_t` variable has to be initialized:
```c
lv_disp_drv_t disp_drv;
lv_disp_drv_init(&disp_drv);           /*Basic initialization*/
disp_drv. ... = ...                    /*Initilaize the field here. See below.*/
disp_drv_register(&disp_drv);
```

You can configure the driver for different operation modes.

#### Using internal buffering (VDB)
The graphics library works with an internal buffering mechanism to create advances graphics features with only one frame buffer. The internal buffer is called VDB (Virtual Display Buffer) and its size can be adjusted in lv_conf.h.
When `LV_VDB_SIZE` not zero then the internal buffering is used and you have to provide a function which flushes the buffers content to your display:
```c
disp_drv.disp_flush = my_disp_flush;
```

In the flush function you can use DMA or any hardware to do the flushing in the background, but when the flushing is ready you **have to call `lv_flush_ready()`**

#### Using harware acceleration (GPU)
If your MCU supports graphical acceration (GPU) then you can use it in the following way. (Using GPU is totally optional)
The `mem_blend` and `mem_fill` fields of a display driver is used to interface with a GPU. 
```c
disp_drv.mem_blend = my_mem_blend;  /*Blends two color arrays using opacity*/
disp_drv.mem_fill = my_mem_fill;    /*Fills an array with a color*/ 
```

The GPU related functions can be used only if internal buffering (VDB) is enabled

#### Unbuffered drawing
It is possible to draw directly to a framebuffer when the internal buffeering is dispabled (LV_SDB_SIZE = 0).
```c
disp_drv.disp_fill = my_mem_blend;  /*fill an area in the frame buffer*/
disp_drv.disp_map = my_mem_fill;    /*copy a color_map (e.g. image) into the framebuffer*/
```

Keep in mind this way during refresh some artifacts can be visible because the layers are drawn after each other. And some high level graphics features like anti aliasing, opacity or shadows aren't available in this configuration. 

If you use an external display controller which supports accelerated filling (e.g. RA8876) then you can use this feature in `disp_fill`

### Input device interface
To set up an input device an `lv_indev_drv_t` variable has to be initialized:
```c    
lv_indev_drv_t indev_drv;
lv_indev_drv_init(&indev_drv);     /*Basic initialization*/
indev_drv.type = ...               /*See below.*/
indev_drv.read_fp = ...            /*See below.*/
lv_indev_register(&indev_drv);
```

The `type` can be `LV_INDEV_TYPE_POINTER` (e.g touchpad) or `LV_INDEV_TYPE_KEYPAD` (e.g. keyboard)
`read_fp` is a function pointer which will be called periodically to report the current state of an input device. It can also buffer data and return `false` when no more data te read ot `true` is the buffer is not empty.

#### Touchpad, mouse or any pointer
```c
indev_drv.type = LV_INDEV_TYPE_POINTER;
indev_drv.read_fp = my_input_read; 
```

The read function should look like this:
```c
bool my_input_read(lv_indev_data_t *data) {
    data->point.x = touchpad_x;
    data->point.y = touchpad_y;
    data->state = LV_INDEV_EVENT_PR or LV_INDEV_EVENT_REL;
    return false;  /*No buffering so no more data read*/
```

#### Keypad or keyboard
```c
indev_drv.type = LV_INDEV_TYPE_KEYPAD;
indev_drv.read_fp = my_input_read; 
```

The read function should look like this:
```c
bool keyboard_read(lv_indev_data_t *data) {
    if(key_pressed()) {
        data->state = LV_INDEV_EVENT_PR;
        data->key = get_key();
    } else {
        data->state = LV_INDEV_EVENT_REL;
        data->key = 0;
    }

    return false;   /*No buffering so no more data read*/
}
```

To use a keyboard:
 * `LV_OBJ_GROUP` has to be enabled in lv_conf.h 
 * An object goup has to be craeted: `lv_group_create()` and object has to be added: `lv_group_add_obj()`  
 * The create group has to be assigned to the input device: `lv_indev_set_group(my_indev, group1);` 
 * Use `LV_GROUP_KEY_...` to navigate among the objects in the group
 
## Project set-up
1. Clone or download the lvgl repository: `git clone -b dev-5.0 https://github.com/littlevgl/lvgl.git`
2. Create project with your prefered IDE and add the lvgl folder
3. Copy *lvgl/lv_conf_templ.h* as *lv_conf.h* next to the lvgl folder
4. In the *_conf.h files delete the first `#if 0` and its `#endif`. Let the default configurations at first.
5. In your *main.c*: #include "lvgl/lvgl.h"   
6. In your *main function*:
   * lvgl_init();
   * tick, display and input device initialization (see above)
7. To **test** create a label: `lv_obj_t * label = lv_label_create(lv_scr_act(), NULL);`  
8. In the main *while(1)* call `lv_task_handler();` and make a few milliseconds delay (e.g. `my_delay_ms(5);`) 
9. Compile the code and load it to your embedded hardware

## PC Simulator
If you don't have got an embedded hardware you can test the graphics library in a PC simulator. The simulator uses [SDL2](https://www.libsdl.org/) to emulate a display on your monitor and a touch pad with your mouse.

There is a pre-configured PC project for **Eclipse CDT** in this repository: https://github.com/littlevgl/proj_pc

## Contributing
See [CONTRIBUTING.md](https://github.com/littlevgl/lvgl/blob/master/docs/CONTRIBUTING.md)

## Donate
If you are pleased with the graphics library and found it useful please support its further development:

[![Donate](https://www.paypalobjects.com/en_US/i/btn/btn_donateCC_LG.gif)](https://www.paypal.com/cgi-bin/webscr?cmd=_s-xclick&hosted_button_id=GJV3SC5EHDANS)