1# Input devices 2 3An input device usually means: 4- Pointer-like input device like touchpad or mouse 5- Keypads like a normal keyboard or simple numeric keypad 6- Encoders with left/right turn and push options 7- External hardware buttons which are assigned to specific points on the screen 8 9 10``` important:: Before reading further, please read the [Porting](/porting/indev) section of Input devices 11``` 12 13## Pointers 14 15### Cursor 16 17Pointer input devices (like a mouse) can have a cursor. 18 19```c 20... 21lv_indev_t * mouse_indev = lv_indev_drv_register(&indev_drv); 22 23LV_IMG_DECLARE(mouse_cursor_icon); /*Declare the image source.*/ 24lv_obj_t * cursor_obj = lv_img_create(lv_scr_act()); /*Create an image object for the cursor */ 25lv_img_set_src(cursor_obj, &mouse_cursor_icon); /*Set the image source*/ 26lv_indev_set_cursor(mouse_indev, cursor_obj); /*Connect the image object to the driver*/ 27``` 28 29Note that the cursor object should have `lv_obj_clear_flag(cursor_obj, LV_OBJ_FLAG_CLICKABLE)`. 30For images, *clicking* is disabled by default. 31 32### Gestures 33Pointer input devices can detect basic gestures. By default, most of the widgets send the gestures to its parent, so finally the gestures can be detected on the screen object in a form of an `LV_EVENT_GESTURE` event. For example: 34 35```c 36void my_event(lv_event_t * e) 37{ 38 lv_obj_t * screen = lv_event_get_current_target(e); 39 lv_dir_t dir = lv_indev_get_gesture_dir(lv_indev_act()); 40 switch(dir) { 41 case LV_DIR_LEFT: 42 ... 43 break; 44 case LV_DIR_RIGHT: 45 ... 46 break; 47 case LV_DIR_TOP: 48 ... 49 break; 50 case LV_DIR_BOTTOM: 51 ... 52 break; 53 } 54} 55 56... 57 58lv_obj_add_event_cb(screen1, my_event, LV_EVENT_GESTURE, NULL); 59``` 60 61To prevent passing the gesture event to the parent from an object use `lv_obj_clear_flag(obj, LV_OBJ_FLAG_GESTURE_BUBBLE)`. 62 63Note that, gestures are not triggered if an object is being scrolled. 64 65If you did some action on a gesture you can call `lv_indev_wait_release(lv_indev_get_act())` in the event handler to prevent LVGL sending further input device related events. 66 67## Keypad and encoder 68 69You can fully control the user interface without a touchpad or mouse by using a keypad or encoder(s). It works similar to the *TAB* key on the PC to select an element in an application or a web page. 70 71### Groups 72 73Objects you want to control with a keypad or encoder need to be added to a *Group*. 74In every group there is exactly one focused object which receives the pressed keys or the encoder actions. 75For example, if a [Text area](/widgets/core/textarea) is focused and you press some letter on a keyboard, the keys will be sent and inserted into the text area. 76Similarly, if a [Slider](/widgets/core/slider) is focused and you press the left or right arrows, the slider's value will be changed. 77 78You need to associate an input device with a group. An input device can send key events to only one group but a group can receive data from more than one input device. 79 80To create a group use `lv_group_t * g = lv_group_create()` and to add an object to the group use `lv_group_add_obj(g, obj)`. 81 82To associate a group with an input device use `lv_indev_set_group(indev, g)`, where `indev` is the return value of `lv_indev_drv_register()` 83 84#### Keys 85There are some predefined keys which have special meaning: 86- **LV_KEY_NEXT** Focus on the next object 87- **LV_KEY_PREV** Focus on the previous object 88- **LV_KEY_ENTER** Triggers `LV_EVENT_PRESSED/CLICKED/LONG_PRESSED` etc. events 89- **LV_KEY_UP** Increase value or move upwards 90- **LV_KEY_DOWN** Decrease value or move downwards 91- **LV_KEY_RIGHT** Increase value or move to the right 92- **LV_KEY_LEFT** Decrease value or move to the left 93- **LV_KEY_ESC** Close or exit (E.g. close a [Drop down list](/widgets/core/dropdown)) 94- **LV_KEY_DEL** Delete (E.g. a character on the right in a [Text area](/widgets/core/textarea)) 95- **LV_KEY_BACKSPACE** Delete a character on the left (E.g. in a [Text area](/widgets/core/textarea)) 96- **LV_KEY_HOME** Go to the beginning/top (E.g. in a [Text area](/widgets/core/textarea)) 97- **LV_KEY_END** Go to the end (E.g. in a [Text area](/widgets/core/textarea)) 98 99The most important special keys are `LV_KEY_NEXT/PREV`, `LV_KEY_ENTER` and `LV_KEY_UP/DOWN/LEFT/RIGHT`. 100In your `read_cb` function, you should translate some of your keys to these special keys to support navigation in a group and interact with selected objects. 101 102Usually, it's enough to use only `LV_KEY_LEFT/RIGHT` because most objects can be fully controlled with them. 103 104With an encoder you should use only `LV_KEY_LEFT`, `LV_KEY_RIGHT`, and `LV_KEY_ENTER`. 105 106#### Edit and navigate mode 107 108Since a keypad has plenty of keys, it's easy to navigate between objects and edit them using the keypad. But encoders have a limited number of "keys" and hence it is difficult to navigate using the default options. *Navigate* and *Edit* modes are used to avoid this problem with encoders. 109 110In *Navigate* mode, an encoder's `LV_KEY_LEFT/RIGHT` is translated to `LV_KEY_NEXT/PREV`. Therefore, the next or previous object will be selected by turning the encoder. 111Pressing `LV_KEY_ENTER` will change to *Edit* mode. 112 113In *Edit* mode, `LV_KEY_NEXT/PREV` is usually used to modify an object. 114Depending on the object's type, a short or long press of `LV_KEY_ENTER` changes back to *Navigate* mode. 115Usually, an object which cannot be pressed (like a [Slider](/widgets/core/slider)) leaves *Edit* mode upon a short click. But with objects where a short click has meaning (e.g. [Button](/widgets/core/btn)), a long press is required. 116 117#### Default group 118Interactive widgets - such as buttons, checkboxes, sliders, etc. - can be automatically added to a default group. 119Just create a group with `lv_group_t * g = lv_group_create();` and set the default group with `lv_group_set_default(g);` 120 121Don't forget to assign one or more input devices to the default group with ` lv_indev_set_group(my_indev, g);`. 122 123### Styling 124 125If an object is focused either by clicking it via touchpad or focused via an encoder or keypad it goes to the `LV_STATE_FOCUSED` state. Hence, focused styles will be applied to it. 126 127If an object switches to edit mode it enters the `LV_STATE_FOCUSED | LV_STATE_EDITED` states so these style properties will be shown. 128 129For a more detailed description read the [Style](https://docs.lvgl.io/v7/en/html/overview/style.html) section. 130 131## API 132 133 134### Input device 135 136```eval_rst 137 138.. doxygenfile:: lv_indev.h 139 :project: lvgl 140 141``` 142 143### Groups 144 145```eval_rst 146 147.. doxygenfile:: lv_group.h 148 :project: lvgl 149 150``` 151