init lvgl code
This commit is contained in:
113
LVGL.Simulator/lvgl/docs/widgets/core/arc.md
Normal file
113
LVGL.Simulator/lvgl/docs/widgets/core/arc.md
Normal file
@@ -0,0 +1,113 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/arc.md
|
||||
```
|
||||
# Arc (lv_arc)
|
||||
|
||||
## Overview
|
||||
|
||||
The Arc consists of a background and a foreground arc. The foreground (indicator) can be touch-adjusted.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` Draws a background using the typical background style properties and an arc using the arc style properties. The arc's size and position will respect the *padding* style properties.
|
||||
- `LV_PART_INDICATOR` Draws another arc using the *arc* style properties. Its padding values are interpreted relative to the background arc.
|
||||
- `LV_PART_KNOB` Draws a handle on the end of the indicator using all background properties and padding values. With zero padding the knob size is the same as the indicator's width.
|
||||
Larger padding makes it larger, smaller padding makes it smaller.
|
||||
|
||||
## Usage
|
||||
|
||||
### Value and range
|
||||
|
||||
A new value can be set using `lv_arc_set_value(arc, new_value)`.
|
||||
The value is interpreted in a range (minimum and maximum values) which can be modified with `lv_arc_set_range(arc, min, max)`.
|
||||
The default range is 0..100.
|
||||
|
||||
The indicator arc is drawn on the main part's arc. This if the value is set to maximum the indicator arc will cover the entire "background" arc.
|
||||
To set the start and end angle of the background arc use the `lv_arc_set_bg_angles(arc, start_angle, end_angle)` functions or `lv_arc_set_bg_start/end_angle(arc, angle)`.
|
||||
|
||||
Zero degrees is at the middle right (3 o'clock) of the object and the degrees are increasing in clockwise direction.
|
||||
The angles should be in the [0;360] range.
|
||||
|
||||
### Rotation
|
||||
|
||||
An offset to the 0 degree position can be added with `lv_arc_set_rotation(arc, deg)`.
|
||||
|
||||
### Mode
|
||||
|
||||
The arc can be one of the following modes:
|
||||
- `LV_ARC_MODE_NORMAL` The indicator arc is drawn from the minimum value to the current.
|
||||
- `LV_ARC_MODE_REVERSE` The indicator arc is drawn counter-clockwise from the maximum value to the current.
|
||||
- `LV_ARC_MODE_SYMMETRICAL` The indicator arc is drawn from the middle point to the current value.
|
||||
|
||||
The mode can be set by `lv_arc_set_mode(arc, LV_ARC_MODE_...)` and used only if the angle is set by `lv_arc_set_value()` or the arc is adjusted by finger.
|
||||
|
||||
### Change rate
|
||||
If the arc is pressed the current value will set with a limited speed according to the set *change rate*.
|
||||
The change rate is defined in degree/second unit and can be set with `lv_arc_set_change_rage(arc, rate)`
|
||||
|
||||
|
||||
### Setting the indicator manually
|
||||
It's also possible to set the angles of the indicator arc directly with `lv_arc_set_angles(arc, start_angle, end_angle)` function or `lv_arc_set_start/end_angle(arc, start_angle)`.
|
||||
In this case the set "value" and "mode" are ignored.
|
||||
|
||||
In other words, the angle and value settings are independent. You should exclusively use one or the other. Mixing the two might result in unintended behavior.
|
||||
|
||||
To make the arc non-adjustable, remove the style of the knob and make the object non-clickable:
|
||||
```c
|
||||
lv_obj_remove_style(arc, NULL, LV_PART_KNOB);
|
||||
lv_obj_clear_flag(arc, LV_OBJ_FLAG_CLICKABLE);
|
||||
```
|
||||
|
||||
### Advanced hit test
|
||||
|
||||
If the `LV_OBJ_FLAG_ADV_HITTEST` flag is enabled the arc can be clicked through in the middle. Clicks are recognized only on the ring of the background arc. `lv_obj_set_ext_click_size()` makes the sensitive area larger inside and outside with the given number of pixels.
|
||||
|
||||
|
||||
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` sent when the arc is pressed/dragged to set a new value.
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` are sent with the following types:
|
||||
- `LV_ARC_DRAW_PART_BACKGROUND` The background arc.
|
||||
- `part`: `LV_PART_MAIN`
|
||||
- `p1`: center of the arc
|
||||
- `radius`: radius of the arc
|
||||
- `arc_dsc`
|
||||
- `LV_ARC_DRAW_PART_FOREGROUND` The foreground arc.
|
||||
- `part`: `LV_PART_INDICATOR`
|
||||
- `p1`: center of the arc
|
||||
- `radius`: radius of the arc
|
||||
- `arc_dsc`
|
||||
- LV_ARC_DRAW_PART_KNOB The knob
|
||||
- `part`: `LV_PART_KNOB`
|
||||
- `draw_area`: the area of the knob
|
||||
- `rect_dsc`:
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_RIGHT/UP` Increases the value by one.
|
||||
- `LV_KEY_LEFT/DOWN` Decreases the value by one.
|
||||
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/arc/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_arc.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
66
LVGL.Simulator/lvgl/docs/widgets/core/bar.md
Normal file
66
LVGL.Simulator/lvgl/docs/widgets/core/bar.md
Normal file
@@ -0,0 +1,66 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/bar.md
|
||||
```
|
||||
# Bar (lv_bar)
|
||||
|
||||
## Overview
|
||||
|
||||
The bar object has a background and an indicator on it. The width of the indicator is set according to the current value of the bar.
|
||||
|
||||
Vertical bars can be created if the width of the object is smaller than its height.
|
||||
|
||||
Not only the end, but also the start value of the bar can be set, which changes the start position of the indicator.
|
||||
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the bar and it uses the typical background style properties. Adding padding makes the indicator smaller or larger. The `anim_time` style property sets the animation time if the values set with `LV_ANIM_ON`.
|
||||
- `LV_PART_INDICATOR` The indicator itself; also uses all the typical background properties.
|
||||
|
||||
## Usage
|
||||
|
||||
### Value and range
|
||||
A new value can be set by `lv_bar_set_value(bar, new_value, LV_ANIM_ON/OFF)`.
|
||||
The value is interpreted in a range (minimum and maximum values) which can be modified with `lv_bar_set_range(bar, min, max)`.
|
||||
The default range is 0..100.
|
||||
|
||||
The new value in `lv_bar_set_value` can be set with or without an animation depending on the last parameter (`LV_ANIM_ON/OFF`).
|
||||
|
||||
### Modes
|
||||
The bar can be one of the following modes:
|
||||
- `LV_BAR_MODE_NORMAL` A normal bar as described above
|
||||
- `LV_BAR_MODE_SYMMETRICAL` Draw the indicator from the zero value to current value. Requires a negative minimum range and positive maximum range.
|
||||
- `LV_BAR_MODE_RANGE` Allows setting the start value too by `lv_bar_set_start_value(bar, new_value, LV_ANIM_ON/OFF)`. The start value always has to be smaller than the end value.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` are sent for the following parts:
|
||||
- `LV_BAR_DRAW_PART_INDICATOR` The indicator of the bar
|
||||
- `part`: `LV_PART_INDICATOR`
|
||||
- `draw_area`: area of the indicator
|
||||
- `rect_dsc`
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/bar/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_bar.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
50
LVGL.Simulator/lvgl/docs/widgets/core/btn.md
Normal file
50
LVGL.Simulator/lvgl/docs/widgets/core/btn.md
Normal file
@@ -0,0 +1,50 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/btn.md
|
||||
```
|
||||
# Button (lv_btn)
|
||||
|
||||
## Overview
|
||||
|
||||
Buttons have no new features compared to the [Base object](/widgets/obj). They are useful for semantic purposes and have slightly different default settings.
|
||||
|
||||
Buttons, by default, differ from Base object in the following ways:
|
||||
- Not scrollable
|
||||
- Added to the default group
|
||||
- Default height and width set to `LV_SIZE_CONTENT`
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the button. Uses the typical background style properties.
|
||||
|
||||
## Usage
|
||||
|
||||
There are no new features compared to [Base object](/widgets/obj).
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` when the `LV_OBJ_FLAG_CHECKABLE` flag is enabled and the object is clicked. The event happens on transition to/from the checked state.
|
||||
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
Note that the state of `LV_KEY_ENTER` is translated to `LV_EVENT_PRESSED/PRESSING/RELEASED` etc.
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/btn/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_btn.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
99
LVGL.Simulator/lvgl/docs/widgets/core/btnmatrix.md
Normal file
99
LVGL.Simulator/lvgl/docs/widgets/core/btnmatrix.md
Normal file
@@ -0,0 +1,99 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/btnmatrix.md
|
||||
```
|
||||
# Button matrix (lv_btnmatrix)
|
||||
|
||||
## Overview
|
||||
|
||||
The Button Matrix object is a lightweight way to display multiple buttons in rows and columns. Lightweight because the buttons are not actually created but just virtually drawn on the fly. This way, one button use only eight extra bytes of memory instead of the ~100-150 bytes a normal [Button](/widgets/core/btn) object plus the 100 or so bytes for the [Label](/widgets/core/label) object.
|
||||
|
||||
The Button matrix is added to the default group (if one is set). Besides the Button matrix is an editable object to allow selecting and clicking the buttons with encoder navigation too.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the button matrix, uses the typical background style properties. `pad_row` and `pad_column` sets the space between the buttons.
|
||||
- `LV_PART_ITEMS` The buttons all use the text and typical background style properties except translations and transformations.
|
||||
|
||||
## Usage
|
||||
|
||||
### Button's text
|
||||
There is a text on each button. To specify them a descriptor string array, called *map*, needs to be used.
|
||||
The map can be set with `lv_btnmatrix_set_map(btnm, my_map)`.
|
||||
The declaration of a map should look like `const char * map[] = {"btn1", "btn2", "btn3", NULL}`.
|
||||
Note that the last element has to be either `NULL` or an empty string (`""`)!
|
||||
|
||||
Use `"\n"` in the map to insert a **line break**. E.g. `{"btn1", "btn2", "\n", "btn3", ""}`. Each line's buttons have their width calculated automatically.
|
||||
So in the example the first row will have 2 buttons each with 50% width and a second row with 1 button having 100% width.
|
||||
|
||||
### Control buttons
|
||||
The buttons' width can be set relative to the other button in the same row with `lv_btnmatrix_set_btn_width(btnm, btn_id, width)`
|
||||
E.g. in a line with two buttons: *btnA, width = 1* and *btnB, width = 2*, *btnA* will have 33 % width and *btnB* will have 66 % width.
|
||||
It's similar to how the [`flex-grow`](https://developer.mozilla.org/en-US/docs/Web/CSS/flex-grow) property works in CSS.
|
||||
The width must be in the \[1..7\] range and the default width is 1.
|
||||
|
||||
In addition to the width, each button can be customized with the following parameters:
|
||||
- `LV_BTNMATRIX_CTRL_HIDDEN` Makes a button hidden (hidden buttons still take up space in the layout, they are just not visible or clickable)
|
||||
- `LV_BTNMATRIX_CTRL_NO_REPEAT` Disable repeating when the button is long pressed
|
||||
- `LV_BTNMATRIX_CTRL_DISABLED` Makes a button disabled Like `LV_STATE_DISABLED` on normal objects
|
||||
- `LV_BTNMATRIX_CTRL_CHECKABLE` Enable toggling of a button. I.e. `LV_STATE_CHECHED` will be added/removed as the button is clicked
|
||||
- `LV_BTNMATRIX_CTRL_CHECKED` Make the button checked. It will use the `LV_STATE_CHECHKED` styles.
|
||||
- `LV_BTNMATRIX_CTRL_CLICK_TRIG` Enabled: send LV_EVENT_VALUE_CHANGE on CLICK, Disabled: send LV_EVENT_VALUE_CHANGE on PRESS
|
||||
- `LV_BTNMATRIX_CTRL_POPOVER` Show the button label in a popover when pressing this key
|
||||
- `LV_BTNMATRIX_CTRL_RECOLOR` Enable recoloring of button texts with `#`. E.g. `"It's #ff0000 red#"`
|
||||
- `LV_BTNMATRIX_CTRL_CUSTOM_1` Custom free to use flag
|
||||
- `LV_BTNMATRIX_CTRL_CUSTOM_2` Custom free to use flag
|
||||
|
||||
By default, all flags are disabled.
|
||||
|
||||
To set or clear a button's control attribute, use `lv_btnmatrix_set_btn_ctrl(btnm, btn_id, LV_BTNM_CTRL_...)` and
|
||||
`lv_btnmatrix_clear_btn_ctrl(btnm, btn_id, LV_BTNMATRIX_CTRL_...)` respectively. More `LV_BTNM_CTRL_...` values can be OR-ed
|
||||
|
||||
To set/clear the same control attribute for all buttons of a button matrix, use `lv_btnmatrix_set_btn_ctrl_all(btnm, LV_BTNM_CTRL_...)` and
|
||||
`lv_btnmatrix_clear_btn_ctrl_all(btnm, LV_BTNMATRIX_CTRL_...)`.
|
||||
|
||||
The set a control map for a button matrix (similarly to the map for the text), use `lv_btnmatrix_set_ctrl_map(btnm, ctrl_map)`.
|
||||
An element of `ctrl_map` should look like `ctrl_map[0] = width | LV_BTNM_CTRL_NO_REPEAT | LV_BTNM_CTRL_CHECHKABLE`.
|
||||
The number of elements should be equal to the number of buttons (excluding newlines characters).
|
||||
|
||||
### One check
|
||||
The "One check" feature can be enabled with `lv_btnmatrix_set_one_checked(btnm, true)` to allow only one button to be checked at a time.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when a button is pressed/released or repeated after long press. The event parameter is set to the ID of the pressed/released button.
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` are sent for the following types:
|
||||
- `LV_BTNMATRIX_DRAW_PART_BTN` The individual buttons.
|
||||
- `part`: `LV_PART_ITEMS`
|
||||
- `id`:index of the button being drawn
|
||||
- `draw_area`: the area of teh button
|
||||
- `rect_dsc`
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
`lv_btnmatrix_get_selected_btn(btnm)` returns the index of the most recently released or focused button or `LV_BTNMATRIX_BTN_NONE` if no such button.
|
||||
|
||||
`lv_btnmatrix_get_btn_text(btnm, btn_id)` returns a pointer to the text of `btn_id`th button.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_RIGHT/UP/LEFT/RIGHT` To navigate among the buttons to select one
|
||||
- `LV_KEY_ENTER` To press/release the selected button
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/btnmatrix/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_btnmatrix.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
107
LVGL.Simulator/lvgl/docs/widgets/core/canvas.md
Normal file
107
LVGL.Simulator/lvgl/docs/widgets/core/canvas.md
Normal file
@@ -0,0 +1,107 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/canvas.md
|
||||
```
|
||||
# Canvas (lv_canvas)
|
||||
|
||||
|
||||
## Overview
|
||||
|
||||
A Canvas inherits from [Image](/widgets/core/img) where the user can draw anything.
|
||||
Rectangles, texts, images, lines, arcs can be drawn here using lvgl's drawing engine.
|
||||
Additionally "effects" can be applied, such as rotation, zoom and blur.
|
||||
|
||||
|
||||
## Parts and Styles
|
||||
`LV_PART_MAIN` Uses the typical rectangle style properties and image style properties.
|
||||
|
||||
## Usage
|
||||
|
||||
### Buffer
|
||||
The Canvas needs a buffer in which stores the drawn image.
|
||||
To assign a buffer to a Canvas, use `lv_canvas_set_buffer(canvas, buffer, width, height, LV_IMG_CF_...)`.
|
||||
Where `buffer` is a static buffer (not just a local variable) to hold the image of the canvas.
|
||||
For example,
|
||||
`static lv_color_t buffer[LV_CANVAS_BUF_SIZE_TRUE_COLOR(width, height)]`.
|
||||
`LV_CANVAS_BUF_SIZE_...` macros help to determine the size of the buffer with different color formats.
|
||||
|
||||
The canvas supports all the built-in color formats like `LV_IMG_CF_TRUE_COLOR` or `LV_IMG_CF_INDEXED_2BIT`.
|
||||
See the full list in the [Color formats](/overview/image.html#color-formats) section.
|
||||
|
||||
### Indexed colors
|
||||
For `LV_IMG_CF_INDEXED_1/2/4/8` color formats a palette needs to be
|
||||
initialized with `lv_canvas_set_palette(canvas, 3, LV_COLOR_RED)`. It sets pixels with *index=3* to red.
|
||||
|
||||
### Drawing
|
||||
To set a pixel's color on the canvas, use `lv_canvas_set_px_color(canvas, x, y, LV_COLOR_RED)`.
|
||||
With `LV_IMG_CF_INDEXED_...` the index of the color needs to be passed as color.
|
||||
E.g. `lv_color_t c; c.full = 3;`
|
||||
|
||||
To set a pixel's opacity with `LV_IMG_CF_TRUE_COLOR_ALPHA` or `LV_IMG_CF_ALPHA_...` format on the canvas, use `lv_canvas_set_px_opa(canvas, x, y, opa)`.
|
||||
|
||||
|
||||
`lv_canvas_fill_bg(canvas, LV_COLOR_BLUE, LV_OPA_50)` fills the whole canvas to blue with 50% opacity. Note that if the current color format doesn't support colors (e.g. `LV_IMG_CF_ALPHA_2BIT`) the color will be ignored.
|
||||
Similarly, if opacity is not supported (e.g. `LV_IMG_CF_TRUE_COLOR`) it will be ignored.
|
||||
|
||||
An array of pixels can be copied to the canvas with `lv_canvas_copy_buf(canvas, buffer_to_copy, x, y, width, height)`.
|
||||
The color format of the buffer and the canvas need to match.
|
||||
|
||||
To draw something to the canvas use
|
||||
- `lv_canvas_draw_rect(canvas, x, y, width, heigth, &draw_dsc)`
|
||||
- `lv_canvas_draw_text(canvas, x, y, max_width, &draw_dsc, txt)`
|
||||
- `lv_canvas_draw_img(canvas, x, y, &img_src, &draw_dsc)`
|
||||
- `lv_canvas_draw_line(canvas, point_array, point_cnt, &draw_dsc)`
|
||||
- `lv_canvas_draw_polygon(canvas, points_array, point_cnt, &draw_dsc)`
|
||||
- `lv_canvas_draw_arc(canvas, x, y, radius, start_angle, end_angle, &draw_dsc)`
|
||||
|
||||
`draw_dsc` is a `lv_draw_rect/label/img/line/arc_dsc_t` variable which should be first initialized with one of `lv_draw_rect/label/img/line/arc_dsc_init()` and then modified with the desired colors and other values.
|
||||
|
||||
The draw function can draw to any color format. For example, it's possible to draw a text to an `LV_IMG_VF_ALPHA_8BIT` canvas and use the result image as a [draw mask](/overview/drawing) later.
|
||||
|
||||
### Transformations
|
||||
`lv_canvas_transform()` can be used to rotate and/or scale the image of an image and store the result on the canvas.
|
||||
The function needs the following parameters:
|
||||
- `canvas` pointer to a canvas object to store the result of the transformation.
|
||||
- `img pointer` to an image descriptor to transform. Can be the image descriptor of another canvas too (`lv_canvas_get_img()`).
|
||||
- `angle` the angle of rotation (0..3600), 0.1 deg resolution
|
||||
- `zoom` zoom factor (256: no zoom, 512: double size, 128: half size);
|
||||
- `offset_x` offset X to tell where to put the result data on destination canvas
|
||||
- `offset_y` offset X to tell where to put the result data on destination canvas
|
||||
- `pivot_x` pivot X of rotation. Relative to the source canvas. Set to `source width / 2` to rotate around the center
|
||||
- `pivot_y` pivot Y of rotation. Relative to the source canvas. Set to `source height / 2` to rotate around the center
|
||||
- `antialias` true: apply anti-aliasing during the transformation. Looks better but slower.
|
||||
|
||||
Note that a canvas can't be rotated on itself. You need a source and destination canvas or image.
|
||||
|
||||
### Blur
|
||||
A given area of the canvas can be blurred horizontally with `lv_canvas_blur_hor(canvas, &area, r)` or vertically with `lv_canvas_blur_ver(canvas, &area, r)`.
|
||||
`r` is the radius of the blur (greater value means more intensive burring). `area` is the area where the blur should be applied (interpreted relative to the canvas).
|
||||
|
||||
## Events
|
||||
No special events are sent by canvas objects.
|
||||
The same events are sent as for the
|
||||
|
||||
See the events of the [Images](/widgets/core/img) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/canvas/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_canvas.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
76
LVGL.Simulator/lvgl/docs/widgets/core/checkbox.md
Normal file
76
LVGL.Simulator/lvgl/docs/widgets/core/checkbox.md
Normal file
@@ -0,0 +1,76 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/checkbox.md
|
||||
```
|
||||
# Checkbox (lv_checkbox)
|
||||
|
||||
|
||||
## Overview
|
||||
|
||||
The Checkbox object is created from a "tick box" and a label. When the Checkbox is clicked the tick box is toggled.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The is the background of the Checkbox and it uses the text and all the typical background style properties.
|
||||
`pad_column` adjusts the spacing between the tickbox and the label
|
||||
- `LV_PART_INDICATOR` The "tick box" is a square that uses all the typical background style properties.
|
||||
By default, its size is equal to the height of the main part's font. Padding properties make the tick box larger in the respective directions.
|
||||
|
||||
The Checkbox is added to the default group (if it is set).
|
||||
|
||||
## Usage
|
||||
|
||||
|
||||
### Text
|
||||
The text can be modified with the `lv_checkbox_set_text(cb, "New text")` function and will be dynamically allocated.
|
||||
|
||||
To set a static text,
|
||||
use `lv_checkbox_set_static_text(cb, txt)`. This way, only a pointer to `txt` will be stored. The text then shouldn't be deallocated while the checkbox exists.
|
||||
|
||||
### Check, uncheck, disable
|
||||
You can manually check, un-check, and disable the Checkbox by using the common state add/clear function:
|
||||
```c
|
||||
lv_obj_add_state(cb, LV_STATE_CHECKED); /*Make the chekbox checked*/
|
||||
lv_obj_clear_state(cb, LV_STATE_CHECKED); /*MAke the checkbox unchecked*/
|
||||
lv_obj_add_state(cb, LV_STATE_CHECKED | LV_STATE_DISABLED); /*Make the checkbox checked and disabled*/
|
||||
```
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when the checkbox is toggled.
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` are sent for the following types:
|
||||
- `LV_CHECKBOX_DRAW_PART_BOX` The tickbox of the checkbox
|
||||
- `part`: `LV_PART_INDICATOR`
|
||||
- `draw_area`: the area of the tickbox
|
||||
- `rect_dsc`
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
|
||||
## Keys
|
||||
The following *Keys* are processed by the 'Buttons':
|
||||
- `LV_KEY_RIGHT/UP` Go to toggled state if toggling is enabled
|
||||
- `LV_KEY_LEFT/DOWN` Go to non-toggled state if toggling is enabled
|
||||
- `LV_KEY_ENTER` Clicks the checkbox and toggles it
|
||||
|
||||
Note that, as usual, the state of `LV_KEY_ENTER` is translated to `LV_EVENT_PRESSED/PRESSING/RELEASED` etc.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/checkbox/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_checkbox.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
109
LVGL.Simulator/lvgl/docs/widgets/core/dropdown.md
Normal file
109
LVGL.Simulator/lvgl/docs/widgets/core/dropdown.md
Normal file
@@ -0,0 +1,109 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/dropdown.md
|
||||
```
|
||||
# Drop-down list (lv_dropdown)
|
||||
|
||||
|
||||
## Overview
|
||||
|
||||
The drop-down list allows the user to select one value from a list.
|
||||
|
||||
The drop-down list is closed by default and displays a single value or a predefined text.
|
||||
When activated (by click on the drop-down list), a list is created from which the user may select one option.
|
||||
When the user selects a new value, the list is deleted again.
|
||||
|
||||
The Drop-down list is added to the default group (if it is set). Besides the Drop-down list is an editable object to allow selecting an option with encoder navigation too.
|
||||
|
||||
## Parts and Styles
|
||||
The Dropdown widget is built from the elements: "button" and "list" (both not related to the button and list widgets)
|
||||
|
||||
### Button
|
||||
- `LV_PART_MAIN` The background of the button. Uses the typical background properties and text properties for the text on it.
|
||||
- `LV_PART_INDICATOR` Typically an arrow symbol that can be an image or a text (`LV_SYMBOL`).
|
||||
|
||||
The button goes to `LV_STATE_CHECKED` when it's opened.
|
||||
|
||||
### List
|
||||
- `LV_PART_MAIN` The list itself. Uses the typical background properties. `max_height` can be used to limit the height of the list.
|
||||
- `LV_PART_SCROLLBAR` The scrollbar background, border, shadow properties and width (for its own width) and right padding for the spacing on the right.
|
||||
- `LV_PART_SELECTED` Refers to the currently pressed, checked or pressed+checked option. Also uses the typical background properties.
|
||||
|
||||
The list is hidden/shown on open/close. To add styles to it use `lv_dropdown_get_list(dropdown)` to get the list object. For example:
|
||||
|
||||
```c
|
||||
lv_obj_t * list = lv_dropdown_get_list(dropdown) /*Get the list*/
|
||||
lv_obj_add_style(list, &my_style, ...) /*Add the styles to the list*/}`
|
||||
```
|
||||
|
||||
Alternatively the theme can be extended with the new styles.
|
||||
|
||||
## Usage
|
||||
|
||||
## Overview
|
||||
|
||||
### Set options
|
||||
Options are passed to the drop-down list as a string with `lv_dropdown_set_options(dropdown, options)`. Options should be separated by `\n`. For example: `"First\nSecond\nThird"`. This string will be saved in the drop-down list, so it can in a local variable.
|
||||
|
||||
The `lv_dropdown_add_option(dropdown, "New option", pos)` function inserts a new option to `pos` index.
|
||||
|
||||
To save memory the options can set from a static(constant) string too with `lv_dropdown_set_static_options(dropdown, options)`.
|
||||
In this case the options string should be alive while the drop-down list exists and `lv_dropdown_add_option` can't be used
|
||||
|
||||
You can select an option manually with `lv_dropdown_set_selected(dropdown, id)`, where `id` is the index of an option.
|
||||
|
||||
### Get selected option
|
||||
The get the *index* of the selected option, use `lv_dropdown_get_selected(dropdown)`.
|
||||
|
||||
`lv_dropdown_get_selected_str(dropdown, buf, buf_size)` copies the *name* of the selected option to `buf`.
|
||||
|
||||
### Direction
|
||||
The list can be created on any side. The default `LV_DIR_BOTTOM` can be modified by `lv_dropdown_set_dir(dropdown, LV_DIR_LEFT/RIGHT/UP/BOTTOM)` function.
|
||||
|
||||
If the list would be vertically out of the screen, it will be aligned to the edge.
|
||||
|
||||
### Symbol
|
||||
A symbol (typically an arrow) can be added to the dropdown list with `lv_dropdown_set_symbol(dropdown, LV_SYMBOL_...)`
|
||||
|
||||
If the direction of the drop-down list is `LV_DIR_LEFT` the symbol will be shown on the left, otherwise on the right.
|
||||
|
||||
### Show selected
|
||||
The main part can either show the selected option or a static text. If a static is set with `lv_dropdown_set_text(dropdown, "Some text")` it will be shown regardless to th selected option.
|
||||
If the text is `NULL` the selected option is displayed on the button.
|
||||
|
||||
### Manually open/close
|
||||
To manually open or close the drop-down list the `lv_dropdown_open/close(dropdown)` function can be used.
|
||||
|
||||
## Events
|
||||
Apart from the [Generic events](../overview/event.html#generic-events), the following [Special events](../overview/event.html#special-events) are sent by the drop-down list:
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when the new option is selected or the list is opened/closed.
|
||||
- `LV_EVENT_CANCEL` Sent when the list is closed
|
||||
- `LV_EVENT_READY` Sent when the list is opened
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_RIGHT/DOWN` Select the next option.
|
||||
- `LV_KEY_LEFT/UP` Select the previous option.
|
||||
- `LY_KEY_ENTER` Apply the selected option (Sends `LV_EVENT_VALUE_CHANGED` event and closes the drop-down list).
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/dropdown/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_dropdown.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
138
LVGL.Simulator/lvgl/docs/widgets/core/img.md
Normal file
138
LVGL.Simulator/lvgl/docs/widgets/core/img.md
Normal file
@@ -0,0 +1,138 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/img.md
|
||||
```
|
||||
# Image (lv_img)
|
||||
|
||||
|
||||
## Overview
|
||||
|
||||
Images are the basic object to display images from flash (as arrays) or from files. Images can display symbols (`LV_SYMBOL_...`) too.
|
||||
|
||||
Using the [Image decoder interface](/overview/image.html#image-decoder) custom image formats can be supported as well.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` A background rectangle that uses the typical background style properties and the image itself using the image style properties.
|
||||
|
||||
## Usage
|
||||
|
||||
### Image source
|
||||
To provide maximum flexibility, the source of the image can be:
|
||||
|
||||
- a variable in code (a C array with the pixels).
|
||||
- a file stored externally (e.g. on an SD card).
|
||||
- a text with [Symbols](/overview/font).
|
||||
|
||||
To set the source of an image, use `lv_img_set_src(img, src)`.
|
||||
|
||||
To generate a pixel array from a PNG, JPG or BMP image, use the [Online image converter tool](https://lvgl.io/tools/imageconverter) and set the converted image with its pointer: `lv_img_set_src(img1, &converted_img_var);`
|
||||
To make the variable visible in the C file, you need to declare it with `LV_IMG_DECLARE(converted_img_var)`.
|
||||
|
||||
To use external files, you also need to convert the image files using the online converter tool but now you should select the binary output format.
|
||||
You also need to use LVGL's file system module and register a driver with some functions for the basic file operation. Go to the [File system](/overview/file-system) to learn more.
|
||||
To set an image sourced from a file, use `lv_img_set_src(img, "S:folder1/my_img.bin")`.
|
||||
|
||||
You can also set a symbol similarly to [Labels](/widgets/core/label). In this case, the image will be rendered as text according to the *font* specified in the style. It enables to use of light-weight monochrome "letters" instead of real images. You can set symbol like `lv_img_set_src(img1, LV_SYMBOL_OK)`.
|
||||
|
||||
### Label as an image
|
||||
Images and labels are sometimes used to convey the same thing. For example, to describe what a button does.
|
||||
Therefore, images and labels are somewhat interchangeable, that is the images can display texts by using `LV_SYMBOL_DUMMY` as the prefix of the text. For example, `lv_img_set_src(img, LV_SYMBOL_DUMMY "Some text")`.
|
||||
|
||||
|
||||
### Transparency
|
||||
The internal (variable) and external images support 2 transparency handling methods:
|
||||
|
||||
- **Chroma-keying** - Pixels with `LV_COLOR_CHROMA_KEY` (*lv_conf.h*) color will be transparent.
|
||||
- **Alpha byte** - An alpha byte is added to every pixel that contains the pixel's opacity
|
||||
|
||||
### Palette and Alpha index
|
||||
Besides the *True color* (RGB) color format, the following formats are supported:
|
||||
- **Indexed** - Image has a palette.
|
||||
- **Alpha indexed** - Only alpha values are stored.
|
||||
|
||||
These options can be selected in the image converter. To learn more about the color formats, read the [Images](/overview/image) section.
|
||||
|
||||
### Recolor
|
||||
A color can be mixed with every pixel of an image with a given intensity.
|
||||
This can be useful to show different states (checked, inactive, pressed, etc.) of an image without storing more versions of the same image.
|
||||
This feature can be enabled in the style by setting `img_recolor_opa` between `LV_OPA_TRANSP` (no recolor, value: 0) and `LV_OPA_COVER` (full recolor, value: 255).
|
||||
The default value is `LV_OPA_TRANSP` so this feature is disabled.
|
||||
|
||||
The color to mix is set by `img_recolor`.
|
||||
|
||||
### Auto-size
|
||||
If the width or height of the image object is set to `LV_SIZE_CONTENT` the object's size will be set according to the size of the image source in the respective direction.
|
||||
|
||||
### Mosaic
|
||||
If the object's size is greater than the image size in any directions, then the image will be repeated like a mosaic.
|
||||
This allows creation a large image from only a very narrow source.
|
||||
For example, you can have a *300 x 5* image with a special gradient and set it as a wallpaper using the mosaic feature.
|
||||
|
||||
### Offset
|
||||
With `lv_img_set_offset_x(img, x_ofs)` and `lv_img_set_offset_y(img, y_ofs)`, you can add some offset to the displayed image.
|
||||
Useful if the object size is smaller than the image source size.
|
||||
Using the offset parameter a [Texture atlas](https://en.wikipedia.org/wiki/Texture_atlas) or a "running image" effect can be created by [Animating](/overview/animation) the x or y offset.
|
||||
|
||||
## Transformations
|
||||
|
||||
Using the `lv_img_set_zoom(img, factor)` the images will be zoomed. Set `factor` to `256` or `LV_IMG_ZOOM_NONE` to disable zooming.
|
||||
A larger value enlarges the images (e.g. `512` double size), a smaller value shrinks it (e.g. `128` half size).
|
||||
Fractional scale works as well. E.g. `281` for 10% enlargement.
|
||||
|
||||
To rotate the image use `lv_img_set_angle(img, angle)`. Angle has 0.1 degree precision, so for 45.8° set 458.
|
||||
|
||||
The `transform_zoom` and `transform_angle` style properties are also used to determine the final zoom and angle.
|
||||
|
||||
By default, the pivot point of the rotation is the center of the image. It can be changed with `lv_img_set_pivot(img, pivot_x, pivot_y)`. `0;0` is the top left corner.
|
||||
|
||||
The quality of the transformation can be adjusted with `lv_img_set_antialias(img, true/false)`. With enabled anti-aliasing the transformations are higher quality but slower.
|
||||
|
||||
The transformations require the whole image to be available. Therefore indexed images (`LV_IMG_CF_INDEXED_...`), alpha only images (`LV_IMG_CF_ALPHA_...`) or images from files can not be transformed.
|
||||
In other words transformations work only on true color images stored as C array, or if a custom [Image decoder](/overview/images#image-edecoder) returns the whole image.
|
||||
|
||||
Note that the real coordinates of image objects won't change during transformation. That is `lv_obj_get_width/height/x/y()` will return the original, non-zoomed coordinates.
|
||||
|
||||
### Size mode
|
||||
|
||||
By default, when the image is zoomed or rotated the real coordinates of the image object are not changed.
|
||||
The larger content simply overflows the object's boundaries.
|
||||
It also means the layouts are not affected the by the transformations.
|
||||
|
||||
If you need the object size to be updated to the transformed size set `lv_img_set_size_mode(img, LV_IMG_SIZE_MODE_REAL)`. (The previous mode is the default and called `LV_IMG_SIZE_MODE_VIRTUAL`).
|
||||
In this case if the width/height of the object is set to `LV_SIZE_CONTENT` the object's size will be set to the zoomed and rotated size.
|
||||
If an explicit size is set then the overflowing content will be cropped.
|
||||
|
||||
### Rounded image
|
||||
|
||||
You can use `lv_obj_set_style_radius` to set radius to an image, and enable `lv_obj_set_style_clip_corner` to clip the
|
||||
content to rounded rectangle or circular shape. Please note this will have some negative performance impact to CPU
|
||||
based renderers.
|
||||
|
||||
## Events
|
||||
No special events are sent by image objects.
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/img/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_img.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
30
LVGL.Simulator/lvgl/docs/widgets/core/index.md
Normal file
30
LVGL.Simulator/lvgl/docs/widgets/core/index.md
Normal file
@@ -0,0 +1,30 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/object-types/index.md
|
||||
```
|
||||
# Core widgets
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. toctree::
|
||||
:maxdepth: 1
|
||||
|
||||
arc
|
||||
bar
|
||||
btn
|
||||
btnmatrix
|
||||
canvas
|
||||
checkbox
|
||||
dropdown
|
||||
img
|
||||
label
|
||||
line
|
||||
roller
|
||||
slider
|
||||
switch
|
||||
table
|
||||
textarea
|
||||
|
||||
```
|
||||
|
||||
|
||||
96
LVGL.Simulator/lvgl/docs/widgets/core/label.md
Normal file
96
LVGL.Simulator/lvgl/docs/widgets/core/label.md
Normal file
@@ -0,0 +1,96 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/core/label.md
|
||||
```
|
||||
# Label (lv_label)
|
||||
|
||||
## Overview
|
||||
A label is the basic object type that is used to display text.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` Uses all the typical background properties and the text properties. The padding values can be used to add space between the text and the background.
|
||||
- `LV_PART_SCROLLBAR` The scrollbar that is shown when the text is larger than the widget's size.
|
||||
- `LV_PART_SELECTED` Tells the style of the [selected text](#text-selection). Only `text_color` and `bg_color` style properties can be used.
|
||||
|
||||
## Usage
|
||||
|
||||
### Set text
|
||||
You can set the text on a label at runtime with `lv_label_set_text(label, "New text")`.
|
||||
This will allocate a buffer dynamically, and the provided string will be copied into that buffer.
|
||||
Therefore, you don't need to keep the text you pass to `lv_label_set_text` in scope after that function returns.
|
||||
|
||||
With `lv_label_set_text_fmt(label, "Value: %d", 15)` printf formatting can be used to set the text.
|
||||
|
||||
Labels are able to show text from a static character buffer. To do so, use `lv_label_set_text_static(label, "Text")`.
|
||||
In this case, the text is not stored in the dynamic memory and the given buffer is used directly instead.
|
||||
This means that the array can't be a local variable which goes out of scope when the function exits.
|
||||
Constant strings are safe to use with `lv_label_set_text_static` (except when used with `LV_LABEL_LONG_DOT`, as it modifies the buffer in-place), as they are stored in ROM memory, which is always accessible.
|
||||
|
||||
### Newline
|
||||
|
||||
Newline characters are handled automatically by the label object. You can use `\n` to make a line break. For example: `"line1\nline2\n\nline4"`
|
||||
|
||||
### Long modes
|
||||
By default, the width and height of the label is set to `LV_SIZE_CONTENT`. Therefore, the size of the label is automatically expanded to the text size.
|
||||
Otherwise, if the width or height are explicitly set (using e.g.`lv_obj_set_width` or a layout), the lines wider than the label's width can be manipulated according to several long mode policies.
|
||||
Similarly, the policies can be applied if the height of the text is greater than the height of the label.
|
||||
- `LV_LABEL_LONG_WRAP` Wrap too long lines. If the height is `LV_SIZE_CONTENT` the label's height will be expanded, otherwise the text will be clipped. (Default)
|
||||
- `LV_LABEL_LONG_DOT` Replaces the last 3 characters from bottom right corner of the label with dots (`.`)
|
||||
- `LV_LABEL_LONG_SCROLL` If the text is wider than the label scroll it horizontally back and forth. If it's higher, scroll vertically. Only one direction is scrolled and horizontal scrolling has higher precedence.
|
||||
- `LV_LABEL_LONG_SCROLL_CIRCULAR` If the text is wider than the label scroll it horizontally continuously. If it's higher, scroll vertically. Only one direction is scrolled and horizontal scrolling has higher precedence.
|
||||
- `LV_LABEL_LONG_CLIP` Simply clip the parts of the text outside the label.
|
||||
|
||||
You can specify the long mode with `lv_label_set_long_mode(label, LV_LABEL_LONG_...)`
|
||||
|
||||
Note that `LV_LABEL_LONG_DOT` manipulates the text buffer in-place in order to add/remove the dots.
|
||||
When `lv_label_set_text` or `lv_label_set_array_text` are used, a separate buffer is allocated and this implementation detail is unnoticed.
|
||||
This is not the case with `lv_label_set_text_static`. The buffer you pass to `lv_label_set_text_static` must be writable if you plan to use `LV_LABEL_LONG_DOT`.
|
||||
|
||||
### Text recolor
|
||||
In the text, you can use commands to recolor parts of the text. For example: `"Write a #ff0000 red# word"`.
|
||||
This feature can be enabled individually for each label by `lv_label_set_recolor()` function.
|
||||
|
||||
### Text selection
|
||||
If enabled by `LV_LABEL_TEXT_SELECTION` part of the text can be selected. It's similar to when you use your mouse on a PC to select a text.
|
||||
The whole mechanism (click and select the text as you drag your finger/mouse) is implemented in [Text area](/widgets/core/textarea) and the Label widget only allows manual text selection with
|
||||
`lv_label_get_text_selection_start(label, start_char_index)` and `lv_label_get_text_selection_start(label, end_char_index)`.
|
||||
|
||||
### Very long texts
|
||||
LVGL can efficiently handle very long (e.g. > 40k characters) labels by saving some extra data (~12 bytes) to speed up drawing. To enable this feature, set `LV_LABEL_LONG_TXT_HINT 1` in `lv_conf.h`.
|
||||
|
||||
### Custom scrolling animations
|
||||
Some aspects of the scrolling animations in long modes `LV_LABEL_LONG_SCROLL` and `LV_LABEL_LONG_SCROLL_CIRCULAR` can be customized by setting the animation property of a style, using `lv_style_set_anim()`.
|
||||
Currently, only the start and repeat delay of the circular scrolling animation can be customized. If you need to customize another aspect of the scrolling animation, feel free to open an [issue on Github](https://github.com/lvgl/lvgl/issues) to request the feature.
|
||||
|
||||
### Symbols
|
||||
The labels can display symbols alongside letters (or on their own). Read the [Font](/overview/font) section to learn more about the symbols.
|
||||
|
||||
## Events
|
||||
No special events are sent by the Label.
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/label/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_label.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
|
||||
52
LVGL.Simulator/lvgl/docs/widgets/core/line.md
Normal file
52
LVGL.Simulator/lvgl/docs/widgets/core/line.md
Normal file
@@ -0,0 +1,52 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/line.md
|
||||
```
|
||||
# Line (lv_line)
|
||||
|
||||
## Overview
|
||||
The Line object is capable of drawing straight lines between a set of points.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` uses all the typical background properties and line style properties.
|
||||
|
||||
## Usage
|
||||
|
||||
### Set points
|
||||
The points have to be stored in an `lv_point_t` array and passed to the object by the `lv_line_set_points(lines, point_array, point_cnt)` function.
|
||||
|
||||
### Auto-size
|
||||
By default, the Line's width and height are set to `LV_SIZE_CONTENT`. This means it will automatically set its size to fit all the points. If the size is set explicitly, parts on the line may not be visible.
|
||||
|
||||
### Invert y
|
||||
By default, the *y == 0* point is in the top of the object. It might be counter-intuitive in some cases so the y coordinates can be inverted with `lv_line_set_y_invert(line, true)`. In this case, *y == 0* will be the bottom of the object.
|
||||
*y invert* is disabled by default.
|
||||
|
||||
## Events
|
||||
Only the [Generic events](../overview/event.html#generic-events) are sent by the object type.
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/line/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_line.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
62
LVGL.Simulator/lvgl/docs/widgets/core/roller.md
Normal file
62
LVGL.Simulator/lvgl/docs/widgets/core/roller.md
Normal file
@@ -0,0 +1,62 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/roller.md
|
||||
```
|
||||
# Roller (lv_roller)
|
||||
|
||||
## Overview
|
||||
|
||||
Roller allows you to simply select one option from a list by scrolling.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the roller uses all the typical background properties and text style properties. `style_text_line_space` adjusts the space between the options.
|
||||
When the Roller is scrolled and doesn't stop exactly on an option it will scroll to the nearest valid option automatically in `anim_time` milliseconds as specified in the style.
|
||||
- `LV_PART_SELECTED` The selected option in the middle. Besides the typical background properties it uses the text style properties to change the appearance of the text in the selected area.
|
||||
|
||||
## Usage
|
||||
|
||||
### Set options
|
||||
Options are passed to the Roller as a string with `lv_roller_set_options(roller, options, LV_ROLLER_MODE_NORMAL/INFINITE)`. The options should be separated by `\n`. For example: `"First\nSecond\nThird"`.
|
||||
|
||||
`LV_ROLLER_MODE_INFINITE` makes the roller circular.
|
||||
|
||||
You can select an option manually with `lv_roller_set_selected(roller, id, LV_ANIM_ON/OFF)`, where *id* is the index of an option.
|
||||
|
||||
### Get selected option
|
||||
To get the *index* of the currently selected option use `lv_roller_get_selected(roller)`.
|
||||
|
||||
`lv_roller_get_selected_str(roller, buf, buf_size)` will copy the name of the selected option to `buf`.
|
||||
|
||||
### Visible rows
|
||||
The number of visible rows can be adjusted with `lv_roller_set_visible_row_count(roller, num)`.
|
||||
|
||||
This function calculates the height with the current style. If the font, line space, border width, etc. of the roller changes this function needs to be called again.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when a new option is selected.
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_RIGHT/DOWN` Select the next option
|
||||
- `LV_KEY_LEFT/UP` Select the previous option
|
||||
- `LY_KEY_ENTER` Apply the selected option (Send `LV_EVENT_VALUE_CHANGED` event)
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/roller/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_roller.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
78
LVGL.Simulator/lvgl/docs/widgets/core/slider.md
Normal file
78
LVGL.Simulator/lvgl/docs/widgets/core/slider.md
Normal file
@@ -0,0 +1,78 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/slider.md
|
||||
```
|
||||
# Slider (lv_slider)
|
||||
|
||||
## Overview
|
||||
|
||||
The Slider object looks like a [Bar](/widgets/core/bar) supplemented with a knob. The knob can be dragged to set a value. Just like Bar, Slider can be vertical or horizontal.
|
||||
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the slider. Uses all the typical background style properties. `padding` makes the indicator smaller in the respective direction.
|
||||
- `LV_PART_INDICATOR` The indicator that shows the current state of the slider. Also uses all the typical background style properties.
|
||||
- `LV_PART_KNOB` A rectangle (or circle) drawn at the current value. Also uses all the typical background properties to describe the knob(s). By default, the knob is square (with an optional corner radius) with side length equal to the smaller side of the slider. The knob can be made larger with the `padding` values. Padding values can be asymmetric too.
|
||||
|
||||
## Usage
|
||||
|
||||
### Value and range
|
||||
To set an initial value use `lv_slider_set_value(slider, new_value, LV_ANIM_ON/OFF)`. The animation time is set by the styles' `anim_time` property.
|
||||
|
||||
To specify the range (min, max values), `lv_slider_set_range(slider, min , max)` can be used.
|
||||
|
||||
### Modes
|
||||
The slider can be one of the following modes:
|
||||
- `LV_SLIDER_MODE_NORMAL` A normal slider as described above
|
||||
- `LV_SLIDER_SYMMETRICAL` Draw the indicator form the zero value to current value. Requires negative minimum range and positive maximum range.
|
||||
- `LV_SLIDER_RANGE` Allows setting the start value too by `lv_bar_set_start_value(bar, new_value, LV_ANIM_ON/OFF)`. The start value has to be always smaller than the end value.
|
||||
|
||||
The mode can be changed with `lv_slider_set_mode(slider, LV_SLIDER_MODE_...)`
|
||||
|
||||
### Knob-only mode
|
||||
Normally, the slider can be adjusted either by dragging the knob, or by clicking on the slider bar.
|
||||
In the latter case the knob moves to the point clicked and slider value changes accordingly. In some cases it is desirable to set the slider to react on dragging the knob only. This feature is enabled by adding the `LV_OBJ_FLAG_ADV_HITTEST`: `lv_obj_add_flag(slider, LV_OBJ_FLAG_ADV_HITTEST)`.
|
||||
|
||||
The extended click area (set by `lv_obj_set_ext_click_area(slider, value)`) increases to knob's click area.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent while the slider is being dragged or changed with keys.
|
||||
The event is sent continuously while the slider is dragged and once when released. Use `lv_slider_is_dragged` to determine whether the Slider is still being dragged or has just been released.
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` are sent for the following parts.
|
||||
- `LV_SLIDER_DRAW_PART_KNOB` The main (right) knob of the slider
|
||||
- `part`: `LV_PART_KNOB`
|
||||
- `draw_area`: area of the indicator
|
||||
- `rect_dsc`
|
||||
- `id`: 0
|
||||
- `LV_SLIDER_DRAW_PART_KNOB` The left knob of the slider
|
||||
- `part`: `LV_PART_KNOB`
|
||||
- `draw_area`: area of the indicator
|
||||
- `rect_dsc`
|
||||
- `id`: 1
|
||||
|
||||
See the events of the [Bar](/widgets/core/bar) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_UP/RIGHT` Increment the slider's value by 1
|
||||
- `LV_KEY_DOWN/LEFT` Decrement the slider's value by 1
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/slider/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_slider.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
57
LVGL.Simulator/lvgl/docs/widgets/core/switch.md
Normal file
57
LVGL.Simulator/lvgl/docs/widgets/core/switch.md
Normal file
@@ -0,0 +1,57 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/switch.md
|
||||
```
|
||||
|
||||
# Switch (lv_switch)
|
||||
|
||||
## Overview
|
||||
|
||||
The Switch looks like a little slider and can be used to turn something on and off.
|
||||
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the switch uses all the typical background style properties. `padding` makes the indicator smaller in the respective direction.
|
||||
- `LV_PART_INDICATOR` The indicator that shows the current state of the switch. Also uses all the typical background style properties.
|
||||
- `LV_PART_KNOB` A rectangle (or circle) drawn at left or right side of the indicator. Also uses all the typical background properties to describe the knob(s). By default, the knob is square (with an optional corner radius) with side length equal to the smaller side of the slider. The knob can be made larger with the `padding` values. Padding values can be asymmetric too.
|
||||
|
||||
## Usage
|
||||
|
||||
### Change state
|
||||
The switch uses the standard `LV_STATE_CHECKED` state.
|
||||
|
||||
To get the current state of the switch (with `true` being on), use `lv_obj_has_state(switch, LV_STATE_CHECKED)`.
|
||||
|
||||
Call `lv_obj_add_state(switch, LV_STATE_CHECKED)` to turn it on, or `lv_obj_clear_state(switch, LV_STATE_CHECKED)` to turn it off.
|
||||
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when the switch changes state.
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_UP/RIGHT` Turns on the slider
|
||||
- `LV_KEY_DOWN/LEFT` Turns off the slider
|
||||
- `LV_KEY_ENTER` Toggles the switch
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/switch/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_switch.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
95
LVGL.Simulator/lvgl/docs/widgets/core/table.md
Normal file
95
LVGL.Simulator/lvgl/docs/widgets/core/table.md
Normal file
@@ -0,0 +1,95 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/table.md
|
||||
```
|
||||
# Table (lv_table)
|
||||
|
||||
## Overview
|
||||
|
||||
Tables, as usual, are built from rows, columns, and cells containing texts.
|
||||
|
||||
The Table object is very lightweight because only the texts are stored. No real objects are created for cells but they are just drawn on the fly.
|
||||
|
||||
The Table is added to the default group (if it is set). Besides the Table is an editable object to allow selecting a cell with encoder navigation too.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the table uses all the typical background style properties.
|
||||
- `LV_PART_ITEMS` The cells of the table also use all the typical background style properties and the text properties.
|
||||
|
||||
|
||||
## Usage
|
||||
|
||||
### Set cell value
|
||||
|
||||
The cells can store only text so numbers need to be converted to text before displaying them in a table.
|
||||
|
||||
`lv_table_set_cell_value(table, row, col, "Content")`. The text is saved by the table so it can be even a local variable.
|
||||
|
||||
Line breaks can be used in the text like `"Value\n60.3"`.
|
||||
|
||||
New rows and columns are automatically added is required
|
||||
|
||||
### Rows and Columns
|
||||
|
||||
To explicitly set number of rows and columns use `lv_table_set_row_cnt(table, row_cnt)` and `lv_table_set_col_cnt(table, col_cnt)`
|
||||
|
||||
### Width and Height
|
||||
|
||||
The width of the columns can be set with `lv_table_set_col_width(table, col_id, width)`. The overall width of the Table object will be set to the sum of columns widths.
|
||||
|
||||
The height is calculated automatically from the cell styles (font, padding etc) and the number of rows.
|
||||
|
||||
### Merge cells
|
||||
|
||||
Cells can be merged horizontally with `lv_table_add_cell_ctrl(table, row, col, LV_TABLE_CELL_CTRL_MERGE_RIGHT)`. To merge more adjacent cells call this function for each cell.
|
||||
|
||||
### Scroll
|
||||
If the label's width or height is set to `LV_SIZE_CONTENT` that size will be used to show the whole table in the respective direction.
|
||||
E.g. `lv_obj_set_size(table, LV_SIZE_CONTENT, LV_SIZE_CONTENT)` automatically sets the table size to show all the columns and rows.
|
||||
|
||||
If the width or height is set to a smaller number than the "intrinsic" size then the table becomes scrollable.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when a new cell is selected with keys.
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` are sent for the following types:
|
||||
- `LV_TABLE_DRAW_PART_CELL` The individual cells of the table
|
||||
- `part`: `LV_PART_ITEMS`
|
||||
- `draw_area`: area of the indicator
|
||||
- `rect_dsc`
|
||||
- `label_dsc`
|
||||
- `id`: current row × col count + current column
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
|
||||
The following *Keys* are processed by the Tables:
|
||||
- `LV_KEY_RIGHT/LEFT/UP/DOWN/` Select a cell.
|
||||
|
||||
Note that, as usual, the state of `LV_KEY_ENTER` is translated to `LV_EVENT_PRESSED/PRESSING/RELEASED` etc.
|
||||
|
||||
`lv_table_get_selected_cell(table, &row, &col)` can be used to get the currently selected cell. Row and column will be set to `LV_TABLE_CELL_NONE` no cell is selected.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/table/index.rst
|
||||
|
||||
```
|
||||
|
||||
### MicroPython
|
||||
No examples yet.
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_table.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
127
LVGL.Simulator/lvgl/docs/widgets/core/textarea.md
Normal file
127
LVGL.Simulator/lvgl/docs/widgets/core/textarea.md
Normal file
@@ -0,0 +1,127 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/core/textarea.md
|
||||
```
|
||||
# Text area (lv_textarea)
|
||||
|
||||
## Overview
|
||||
|
||||
The Text Area is a [Base object](widgets/obj) with a [Label](/widgets/core/label) and a cursor on it.
|
||||
Texts or characters can be added to it.
|
||||
Long lines are wrapped and when the text becomes long enough the Text area can be scrolled.
|
||||
|
||||
One line mode and password modes are supported.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the text area. Uses all the typical background style properties and the text related style properties including `text_align` to align the text to the left, right or center.
|
||||
- `LV_PART_SCROLLBAR` The scrollbar that is shown when the text is too long.
|
||||
- `LV_PART_SELECTED` Determines the style of the [selected text](/widgets/core/label.html#text-selection). Only `text_color` and `bg_color` style properties can be used. `bg_color` should be set directly on the label of the text area.
|
||||
- `LV_PART_CURSOR` Marks the position where the characters are inserted. The cursor's area is always the bounding box of the current character.
|
||||
A block cursor can be created by adding a background color and background opacity to `LV_PART_CURSOR`'s style. The create line cursor leave the cursor transparent and set a left border.
|
||||
The `anim_time` style property sets the cursor's blink time.
|
||||
- `LV_PART_TEXTAREA_PLACEHOLDER` Unique to Text Area, allows styling the placeholder text.
|
||||
|
||||
## Usage
|
||||
|
||||
### Add text
|
||||
|
||||
You can insert text or characters to the current cursor's position with:
|
||||
|
||||
- `lv_textarea_add_char(textarea, 'c')`
|
||||
- `lv_textarea_add_text(textarea, "insert this text")`
|
||||
|
||||
To add wide characters like `'á'`, `'ß'` or CJK characters use `lv_textarea_add_text(ta, "á")`.
|
||||
|
||||
`lv_textarea_set_text(ta, "New text")` changes the whole text.
|
||||
|
||||
### Placeholder
|
||||
|
||||
A placeholder text can be specified - which is displayed when the Text area is empty - with `lv_textarea_set_placeholder_text(ta, "Placeholder text")`
|
||||
|
||||
### Delete character
|
||||
|
||||
To delete a character from the left of the current cursor position use `lv_textarea_del_char(textarea)`.
|
||||
To delete from the right use `lv_textarea_del_char_forward(textarea)`
|
||||
|
||||
### Move the cursor
|
||||
|
||||
The cursor position can be modified directly like `lv_textarea_set_cursor_pos(textarea, 10)`.
|
||||
The `0` position means "before the first characters",
|
||||
`LV_TA_CURSOR_LAST` means "after the last character"
|
||||
|
||||
You can step the cursor with
|
||||
- `lv_textarea_cursor_right(textarea)`
|
||||
- `lv_textarea_cursor_left(textarea)`
|
||||
- `lv_textarea_cursor_up(textarea)`
|
||||
- `lv_textarea_cursor_down(textarea)`
|
||||
|
||||
If `lv_textarea_set_cursor_click_pos(textarea, true)` is applied the cursor will jump to the position where the Text area was clicked.
|
||||
|
||||
### Hide the cursor
|
||||
The cursor is always visible, however it can be a good idea to style it to be visible only in `LV_STATE_FOCUSED` state.
|
||||
|
||||
### One line mode
|
||||
The Text area can be configured to be on a single line with `lv_textarea_set_one_line(textarea, true)`.
|
||||
In this mode the height is set automatically to show only one line, line break characters are ignored, and word wrap is disabled.
|
||||
|
||||
### Password mode
|
||||
The text area supports password mode which can be enabled with `lv_textarea_set_password_mode(textarea, true)`.
|
||||
|
||||
If the `•` ([Bullet, U+2022](http://www.fileformat.info/info/unicode/char/2022/index.htm)) character exists in the font, the entered characters are converted to it after some time or when a new character is entered.
|
||||
If `•` not exists, `*` will be used.
|
||||
|
||||
In password mode `lv_textarea_get_text(textarea)` returns the actual text entered, not the bullet characters.
|
||||
|
||||
The visibility time can be adjusted with `LV_TEXTAREA_DEF_PWD_SHOW_TIME)` in `lv_conf.h`.
|
||||
|
||||
### Accepted characters
|
||||
You can set a list of accepted characters with `lv_textarea_set_accepted_chars(textarea, "0123456789.+-")`.
|
||||
Other characters will be ignored.
|
||||
|
||||
### Max text length
|
||||
The maximum number of characters can be limited with `lv_textarea_set_max_length(textarea, max_char_num)`
|
||||
|
||||
|
||||
### Very long texts
|
||||
If there is a very long text in the Text area (e.g. > 20k characters), scrolling and drawing might be slow.
|
||||
However, by enabling `LV_LABEL_LONG_TXT_HINT 1` in `lv_conf.h` the performance can be hugely improved.
|
||||
This will save some additional information about the label to speed up its drawing.
|
||||
Using `LV_LABEL_LONG_TXT_HINT` the scrolling and drawing will as fast as with "normal" short texts.
|
||||
|
||||
### Select text
|
||||
Any part of the text can be selected if enabled with `lv_textarea_set_text_selection(textarea, true)`.
|
||||
This works much like when you select text on your PC with your mouse.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_INSERT` Sent right before a character or text is inserted.
|
||||
The event parameter is the text about to be inserted. `lv_textarea_set_insert_replace(textarea, "New text")` replaces the text to insert.
|
||||
The new text cannot be in a local variable which is destroyed when the event callback exists. `""` means do not insert anything.
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when the content of the text area has been changed.
|
||||
- `LV_EVENT_READY` Sent when `LV_KEY_ENTER` is pressed (or sent) to a one line text area.
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_UP/DOWN/LEFT/RIGHT` Move the cursor
|
||||
- `Any character` Add the character to the current cursor position
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/textarea/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_textarea.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
53
LVGL.Simulator/lvgl/docs/widgets/extra/animimg.md
Normal file
53
LVGL.Simulator/lvgl/docs/widgets/extra/animimg.md
Normal file
@@ -0,0 +1,53 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/animimg.md
|
||||
```
|
||||
# Animation Image (lv_animimg)
|
||||
|
||||
## Overview
|
||||
|
||||
The animation image is similar to the normal 'Image' object. The only difference is that instead of one source image, you set an array of multiple source images.
|
||||
|
||||
You can specify a duration and repeat count.
|
||||
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` A background rectangle that uses the typical background style properties and the image itself using the image style properties.
|
||||
|
||||
|
||||
## Usage
|
||||
|
||||
### Image sources
|
||||
To set the image in a state, use the `lv_animimg_set_src(imgbtn, dsc[], num)`.
|
||||
|
||||
|
||||
## Events
|
||||
No special events are sent by image objects.
|
||||
|
||||
See the events of the Base object too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
|
||||
## Keys
|
||||
No Keys are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/animimg/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_animimg.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
86
LVGL.Simulator/lvgl/docs/widgets/extra/calendar.md
Normal file
86
LVGL.Simulator/lvgl/docs/widgets/extra/calendar.md
Normal file
@@ -0,0 +1,86 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/calendar.md
|
||||
```
|
||||
# Calendar (lv_calendar)
|
||||
|
||||
## Overview
|
||||
|
||||
The Calendar object is a classic calendar which can:
|
||||
- show the days of any month in a 7x7 matrix
|
||||
- Show the name of the days
|
||||
- highlight the current day (today)
|
||||
- highlight any user-defined dates
|
||||
|
||||
The Calendar is added to the default group (if it is set). Calendar is an editable object which allow selecting and clicking the dates with encoder navigation too.
|
||||
|
||||
To make the Calendar flexible, by default it doesn't show the current year or month. Instead, there are optional "headers" that can be attached to the calendar.
|
||||
|
||||
## Parts and Styles
|
||||
The calendar object uses the [Button matrix](/widgets/core/btnmatrix) object under the hood to arrange the days into a matrix.
|
||||
- `LV_PART_MAIN` The background of the calendar. Uses all the background related style properties.
|
||||
- `LV_PART_ITEMS` Refers to the dates and day names. Button matrix control flags are set to differentiate the buttons and a custom drawer event is added modify the properties of the buttons as follows:
|
||||
- day names have no border, no background and drawn with a gray color
|
||||
- days of the previous and next month have `LV_BTNMATRIX_CTRL_DISABLED` flag
|
||||
- today has a thicker border with the theme's primary color
|
||||
- highlighted days have some opacity with the theme's primary color.
|
||||
|
||||
## Usage
|
||||
|
||||
Some functions use the `lv_calendar_date_t` type which is a structure with `year`, `month` and `day` fields.
|
||||
|
||||
### Current date
|
||||
To set the current date (today), use the `lv_calendar_set_today_date(calendar, year, month, day)` function. `month` needs to be in 1..12 range and `day` in 1..31 range.
|
||||
|
||||
### Shown date
|
||||
To set the shown date, use `lv_calendar_set_shown_date(calendar, year, month)`;
|
||||
|
||||
### Highlighted days
|
||||
|
||||
The list of highlighted dates should be stored in a `lv_calendar_date_t` array loaded by `lv_calendar_set_highlighted_dates(calendar, highlighted_dates, date_num)`.
|
||||
Only the array's pointer will be saved so the array should be a static or global variable.
|
||||
|
||||
### Name of the days
|
||||
The name of the days can be adjusted with `lv_calendar_set_day_names(calendar, day_names)` where `day_names` looks like `const char * day_names[7] = {"Su", "Mo", ...};`
|
||||
Only the pointer of the day names is saved so the elements should be static, global or constant variables.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent if a date is clicked. `lv_calendar_get_pressed_date(calendar, &date)` set `date` to the date currently being pressed. Returns `LV_RES_OK` if there is a valid pressed date, else `LV_RES_INV`.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_RIGHT/UP/LEFT/RIGHT` To navigate among the buttons to dates
|
||||
- `LV_KEY_ENTER` To press/release the selected date
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Headers
|
||||
|
||||
**From v8.1 the header is added directly into the Calendar widget and the API of the headers has been changed.**
|
||||
|
||||
### Arrow buttons
|
||||
|
||||
`lv_calendar_header_arrow_create(calendar)` creates a header that contains a left and right arrow on the sides and a text with the current year and month between them.
|
||||
|
||||
|
||||
### Drop-down
|
||||
`lv_calendar_header_dropdown_create(calendar)` creates a header that contains 2 drop-drown lists: one for the year and another for the month.
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/calendar/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_calendar.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
197
LVGL.Simulator/lvgl/docs/widgets/extra/chart.md
Normal file
197
LVGL.Simulator/lvgl/docs/widgets/extra/chart.md
Normal file
@@ -0,0 +1,197 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/chart.md
|
||||
```
|
||||
# Chart (lv_chart)
|
||||
|
||||
## Overview
|
||||
|
||||
Charts are a basic object to visualize data points. Currently *Line* charts (connect points with lines and/or draw points on them) and *Bar* charts are supported.
|
||||
|
||||
Charts can have:
|
||||
- division lines
|
||||
- 2 y axis
|
||||
- axis ticks and texts on ticks
|
||||
- cursors
|
||||
- scrolling and zooming
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the chart. Uses all the typical background and *line* (for the division lines) related style properties. *Padding* makes the series area smaller.
|
||||
- `LV_PART_SCROLLBAR` The scrollbar used if the chart is zoomed. See the [Base object](/widgets/obj)'s documentation for details.
|
||||
- `LV_PART_ITEMS` Refers to the line or bar series.
|
||||
- Line chart: The *line* properties are used by the lines. `width`, `height`, `bg_color` and `radius` is used to set the appearance of points.
|
||||
- Bar chart: The typical background properties are used to style the bars.
|
||||
- `LV_PART_INDICATOR` Refers to the points on line and scatter chart (small circles or squares).
|
||||
- `LV_PART_CURSOR` *Line* properties are used to style the cursors. `width`, `height`, `bg_color` and `radius` are used to set the appearance of points.
|
||||
- `LV_PART_TICKS` *Line* and *Text* style properties are used to style the ticks
|
||||
|
||||
## Usage
|
||||
|
||||
|
||||
### Chart type
|
||||
The following data display types exist:
|
||||
- `LV_CHART_TYPE_NONE` Do not display any data. Can be used to hide the series.
|
||||
- `LV_CHART_TYPE_LINE` Draw lines between the data points and/or points (rectangles or circles) on the data points.
|
||||
- `LV_CHART_TYPE_BAR` - Draw bars.
|
||||
- `LV_CHART_TYPE_SCATTER` - X/Y chart drawing point's and lines between the points. .
|
||||
|
||||
You can specify the display type with `lv_chart_set_type(chart, LV_CHART_TYPE_...)`.
|
||||
|
||||
|
||||
### Data series
|
||||
You can add any number of series to the charts by `lv_chart_add_series(chart, color, axis)`. This allocates an `lv_chart_series_t` structure which contains the chosen `color` and an array for the data points.
|
||||
`axis` can have the following values:
|
||||
- `LV_CHART_AXIS_PRIMARY_Y` Left axis
|
||||
- `LV_CHART_AXIS_SECONDARY_Y` Right axis
|
||||
- `LV_CHART_AXIS_PRIMARY_X` Bottom axis
|
||||
- `LV_CHART_AXIS_SECONDARY_X` Top axis
|
||||
|
||||
|
||||
`axis` tells which axis's range should be used te scale the values.
|
||||
|
||||
`lv_chart_set_ext_y_array(chart, ser, value_array)` makes the chart use an external array for the given series.
|
||||
`value_array` should look like this: `lv_coord_t * value_array[num_points]`. The array size needs to be large enough to hold all the points of that series.
|
||||
The array's pointer will be saved in the chart so it needs to be global, static or dynamically allocated.
|
||||
Note: you should call `lv_chart_refresh(chart)` after the external data source has been updated to update the chart.
|
||||
|
||||
The value array of a series can be obtained with `lv_chart_get_y_array(chart, ser)`, which can be used with `ext_array` or *normal array*s.
|
||||
|
||||
For `LV_CHART_TYPE_SCATTER` type `lv_chart_set_ext_x_array(chart, ser, value_array)` and `lv_chart_get_x_array(chart, ser)` can be used as well.
|
||||
|
||||
### Modify the data
|
||||
You have several options to set the data of series:
|
||||
1. Set the values manually in the array like `ser1->points[3] = 7` and refresh the chart with `lv_chart_refresh(chart)`.
|
||||
2. Use `lv_chart_set_value_by_id(chart, ser, id, value)` where `id` is the index of the point you wish to update.
|
||||
3. Use the `lv_chart_set_next_value(chart, ser, value)`.
|
||||
4. Initialize all points to a given value with: `lv_chart_set_all_value(chart, ser, value)`.
|
||||
|
||||
Use `LV_CHART_POINT_NONE` as value to make the library skip drawing that point, column, or line segment.
|
||||
|
||||
For `LV_CHART_TYPE_SCATTER` type `lv_chart_set_value_by_id2(chart, ser, id, value)` and `lv_chart_set_next_value2(chart, ser, x_valuem y_value)` can be used as well.
|
||||
|
||||
|
||||
### Update modes
|
||||
`lv_chart_set_next_value` can behave in two ways depending on *update mode*:
|
||||
- `LV_CHART_UPDATE_MODE_SHIFT` Shift old data to the left and add the new one to the right.
|
||||
- `LV_CHART_UPDATE_MODE_CIRCULAR` - Add the new data in circular fashion, like an ECG diagram.
|
||||
|
||||
The update mode can be changed with `lv_chart_set_update_mode(chart, LV_CHART_UPDATE_MODE_...)`.
|
||||
|
||||
### Number of points
|
||||
The number of points in the series can be modified by `lv_chart_set_point_count(chart, point_num)`. The default value is 10.
|
||||
Note: this also affects the number of points processed when an external buffer is assigned to a series, so you need to be sure the external array is large enough.
|
||||
|
||||
#### Handling large number of points
|
||||
On line charts, if the number of points is greater than the pixels horizontally, the Chart will draw only vertical lines to make the drawing of large amount of data effective.
|
||||
If there are, let's say, 10 points to a pixel, LVGL searches the smallest and the largest value and draws a vertical lines between them to ensure no peaks are missed.
|
||||
|
||||
### Vertical range
|
||||
You can specify the minimum and maximum values in y-direction with `lv_chart_set_range(chart, axis, min, max)`.
|
||||
`axis` can be `LV_CHART_AXIS_PRIMARY` (left axis) or `LV_CHART_AXIS_SECONDARY` (right axis).
|
||||
|
||||
The value of the points will be scaled proportionally. The default range is: 0..100.
|
||||
|
||||
### Division lines
|
||||
The number of horizontal and vertical division lines can be modified by `lv_chart_set_div_line_count(chart, hdiv_num, vdiv_num)`.
|
||||
The default settings are 3 horizontal and 5 vertical division lines.
|
||||
If there is a visible border on a side and no padding on that side, the division line would be drawn on top of the border and therefore it won't be drawn.
|
||||
|
||||
### Override default start point for series
|
||||
If you want a plot to start from a point other than the default which is `point[0]` of the series, you can set an alternative
|
||||
index with the function `lv_chart_set_x_start_point(chart, ser, id)` where `id` is the new index position to start plotting from.
|
||||
|
||||
Note that `LV_CHART_UPDATE_MODE_SHIFT` also changes the `start_point`.
|
||||
|
||||
### Tick marks and labels
|
||||
Ticks and labels can be added to the axis with `lv_chart_set_axis_tick(chart, axis, major_len, minor_len, major_cnt, minor_cnt, label_en, draw_size)`.
|
||||
- `axis` can be `LV_CHART_AXIS_X/PRIMARY_Y/SECONDARY_Y`
|
||||
- `major_len` is the length of major ticks
|
||||
- `minor_len` is the length of minor ticks
|
||||
- `major_cnt` is the number of major ticks on the axis
|
||||
- `minor_cnt` in the number of minor ticks between two major ticks
|
||||
- `label_en` `true`: enable label drawing on major ticks
|
||||
- `draw_size` extra size required to draw the tick and labels (start with 20 px and increase if the ticks/labels are clipped)
|
||||
|
||||
### Zoom
|
||||
The chart can be zoomed independently in x and y directions with `lv_chart_set_zoom_x(chart, factor)` and `lv_chart_set_zoom_y(chart, factor)`.
|
||||
If `factor` is 256 there is no zoom. 512 means double zoom, etc. Fractional values are also possible but < 256 value is not allowed.
|
||||
|
||||
|
||||
### Cursor
|
||||
|
||||
A cursor can be added with `lv_chart_cursor_t * c1 = lv_chart_add_cursor(chart, color, dir);`.
|
||||
The possible values of `dir` `LV_DIR_NONE/RIGHT/UP/LEFT/DOWN/HOR/VER/ALL` or their OR-ed values to tell in which direction(s) should the cursor be drawn.
|
||||
|
||||
`lv_chart_set_cursor_pos(chart, cursor, &point)` sets the position of the cursor.
|
||||
`pos` is a pointer to an `lv_point_t` variable. E.g. `lv_point_t point = {10, 20};`. If the chart is scrolled the cursor will remain in the same place.
|
||||
|
||||
`lv_chart_get_point_pos_by_id(chart, series, id, &point_out)` gets the coordinate of a given point. It's useful to place the cursor at a given point.
|
||||
|
||||
`lv_chart_set_cursor_point(chart, cursor, series, point_id)` sticks the cursor at a point. If the point's position changes (new value or scrolling) the cursor will move with the point.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when a new point is clicked pressed. `lv_chart_get_pressed_point(chart)` returns the zero-based index of the pressed point.
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` are sent with the following types:
|
||||
- `LV_CHART_DRAW_PART_DIV_LINE_INIT` Used before/after drawn the div lines to add masks to any extra drawings. The following fields are set:
|
||||
- `part`: `LV_PART_MAIN`
|
||||
- `line_dsc`
|
||||
- `LV_CHART_DRAW_PART_DIV_LINE_HOR`, `LV_CHART_DRAW_PART_DIV_LINE_VER` Used for each horizontal and vertical division lines.
|
||||
- `part`: `LV_PART_MAIN`
|
||||
- `id`: index of the line
|
||||
- `p1`, `p2`: points of the line
|
||||
- `line_dsc`
|
||||
- `LV_CHART_DRAW_PART_LINE_AND_POINT` Used on line and scatter charts for lines and points.
|
||||
- `part`: `LV_PART_ITEMS`
|
||||
- `id`: index of the point
|
||||
- `value`: value of `id`th point
|
||||
- `p1`, `p2`: points of the line
|
||||
- `draw_area`: area of the point
|
||||
- `line_dsc`
|
||||
- `rect_dsc`
|
||||
- `sub_part_ptr`: pointer to the series
|
||||
- `LV_CHART_DRAW_PART_BAR` Used on bar charts for the rectangles.
|
||||
- `part`: `LV_PART_ITEMS`
|
||||
- `id`: index of the point
|
||||
- `value`: value of `id`th point
|
||||
- `draw_area`: area of the point
|
||||
- `rect_dsc`:
|
||||
- `sub_part_ptr`: pointer to the series
|
||||
- `LV_CHART_DRAW_PART_CURSOR` Used on cursor lines and points.
|
||||
- `part`: `LV_PART_CURSOR`
|
||||
- `p1`, `p2`: points of the line
|
||||
- `line_dsc`
|
||||
- `rect_dsc`
|
||||
- `draw_area`: area of the points
|
||||
- `LV_CHART_DRAW_PART_TICK_LABEL` Used on tick lines and labels.
|
||||
- `part`: `LV_PART_TICKS`
|
||||
- `id`: axis
|
||||
- `value`: value of the tick
|
||||
- `text`: `value` converted to decimal or `NULL` for minor ticks
|
||||
- `line_dsc`,
|
||||
- `label_dsc`,
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/chart/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_chart.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
59
LVGL.Simulator/lvgl/docs/widgets/extra/colorwheel.md
Normal file
59
LVGL.Simulator/lvgl/docs/widgets/extra/colorwheel.md
Normal file
@@ -0,0 +1,59 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/colorwheel.md
|
||||
```
|
||||
# Color wheel (lv_colorwheel)
|
||||
|
||||
## Overview
|
||||
As its name implies *Color wheel* allows the user to select a color. The Hue, Saturation and Value of the color can be selected separately.
|
||||
|
||||
Long pressing the object, the color wheel will change to the next parameter of the color (hue, saturation or value). A double click will reset the current parameter.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` Only `arc_width` is used to set the width of the color wheel
|
||||
- `LV_PART_KNOB` A rectangle (or circle) drawn on the current value. It uses all the rectangle like style properties and padding to make it larger than the width of the arc.
|
||||
|
||||
## Usage
|
||||
|
||||
### Create a color wheel
|
||||
|
||||
`lv_colorwheel_create(parent, knob_recolor)` creates a new color wheel. With `knob_recolor=true` the knob's background color will be set to the current color.
|
||||
|
||||
### Set color
|
||||
|
||||
The color can be set manually with `lv_colorwheel_set_hue/saturation/value(colorwheel, x)` or all at once with `lv_colorwheel_set_hsv(colorwheel, hsv)` or `lv_colorwheel_set_color(colorwheel, rgb)`
|
||||
|
||||
### Color mode
|
||||
|
||||
The current color mode can be manually selected with `lv_colorwheel_set_mode(colorwheel, LV_COLORWHEEL_MODE_HUE/SATURATION/VALUE)`.
|
||||
|
||||
The color mode can be fixed (so as to not change with long press) using `lv_colorwheel_set_mode_fixed(colorwheel, true)`
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent if a new color is selected.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_UP`, `LV_KEY_RIGHT` Increment the current parameter's value by 1
|
||||
- `LV_KEY_DOWN`, `LV_KEY_LEFT` Decrement the current parameter's value by 1
|
||||
- `LV_KEY_ENTER` A long press will show the next mode. Double click to reset the current parameter.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/colorwheel/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_colorwheel.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
70
LVGL.Simulator/lvgl/docs/widgets/extra/imgbtn.md
Normal file
70
LVGL.Simulator/lvgl/docs/widgets/extra/imgbtn.md
Normal file
@@ -0,0 +1,70 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/imgbtn.md
|
||||
```
|
||||
# Image button (lv_imgbtn)
|
||||
|
||||
## Overview
|
||||
|
||||
The Image button is very similar to the simple 'Button' object. The only difference is that it displays user-defined images in each state instead of drawing a rectangle.
|
||||
|
||||
You can set a left, right and center image, and the center image will be repeated to match the width of the object.
|
||||
|
||||
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` Refers to the image(s). If background style properties are used, a rectangle will be drawn behind the image button.
|
||||
|
||||
## Usage
|
||||
|
||||
### Image sources
|
||||
To set the image in a state, use the `lv_imgbtn_set_src(imgbtn, LV_IMGBTN_STATE_..., src_left, src_center, src_right)`.
|
||||
|
||||
The image sources work the same as described in the [Image object](/widgets/core/img) except that "Symbols" are not supported by the Image button.
|
||||
Any of the sources can `NULL`.
|
||||
|
||||
The possible states are:
|
||||
- `LV_IMGBTN_STATE_RELEASED`
|
||||
- `LV_IMGBTN_STATE_PRESSED`
|
||||
- `LV_IMGBTN_STATE_DISABLED`
|
||||
- `LV_IMGBTN_STATE_CHECKED_RELEASED`
|
||||
- `LV_IMGBTN_STATE_CHECKED_PRESSED`
|
||||
- `LV_IMGBTN_STATE_CHECKED_DISABLED`
|
||||
|
||||
If you set sources only in `LV_IMGBTN_STATE_RELEASED`, these sources will be used in other states too.
|
||||
If you set e.g. `LV_IMGBTN_STATE_PRESSED` they will be used in pressed state instead of the released images.
|
||||
|
||||
|
||||
### States
|
||||
Instead of the regular `lv_obj_add/clear_state()` functions the `lv_imgbtn_set_state(imgbtn, LV_IMGBTN_STATE_...)` functions should be used to manually set a state.
|
||||
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when the button is toggled.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_RIGHT/UP` Go to toggled state if `LV_OBJ_FLAG_CHECKABLE` is enabled.
|
||||
- `LV_KEY_LEFT/DOWN` Go to non-toggled state if `LV_OBJ_FLAG_CHECKABLE` is enabled.
|
||||
- `LV_KEY_ENTER` Clicks the button
|
||||
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/imgbtn/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_imgbtn.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
31
LVGL.Simulator/lvgl/docs/widgets/extra/index.md
Normal file
31
LVGL.Simulator/lvgl/docs/widgets/extra/index.md
Normal file
@@ -0,0 +1,31 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/object-types/index.md
|
||||
```
|
||||
# Extra widgets
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. toctree::
|
||||
:maxdepth: 1
|
||||
|
||||
animimg
|
||||
calendar
|
||||
chart
|
||||
colorwheel
|
||||
imgbtn
|
||||
keyboard
|
||||
led
|
||||
list
|
||||
menu
|
||||
meter
|
||||
msgbox
|
||||
span
|
||||
spinbox
|
||||
spinner
|
||||
tabview
|
||||
tileview
|
||||
win
|
||||
```
|
||||
|
||||
|
||||
96
LVGL.Simulator/lvgl/docs/widgets/extra/keyboard.md
Normal file
96
LVGL.Simulator/lvgl/docs/widgets/extra/keyboard.md
Normal file
@@ -0,0 +1,96 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/keyboard.md
|
||||
```
|
||||
|
||||
|
||||
# Keyboard (lv_keyboard)
|
||||
|
||||
## Overview
|
||||
|
||||
The Keyboard object is a special [Button matrix](/widgets/core/btnmatrix) with predefined keymaps and other features to realize a virtual keyboard to write texts into a [Text area](/widgets/core/textarea).
|
||||
|
||||
## Parts and Styles
|
||||
Similarly to Button matrices Keyboards consist of 2 part:
|
||||
- `LV_PART_MAIN` The main part. Uses all the typical background properties
|
||||
- `LV_PART_ITEMS` The buttons. Also uses all typical background properties as well as the *text* properties.
|
||||
|
||||
## Usage
|
||||
|
||||
### Modes
|
||||
The Keyboards have the following modes:
|
||||
- `LV_KEYBOARD_MODE_TEXT_LOWER` Display lower case letters
|
||||
- `LV_KEYBOARD_MODE_TEXT_UPPER` Display upper case letters
|
||||
- `LV_KEYBOARD_MODE_TEXT_SPECIAL` Display special characters
|
||||
- `LV_KEYBOARD_MODE_NUMBER` Display numbers, +/- sign, and decimal dot
|
||||
- `LV_KEYBOARD_MODE_USER_1` through `LV_KEYBOARD_MODE_USER_4` User-defined modes.
|
||||
|
||||
The `TEXT` modes' layout contains buttons to change mode.
|
||||
|
||||
To set the mode manually, use `lv_keyboard_set_mode(kb, mode)`. The default mode is `LV_KEYBOARD_MODE_TEXT_UPPER`.
|
||||
|
||||
### Assign Text area
|
||||
You can assign a [Text area](/widgets/core/textarea) to the Keyboard to automatically put the clicked characters there.
|
||||
To assign the text area, use `lv_keyboard_set_textarea(kb, ta)`.
|
||||
|
||||
### Key Popovers
|
||||
To enable key popovers on press, like on common Android and iOS keyboards, use `lv_keyboard_set_popovers(kb, true)`. The default control maps are preconfigured to only show the popovers on keys that produce a symbol and not on e.g. space. If you use a custom keymap, set the `LV_BTNMATRIX_CTRL_POPOVER` flag for all keys that you want to show a popover.
|
||||
|
||||
Note that popovers for keys in the top row will draw outside the widget boundaries. To account for this, reserve extra free space on top of the keyboard or ensure that the keyboard is added _after_ any widgets adjacent to its top boundary so that the popovers can draw over those.
|
||||
|
||||
The popovers currently are merely a visual effect and don't allow selecting additional characters such as accents yet.
|
||||
|
||||
### New Keymap
|
||||
You can specify a new map (layout) for the keyboard with `lv_keyboard_set_map(kb, map)` and `lv_keyboard_set_ctrl_map(kb, ctrl_map)`.
|
||||
Learn more about the [Button matrix](/widgets/core/btnmatrix) object.
|
||||
Keep in mind that using following keywords will have the same effect as with the original map:
|
||||
- `LV_SYMBOL_OK` Apply.
|
||||
- `LV_SYMBOL_CLOSE` or `LV_SYMBOL_KEYBOARD` Close.
|
||||
- `LV_SYMBOL_BACKSPACE` Delete on the left.
|
||||
- `LV_SYMBOL_LEFT` Move the cursor left.
|
||||
- `LV_SYMBOL_RIGHT` Move the cursor right.
|
||||
- `LV_SYMBOL_NEW_LINE` New line.
|
||||
- *"ABC"* Load the uppercase map.
|
||||
- *"abc"* Load the lower case map.
|
||||
- *"1#"* Load the lower case map.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when the button is pressed/released or repeated after long press. The event data is set to the ID of the pressed/released button.
|
||||
- `LV_EVENT_READY` - The *Ok* button is clicked.
|
||||
- `LV_EVENT_CANCEL` - The *Close* button is clicked.
|
||||
|
||||
The keyboard has a **default event handler** callback called `lv_keyboard_def_event_cb`, which handles the button pressing, map changing, the assigned text area, etc. You can remove it and replace it with a custom event handler if you wish.
|
||||
|
||||
```eval_rst
|
||||
.. note::
|
||||
In 8.0 and newer, adding an event handler to the keyboard does not remove the default event handler.
|
||||
This behavior differs from v7, where adding an event handler would always replace the previous one.
|
||||
```
|
||||
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_RIGHT/UP/LEFT/RIGHT` To navigate among the buttons and select one.
|
||||
- `LV_KEY_ENTER` To press/release the selected button.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
## Examples
|
||||
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/keyboard/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_keyboard.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
58
LVGL.Simulator/lvgl/docs/widgets/extra/led.md
Normal file
58
LVGL.Simulator/lvgl/docs/widgets/extra/led.md
Normal file
@@ -0,0 +1,58 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/led.md
|
||||
```
|
||||
# LED (lv_led)
|
||||
|
||||
## Overview
|
||||
|
||||
The LEDs are rectangle-like (or circle) object whose brightness can be adjusted. With lower brightness the colors of the LED become darker.
|
||||
|
||||
## Parts and Styles
|
||||
The LEDs have only one main part, called `LV_LED_PART_MAIN` and it uses all the typical background style properties.
|
||||
|
||||
## Usage
|
||||
|
||||
### Color
|
||||
You can set the color of the LED with `lv_led_set_color(led, lv_color_hex(0xff0080))`.
|
||||
This will be used as background color, border color, and shadow color.
|
||||
|
||||
### Brightness
|
||||
You can set their brightness with `lv_led_set_bright(led, bright)`. The brightness should be between 0 (darkest) and 255 (lightest).
|
||||
|
||||
### Toggle
|
||||
Use `lv_led_on(led)` and `lv_led_off(led)` to set the brightness to a predefined ON or OFF value. The `lv_led_toggle(led)` toggles between the ON and OFF state.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` is sent for the following types:
|
||||
- `LV_LED_DRAW_PART_RECTANGLE` The main rectangle. `LV_OBJ_DRAW_PART_RECTANGLE` is not sent by the base object.
|
||||
- `part`: `LV_PART_MAIN`
|
||||
- `rect_dsc`
|
||||
- `draw_area`: the area of the rectangle
|
||||
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/led/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_led.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
55
LVGL.Simulator/lvgl/docs/widgets/extra/list.md
Normal file
55
LVGL.Simulator/lvgl/docs/widgets/extra/list.md
Normal file
@@ -0,0 +1,55 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/list.md
|
||||
```
|
||||
# List (lv_list)
|
||||
|
||||
## Overview
|
||||
The List is basically a rectangle with vertical layout to which Buttons and Texts can be added
|
||||
|
||||
## Parts and Styles
|
||||
|
||||
**Background**
|
||||
- `LV_PART_MAIN` The main part of the list that uses all the typical background properties
|
||||
- `LV_PART_SCROLLBAR` The scrollbar. See the [Base objects](/widgets/obj) documentation for details.
|
||||
|
||||
**Buttons and Texts**
|
||||
See the [Button](/widgets/core/btn)'s and [Label](/widgets/core/label)'s documentation.
|
||||
|
||||
## Usage
|
||||
|
||||
### Buttons
|
||||
`lv_list_add_btn(list, icon, text)` adds a full-width button with an icon - that can be an image or symbol - and a text.
|
||||
|
||||
The text starts to scroll horizontally if it's too long.
|
||||
|
||||
### Texts
|
||||
`lv_list_add_text(list, text)` adds a text.
|
||||
|
||||
|
||||
## Events
|
||||
No special events are sent by the List, but sent by the Button as usual.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/list/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_list.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
94
LVGL.Simulator/lvgl/docs/widgets/extra/menu.md
Normal file
94
LVGL.Simulator/lvgl/docs/widgets/extra/menu.md
Normal file
@@ -0,0 +1,94 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/menu.md
|
||||
```
|
||||
# Menu (lv_menu)
|
||||
|
||||
## Overview
|
||||
The menu widget can be used to easily create multi-level menus. It handles the traversal between pages automatically.
|
||||
|
||||
## Parts and Styles
|
||||
The menu widget is built from the following objects:
|
||||
- Main container: lv_menu_main_cont
|
||||
- Main header: lv_menu_main_header_cont
|
||||
- Back btn: [lv_btn](/widgets/core/btn)
|
||||
- Back btn icon: [lv_img](/widgets/core/img)
|
||||
- Main page: lv_menu_page
|
||||
- Sidebar container: lv_menu_sidebar_cont
|
||||
- Sidebar header: lv_menu_sidebar_header_cont
|
||||
- Back btn: [lv_btn](/widgets/core/btn)
|
||||
- Back btn icon: [lv_img](/widgets/core/img)
|
||||
- Sidebar page: lv_menu_page
|
||||
|
||||
## Usage
|
||||
|
||||
### Create a menu
|
||||
`lv_menu_create(parent)` creates a new empty menu.
|
||||
|
||||
### Header mode
|
||||
The following header modes exist:
|
||||
- `LV_MENU_HEADER_TOP_FIXED` Header is positioned at the top.
|
||||
- `LV_MENU_HEADER_TOP_UNFIXED` Header is positioned at the top and can be scrolled out of view.
|
||||
- `LV_MENU_HEADER_BOTTOM_FIXED` Header is positioned at the bottom.
|
||||
|
||||
You can set header modes with `lv_menu_set_mode_header(menu, LV_MENU_HEADER...)`.
|
||||
|
||||
### Root back button mode
|
||||
The following root back button modes exist:
|
||||
- `LV_MENU_ROOT_BACK_BTN_DISABLED`
|
||||
- `LV_MENU_ROOT_BACK_BTN_ENABLED`
|
||||
|
||||
You can set root back button modes with `lv_menu_set_mode_root_back_btn(menu, LV_MENU_ROOT_BACK_BTN...)`.
|
||||
|
||||
### Create a menu page
|
||||
`lv_menu_page_create(menu, title)` creates a new empty menu page.
|
||||
You can add any widgets to the page.
|
||||
|
||||
### Set a menu page in the main area
|
||||
Once a menu page has been created, you can set it to the main area with `lv_menu_set_page(menu, page)`. NULL to clear main and clear menu history.
|
||||
|
||||
### Set a menu page in the sidebar
|
||||
Once a menu page has been created, you can set it to the sidebar with `lv_menu_set_sidebar_page(menu, page)`. NULL to clear sidebar.
|
||||
|
||||
### Linking between menu pages
|
||||
For instance, you have created a btn obj in the main page. When you click the btn obj, you want it to open up a new page, use `lv_menu_set_load_page_event(menu, obj, new page)`.
|
||||
|
||||
### Create a menu container, section, separator
|
||||
The following objects can be created so that it is easier to style the menu:
|
||||
|
||||
`lv_menu_cont_create(parent page)` creates a new empty container.
|
||||
|
||||
`lv_menu_section_create(parent page)` creates a new empty section.
|
||||
|
||||
`lv_menu_separator_create(parent page)` creates a separator.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when a page is shown.
|
||||
- `lv_menu_get_cur_main_page(menu)` returns a pointer to menu page that is currently displayed in main.
|
||||
- `lv_menu_get_cur_sidebar_page(menu)` returns a pointer to menu page that is currently displayed in sidebar.
|
||||
- `LV_EVENT_CLICKED` Sent when a back btn in a header from either main or sidebar is clicked. `LV_OBJ_FLAG_EVENT_BUBBLE` is enabled on the buttons so you can add events to the menu itself.
|
||||
- `lv_menu_back_btn_is_root(menu, btn)` to check if btn is root back btn
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No keys are handled by the menu widget.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
.. include:: ../../../examples/widgets/menu/index.rst
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
.. doxygenfile:: lv_menu.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
117
LVGL.Simulator/lvgl/docs/widgets/extra/meter.md
Normal file
117
LVGL.Simulator/lvgl/docs/widgets/extra/meter.md
Normal file
@@ -0,0 +1,117 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/meter.md
|
||||
```
|
||||
# Meter (lv_meter)
|
||||
|
||||
## Overview
|
||||
The Meter widget can visualize data in very flexible ways. In can show arcs, needles, ticks lines and labels.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The background of the Meter. Uses the typical background properties.
|
||||
- `LV_PART_TICK` The tick lines a labels using the *line* and *text* style properties.
|
||||
- `LV_PART_INDICATOR` The needle line or image using the *line* and *img* style properties, as well as the background properties to draw a square (or circle) on the pivot of the needles. Padding makes the square larger.
|
||||
- `LV_PART_ITEMS` The arcs using the *arc* properties.
|
||||
|
||||
## Usage
|
||||
|
||||
### Add a scale
|
||||
|
||||
First a *Scale* needs to be added to the Meter with `lv_meter_scale_t * scale = lv_meter_add_scale(meter)`.
|
||||
The Scale has minor and major ticks and labels on the major ticks. Later indicators (needles, arcs, tick modifiers) can be added to the meter
|
||||
|
||||
Any number of scales can be added to Meter.
|
||||
|
||||
The minor tick lines can be configured with: `lv_meter_set_scale_ticks(meter, scale, tick_count, line_width, tick_length, ctick_olor)`.
|
||||
|
||||
To add major tick lines use `lv_meter_set_scale_major_ticks(meter, scale, nth_major, tick_width, tick_length, tick_color, label_gap)`. `nth_major` to specify how many minor ticks to skip to draw a major tick.
|
||||
|
||||
Labels are added automatically on major ticks with `label_gap` distance from the ticks with text proportionally to the values of the tick line.
|
||||
|
||||
`lv_meter_set_scale_range(meter, scale, min, max, angle_range, rotation)` sets the value and angle range of the scale.
|
||||
|
||||
### Add indicators
|
||||
|
||||
Indicators need to be added to a Scale and their value is interpreted in the range of the Scale.
|
||||
|
||||
All the indicator add functions return `lv_meter_indicator_t *`.
|
||||
|
||||
#### Needle line
|
||||
|
||||
`indic = lv_meter_add_needle_line(meter, scale, line_width, line_color, r_mod)` adds a needle line to a Scale. By default, the length of the line is the same as the scale's radius but `r_mod` changes the length.
|
||||
|
||||
`lv_meter_set_indicator_value(meter, indic, value)` sets the value of the indicator.
|
||||
|
||||
#### Needle image
|
||||
|
||||
`indic = lv_meter_add_needle_img(meter, scale, img_src, pivot_x, pivot_y)` sets an image that will be used as a needle. `img_src` should be a needle pointing to the right like this `-O--->`.
|
||||
`pivot_x` and `pivot_y` sets the pivot point of the rotation relative to the top left corner of the image.
|
||||
|
||||
`lv_meter_set_indicator_value(meter, inidicator, value)` sets the value of the indicator.
|
||||
|
||||
#### Arc
|
||||
`indic = lv_meter_add_arc(meter, scale, arc_width, arc_color, r_mod)` adds and arc indicator. . By default, the radius of the arc is the same as the scale's radius but `r_mod` changes the radius.
|
||||
|
||||
`lv_meter_set_indicator_start_value(meter, indic, value)` and `lv_meter_set_indicator_end_value(meter, inidicator, value)` sets the value of the indicator.
|
||||
|
||||
#### Scale lines (ticks)
|
||||
`indic = lv_meter_add_scale_lines(meter, scale, color_start, color_end, local, width_mod)` adds an indicator that modifies the ticks lines.
|
||||
If `local` is `true` the ticks' color will be faded from `color_start` to `color_end` in the indicator's start and end value range.
|
||||
If `local` is `false` `color_start` and `color_end` will be mapped to the start and end value of the scale and only a "slice" of that color gradient will be visible in the indicator's start and end value range.
|
||||
`width_mod` modifies the width of the tick lines.
|
||||
|
||||
`lv_meter_set_indicator_start_value(meter, inidicator, value)` and `lv_meter_set_indicator_end_value(meter, inidicator, value)` sets the value of the indicator.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` is sent for the following types:
|
||||
- `LV_METER_DRAW_PART_ARC` The arc indicator
|
||||
- `part`: `LV_PART_ITEMS`
|
||||
- `sub_part_ptr`: pointer to the indicator
|
||||
- `arc_dsc`
|
||||
- `radius`: radius of the arc
|
||||
- `p1` center of the arc
|
||||
- `LV_METER_DRAW_PART_NEEDLE_LINE` The needle lines
|
||||
- `part`: `LV_PART_ITEMS`
|
||||
- `p1`, `p2` points of the line
|
||||
- `line_dsc`
|
||||
- `sub_part_ptr`: pointer to the indicator
|
||||
- `LV_METER_DRAW_PART_NEEDLE_IMG` The needle images
|
||||
- `part`: `LV_PART_ITEMS`
|
||||
- `p1`, `p2` points of the line
|
||||
- `img_dsc`
|
||||
- `sub_part_ptr`: pointer to the indicator
|
||||
- `LV_METER_DRAW_PART_TICK` The tick lines and labels
|
||||
- `part`: `LV_PART_TICKS`
|
||||
- `value`: the value of the line
|
||||
- `text`: `value` converted to decimal or `NULL` on minor lines
|
||||
- `label_dsc`: label draw descriptor or `NULL` on minor lines
|
||||
- `line_dsc`:
|
||||
- `id`: the index of the line
|
||||
|
||||
|
||||
See the events of the [Base object](/widgets/obj) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No keys are handled by the Meter widget.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/meter/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_meter.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
71
LVGL.Simulator/lvgl/docs/widgets/extra/msgbox.md
Normal file
71
LVGL.Simulator/lvgl/docs/widgets/extra/msgbox.md
Normal file
@@ -0,0 +1,71 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/msgbox.md
|
||||
```
|
||||
# Message box (lv_msgbox)
|
||||
|
||||
## Overview
|
||||
The Message boxes act as pop-ups.
|
||||
They are built from a background container, a title, an optional close button, a text and optional buttons.
|
||||
|
||||
The text will be broken into multiple lines automatically and the height will be set automatically to include the text and the buttons.
|
||||
|
||||
The message box can be modal (blocking clicks on the rest of the screen) or not modal.
|
||||
|
||||
## Parts and Styles
|
||||
The message box is built from other widgets, so you can check these widgets' documentation for details.
|
||||
- Background: [lv_obj](/widgets/obj)
|
||||
- Close button: [lv_btn](/widgets/core/btn)
|
||||
- Title and text: [lv_label](/widgets/core/label)
|
||||
- Buttons: [lv_btnmatrix](/widgets/core/btnmatrix)
|
||||
|
||||
## Usage
|
||||
|
||||
### Create a message box
|
||||
|
||||
`lv_msgbox_create(parent, title, txt, btn_txts[], add_close_btn)` creates a message box.
|
||||
|
||||
If `parent` is `NULL` the message box will be modal. `title` and `txt` are strings for the title and the text.
|
||||
`btn_txts[]` is an array with the buttons' text. E.g. `const char * btn_txts[] = {"Ok", "Cancel", NULL}`.
|
||||
`add_close_btn` can be `true` or `false` to add/don't add a close button.
|
||||
|
||||
### Get the parts
|
||||
The building blocks of the message box can be obtained using the following functions:
|
||||
```c
|
||||
lv_obj_t * lv_msgbox_get_title(lv_obj_t * mbox);
|
||||
lv_obj_t * lv_msgbox_get_close_btn(lv_obj_t * mbox);
|
||||
lv_obj_t * lv_msgbox_get_text(lv_obj_t * mbox);
|
||||
lv_obj_t * lv_msgbox_get_btns(lv_obj_t * mbox);
|
||||
```
|
||||
|
||||
### Close the message box
|
||||
`lv_msgbox_close(msgbox)` closes (deletes) the message box.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` is sent by the buttons if one of them is clicked. `LV_OBJ_FLAG_EVENT_BUBBLE` is enabled on the buttons so you can add events to the message box itself.
|
||||
In the event handler, `lv_event_get_target(e)` will return the button matrix and `lv_event_get_current_target(e)` will return the message box. `lv_msgbox_get_active_btn(msgbox)` and `lv_msgbox_get_active_btn_text(msgbox)` can be used to get the index and text of the clicked button.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
Keys have effect on the close button and button matrix. You can add them manually to a group if required.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/msgbox/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_msgbox.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
89
LVGL.Simulator/lvgl/docs/widgets/extra/span.md
Normal file
89
LVGL.Simulator/lvgl/docs/widgets/extra/span.md
Normal file
@@ -0,0 +1,89 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/span.md
|
||||
```
|
||||
# Span (lv_span)
|
||||
|
||||
## Overview
|
||||
|
||||
A spangroup is the object that is used to display rich text. Different from the label object, `spangroup` can render text styled with different fonts, colors, and sizes into the spangroup object.
|
||||
|
||||
## Parts and Styles
|
||||
- `LV_PART_MAIN` The spangroup has only one part.
|
||||
|
||||
## Usage
|
||||
|
||||
### Set text and style
|
||||
|
||||
The spangroup object uses span to describe text and text style. so, first we need to create `span` descriptor using `lv_span_t * span = lv_spangroup_new_span(spangroup)`. Then use `lv_span_set_text(span, "text")` to set text. The style of the span is configured as with a normal style object by using its `style` member, eg:`lv_style_set_text_color(&span->style, lv_palette_main(LV_PALETTE_RED))`.
|
||||
|
||||
If spangroup object `mode != LV_SPAN_MODE_FIXED` you must call `lv_spangroup_refr_mode()` after you have modified `span` style(eg:set text, changed the font size, del span).
|
||||
|
||||
### Retrieving a span child
|
||||
Spangroups store their children differently from normal objects, so normal functions for getting children won't work.
|
||||
|
||||
`lv_spangroup_get_child(spangroup, id)` will return a pointer to the child span at index `id`. In addition, `id` can be negative to index from the end of the spangroup where `-1` is the youngest child, `-2` is second youngest, etc.
|
||||
|
||||
e.g. `lv_span_t* span = lv_spangroup_get_child(spangroup, 0)` will return the first child of the spangroup. `lv_span_t* span = lv_spangroup_get_child(spangroup, -1)` will return the last (or most recent) child.
|
||||
|
||||
### Child Count
|
||||
Use the function `lv_spangroup_get_child_cnt(spangroup)` to get back the number of spans the group is maintaining.
|
||||
|
||||
e.g. `uint32_t size = lv_spangroup_get_child_cnt(spangroup)`
|
||||
|
||||
### Text align
|
||||
like label object, the spangroup can be set to one the following modes:
|
||||
- `LV_TEXT_ALIGN_LEFT` Align text to left.
|
||||
- `LV_TEXT_ALIGN_CENTER` Align text to center.
|
||||
- `LV_TEXT_ALIGN_RIGHT` Align text to right.
|
||||
- `LV_TEXT_ALIGN_AUTO` Align text auto.
|
||||
|
||||
use function `lv_spangroup_set_align(spangroup, LV_TEXT_ALIGN_CENTER)` to set text align.
|
||||
|
||||
### Modes
|
||||
The spangroup can be set to one the following modes:
|
||||
- `LV_SPAN_MODE_FIXED` fixes the object size.
|
||||
- `LV_SPAN_MODE_EXPAND` Expand the object size to the text size but stay on a single line.
|
||||
- `LV_SPAN_MODE_BREAK` Keep width, break the too long lines and auto expand height.
|
||||
|
||||
Use `lv_spangroup_set_mode(spangroup, LV_SPAN_MODE_BREAK)` to set object mode.
|
||||
|
||||
### Overflow
|
||||
The spangroup can be set to one the following modes:
|
||||
- `LV_SPAN_OVERFLOW_CLIP` truncates the text at the limit of the area.
|
||||
- `LV_SPAN_OVERFLOW_ELLIPSIS` will display an ellipsis(`...`) when text overflows the area.
|
||||
|
||||
Use `lv_spangroup_set_overflow(spangroup, LV_SPAN_OVERFLOW_CLIP)` to set object overflow mode.
|
||||
|
||||
### first line indent
|
||||
Use `lv_spangroup_set_indent(spangroup, 20)` to set the indent of the first line. all modes support pixel units, in addition to LV_SPAN_MODE_FIXED and LV_SPAN_MODE_BREAK mode supports percentage units too.
|
||||
|
||||
### lines
|
||||
Use `lv_spangroup_set_lines(spangroup, 10)` to set the maximum number of lines to be displayed in LV_SPAN_MODE_BREAK mode, negative values indicate no limit.
|
||||
|
||||
## Events
|
||||
No special events are sent by this widget.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/span/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_span.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
63
LVGL.Simulator/lvgl/docs/widgets/extra/spinbox.md
Normal file
63
LVGL.Simulator/lvgl/docs/widgets/extra/spinbox.md
Normal file
@@ -0,0 +1,63 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/spinbox.md
|
||||
```
|
||||
# Spinbox (lv_spinbox)
|
||||
|
||||
## Overview
|
||||
The Spinbox contains a number as text which can be increased or decreased by *Keys* or API functions.
|
||||
Under the hood the Spinbox is a modified [Text area](/widgets/core/textarea).
|
||||
|
||||
## Parts and Styles
|
||||
The parts of the Spinbox are identical to the [Text area](/widgets/core/textarea).
|
||||
|
||||
### Value, range and step
|
||||
`lv_spinbox_set_value(spinbox, 1234)` sets a new value on the Spinbox.
|
||||
|
||||
`lv_spinbox_increment(spinbox)` and `lv_spinbox_decrement(spinbox)` increments/decrements the value of the Spinbox according to the currently selected digit.
|
||||
|
||||
`lv_spinbox_set_range(spinbox, -1000, 2500)` sets a range. If the value is changed by `lv_spinbox_set_value`, by *Keys*,`lv_spinbox_increment/decrement` this range will be respected.
|
||||
|
||||
`lv_spinbox_set_step(spinbox, 100)` sets which digits to change on increment/decrement. Only multiples of ten can be set, and not for example 3.
|
||||
|
||||
`lv_spinbox_set_pos(spinbox, 1)` sets the cursor to a specific digit to change on increment/decrement. For example position '0' sets the cursor to the least significant digit.
|
||||
|
||||
If an encoder is used as input device, the selected digit is shifted to the right by default whenever the encoder button is clicked. To change this behaviour to shifting to the left, the `lv_spinbox_set_digit_step_direction(spinbox, LV_DIR_LEFT)` can be used
|
||||
|
||||
### Format
|
||||
|
||||
`lv_spinbox_set_digit_format(spinbox, digit_count, separator_position)` sets the number format. `digit_count` is the number of digits excluding the decimal separator and the sign.
|
||||
`separator_position` is the number of digits before the decimal point. If 0, no decimal point is displayed.
|
||||
|
||||
### Rollover
|
||||
`lv_spinbox_set_rollover(spinbox, true/false)` enables/disabled rollover mode. If either the minimum or maximum value is reached with rollover enabled, the value will change to the other limit. If rollover is disabled the value will remain at the minimum or maximum value.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when the value has changed.
|
||||
|
||||
See the events of the [Text area](/widgets/core/textarea) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
- `LV_KEY_LEFT/RIGHT` With *Keypad* move the cursor left/right. With *Encoder* decrement/increment the selected digit.
|
||||
- `LV_KEY_UP/DOWN` With *Keypad* and *Encoder* increment/decrement the value.
|
||||
- `LV_KEY_ENTER` With *Encoder* got the net digit. Jump to the first after the last.
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/spinbox/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_spinbox.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
## Example
|
||||
48
LVGL.Simulator/lvgl/docs/widgets/extra/spinner.md
Normal file
48
LVGL.Simulator/lvgl/docs/widgets/extra/spinner.md
Normal file
@@ -0,0 +1,48 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/spinner.md
|
||||
```
|
||||
# Spinner (lv_spinner)
|
||||
|
||||
## Overview
|
||||
The Spinner object is a spinning arc over a ring.
|
||||
|
||||
## Parts and Styles
|
||||
The parts are identical to the parts of [lv_arc](/widgets/core/arc).
|
||||
|
||||
## Usage
|
||||
|
||||
### Create a spinner
|
||||
|
||||
To create a spinner use `lv_spinner_create(parent, spin_time, arc_length)`. `spin time` sets the spin time in milliseconds, `arc_length` sets the length of the spinning arc in degrees.
|
||||
|
||||
## Events
|
||||
No special events are sent to the Spinner.
|
||||
|
||||
See the events of the [Arc](/widgets/core/arc) too.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are processed by the object type.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/spinner/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_spinner.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
72
LVGL.Simulator/lvgl/docs/widgets/extra/tabview.md
Normal file
72
LVGL.Simulator/lvgl/docs/widgets/extra/tabview.md
Normal file
@@ -0,0 +1,72 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/tabview.md
|
||||
```
|
||||
|
||||
# Tabview (lv_tabview)
|
||||
|
||||
## Overview
|
||||
|
||||
The Tab view object can be used to organize content in tabs.
|
||||
The Tab view is built from other widgets:
|
||||
- Main container: [lv_obj](/widgets/obj))
|
||||
- Tab buttons: [lv_btnmatrix](/widgets/core/btnmatrix)
|
||||
- Container for the tabs: [lv_obj](/widgets/obj)
|
||||
- Content of the tabs: [lv_obj](/widgets/obj)
|
||||
|
||||
The tab buttons can be positioned on the top, bottom, left and right side of the Tab view.
|
||||
|
||||
A new tab can be selected either by clicking on a tab button or by sliding horizontally on the content.
|
||||
|
||||
## Parts and Styles
|
||||
There are no special parts on the Tab view but the `lv_obj` and `lv_btnnmatrix` widgets are used to create the Tab view.
|
||||
|
||||
## Usage
|
||||
|
||||
### Create a Tab view
|
||||
|
||||
`lv_tabview_create(parent, tab_pos, tab_size);` creates a new empty Tab view. `tab_pos` can be `LV_DIR_TOP/BOTTOM/LEFT/RIGHT` to position the tab buttons to a side.
|
||||
`tab_size` is the height (in case of `LV_DIR_TOP/BOTTOM`) or width (in case of `LV_DIR_LEFT/RIGHT`) tab buttons.
|
||||
|
||||
### Add tabs
|
||||
|
||||
New tabs can be added with `lv_tabview_add_tab(tabview, "Tab name")`. This will return a pointer to an [lv_obj](/widgets/obj) object where the tab's content can be created.
|
||||
|
||||
### Change tab
|
||||
|
||||
To select a new tab you can:
|
||||
- Click on its tab button
|
||||
- Slide horizontally
|
||||
- Use `lv_tabview_set_act(tabview, id, LV_ANIM_ON/OFF)` function
|
||||
|
||||
### Get the parts
|
||||
|
||||
`lv_tabview_get_content(tabview)` returns the container for the tabs, `lv_tabview_get_tab_btns(tabview)` returns the Tab buttons object which is a [Button matrix](/widgets/core/btnmatrix).
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when a new tab is selected by sliding or clicking the tab button. `lv_tabview_get_tab_act(tabview)` returns the zero based index of the current tab.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
|
||||
Keys have effect only on the tab buttons (Button matrix). Add manually to a group if required.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/tabview/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_tabview.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
58
LVGL.Simulator/lvgl/docs/widgets/extra/tileview.md
Normal file
58
LVGL.Simulator/lvgl/docs/widgets/extra/tileview.md
Normal file
@@ -0,0 +1,58 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/tileview.md
|
||||
```
|
||||
# Tile view (lv_tileview)
|
||||
|
||||
## Overview
|
||||
|
||||
The Tile view is a container object whose elements (called *tiles*) can be arranged in grid form.
|
||||
A user can navigate between the tiles by swiping.
|
||||
Any direction of swiping can be disabled on the tiles individually to not allow moving from one tile to another.
|
||||
|
||||
If the Tile view is screen sized, the user interface resembles what you may have seen on smartwatches.
|
||||
|
||||
## Parts and Styles
|
||||
The Tile view is built from an [lv_obj](/widgets/obj) container and [lv_obj](/widgets/obj) tiles.
|
||||
|
||||
The parts and styles work the same as for [lv_obj](/widgets/obj).
|
||||
|
||||
## Usage
|
||||
|
||||
### Add a tile
|
||||
|
||||
`lv_tileview_add_tile(tileview, row_id, col_id, dir)` creates a new tile on the `row_id`th row and `col_id`th column.
|
||||
`dir` can be `LV_DIR_LEFT/RIGHT/TOP/BOTTOM/HOR/VER/ALL` or OR-ed values to enable moving to the adjacent tiles into the given direction by swiping.
|
||||
|
||||
The returned value is an `lv_obj_t *` on which the content of the tab can be created.
|
||||
|
||||
### Change tile
|
||||
The Tile view can scroll to a tile with `lv_obj_set_tile(tileview, tile_obj, LV_ANIM_ON/OFF)` or `lv_obj_set_tile_id(tileviewv, col_id, row_id, LV_ANIM_ON/OFF);`
|
||||
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` Sent when a new tile loaded by scrolling. `lv_tileview_get_tile_act(tabview)` can be used to get current tile.
|
||||
|
||||
## Keys
|
||||
*Keys* are not handled by the Tile view.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/tileview/index.rst
|
||||
|
||||
```
|
||||
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_tileview.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
65
LVGL.Simulator/lvgl/docs/widgets/extra/win.md
Normal file
65
LVGL.Simulator/lvgl/docs/widgets/extra/win.md
Normal file
@@ -0,0 +1,65 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/extra/win.md
|
||||
```
|
||||
# Window (lv_win)
|
||||
|
||||
## Overview
|
||||
|
||||
The Window is container-like object built from a header with title and buttons and a content area.
|
||||
|
||||
## Parts and Styles
|
||||
The Window is built from other widgets so you can check their documentation for details:
|
||||
- Background: [lv_obj](/widgets/obj)
|
||||
- Header on the background: [lv_obj](/widgets/obj)
|
||||
- Title on the header: [lv_label](/widgets/core/label)
|
||||
- Buttons on the header: [lv_btn](/widgets/core/btn)
|
||||
- Content area on the background: [lv_obj](/widgets/obj)
|
||||
|
||||
|
||||
## Usage
|
||||
|
||||
### Create a Window
|
||||
|
||||
`lv_win_create(parent, header_height)` creates a Window with an empty header.
|
||||
|
||||
### Title and buttons
|
||||
|
||||
Any number of texts (but typically only one) can be added to the header with `lv_win_add_title(win, "The title")`.
|
||||
|
||||
Control buttons can be added to the window's header with `lv_win_add_btn(win, icon, btn_width)`. `icon` can be any image source, and `btn_width` is the width of the button.
|
||||
|
||||
The title and the buttons will be added in the order the functions are called. So adding a button, a text and two other buttons will result in a button on the left, a title, and 2 buttons on the right.
|
||||
The width of the title is set to take all the remaining space on the header. In other words: it pushes to the right all the buttons that are added after the title.
|
||||
|
||||
## Get the parts
|
||||
`lv_win_get_header(win)` returns a pointer to the header, `lv_win_get_content(win)` returns a pointer to the content container to which the content of the window can be added.
|
||||
|
||||
## Events
|
||||
No special events are sent by the windows, however events can be added manually to the return value of `lv_win_add_btn`.
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
No *Keys* are handled by the window.
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../../examples/widgets/win/index.rst
|
||||
|
||||
```
|
||||
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_win.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
17
LVGL.Simulator/lvgl/docs/widgets/index.md
Normal file
17
LVGL.Simulator/lvgl/docs/widgets/index.md
Normal file
@@ -0,0 +1,17 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/object-types/index.md
|
||||
```
|
||||
# Widgets
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. toctree::
|
||||
:maxdepth: 1
|
||||
|
||||
obj
|
||||
core/index
|
||||
extra/index
|
||||
```
|
||||
|
||||
|
||||
202
LVGL.Simulator/lvgl/docs/widgets/obj.md
Normal file
202
LVGL.Simulator/lvgl/docs/widgets/obj.md
Normal file
@@ -0,0 +1,202 @@
|
||||
```eval_rst
|
||||
.. include:: /header.rst
|
||||
:github_url: |github_link_base|/widgets/obj.md
|
||||
```
|
||||
# Base object (lv_obj)
|
||||
|
||||
## Overview
|
||||
|
||||
The 'Base Object' implements the basic properties of widgets on a screen, such as:
|
||||
- coordinates
|
||||
- parent object
|
||||
- children
|
||||
- contains the styles
|
||||
- attributes like *Clickable*, *Scrollable*, etc.
|
||||
|
||||
In object-oriented thinking, it is the base class from which all other objects in LVGL are inherited.
|
||||
|
||||
The functions and functionalities of the Base object can be used with other widgets too. For example `lv_obj_set_width(slider, 100)`
|
||||
|
||||
The Base object can be directly used as a simple widget: it's nothing more than a rectangle. In HTML terms, think of it as a `<div>`.
|
||||
|
||||
### Coordinates
|
||||
|
||||
Only a small subset of coordinate settings is described here. To see all the features of LVGL (padding, coordinates in styles, layouts, etc) visit the [Coordinates](/overview/coords) page.
|
||||
|
||||
#### Size
|
||||
The object size can be modified on individual axes with `lv_obj_set_width(obj, new_width)` and `lv_obj_set_height(obj, new_height)`, or both axes can be modified at the same time with `lv_obj_set_size(obj, new_width, new_height)`.
|
||||
|
||||
#### Position
|
||||
You can set the position relative to the parent with `lv_obj_set_x(obj, new_x)` and `lv_obj_set_y(obj, new_y)`, or both axes at the same time with `lv_obj_set_pos(obj, new_x, new_y)`.
|
||||
|
||||
#### Alignment
|
||||
You can align the object on its parent with `lv_obj_set_align(obj, LV_ALIGN_...)`. After this every x and y setting will be relative to the set alignment mode.
|
||||
For example, this will shift the object by 10;20 px from the center of its parent:
|
||||
```c
|
||||
lv_obj_set_align(obj, LV_ALIGN_CENTER);
|
||||
lv_obj_set_pos(obj, 10, 20);
|
||||
|
||||
//Or in one function
|
||||
lv_obj_align(obj, LV_ALIGN_CENTER, 10, 20);
|
||||
```
|
||||
|
||||
To align one object to another use: `lv_obj_align_to(obj_to_align, obj_referece, LV_ALIGN_..., x, y)`
|
||||
|
||||
For example, to align a text below an image: `lv_obj_align_to(text, image, LV_ALIGN_OUT_BOTTOM_MID, 0, 10)`.
|
||||
|
||||
The following align types exist:
|
||||

|
||||
|
||||
|
||||
### Parents and children
|
||||
You can set a new parent for an object with `lv_obj_set_parent(obj, new_parent)`. To get the current parent, use `lv_obj_get_parent(obj)`.
|
||||
|
||||
To get a specific child of a parent use `lv_obj_get_child(parent, idx)`. Some examples for `idx`:
|
||||
- `0` get the child created first
|
||||
- `1` get the child created second
|
||||
- `-1` get the child created last
|
||||
|
||||
The children can be iterated lke this:
|
||||
```c
|
||||
uint32_t i;
|
||||
for(i = 0; i < lv_obj_get_child_cnt(parent); i++) {
|
||||
lv_obj_t * child = lv_obj_get_child(parent, i);
|
||||
/*Do something with child*/
|
||||
}
|
||||
```
|
||||
|
||||
`lv_obj_get_index(obj)` returns the index of the object in its parent. It is equivalent to the number of younger children in the parent.
|
||||
|
||||
You can bring an object to the foreground or send it to the background with `lv_obj_move_foreground(obj)` and `lv_obj_move_background(obj)`.
|
||||
|
||||
You can change the index of an object in its parent using `lv_obj_move_to_index(obj, index)`.
|
||||
|
||||
You can swap the position of two objects with `lv_obj_swap(obj1, obj2)`.
|
||||
|
||||
### Display and Screens
|
||||
|
||||
At the highest level of the LVGL object hierarchy is the *display* which represents the driver for a display device (physical display or simulator). A display can have one or more screens associated with it. Each screen contains a hierarchy of objects for graphical widgets representing a layout that covers the entire display.
|
||||
|
||||
When you have created a screen like `lv_obj_t * screen = lv_obj_create(NULL)`, you can make it active with `lv_scr_load(screen)`. The `lv_scr_act()` function gives you a pointer to the active screen.
|
||||
|
||||
If you have multiple displays, it's important to know that the screen functions operate on the most recently created display or the one explicitly selected with `lv_disp_set_default`.
|
||||
|
||||
To get an object's screen use the `lv_obj_get_screen(obj)` function.
|
||||
|
||||
### Events
|
||||
|
||||
To set an event callback for an object, use `lv_obj_add_event_cb(obj, event_cb, LV_EVENT_..., user_data)`,
|
||||
|
||||
To manually send an event to an object, use `lv_event_send(obj, LV_EVENT_..., param)`
|
||||
|
||||
Read the [Event overview](/overview/event) to learn more about events.
|
||||
|
||||
|
||||
### Styles
|
||||
Be sure to read the [Style overview](/overview/style). Here only the most essential functions are described.
|
||||
|
||||
A new style can be added to an object with the `lv_obj_add_style(obj, &new_style, selector)` function.
|
||||
`selector` is an ORed combination of part and state(s). E.g. `LV_PART_SCROLLBAR | LV_STATE_PRESSED`.
|
||||
|
||||
The base objects use `LV_PART_MAIN` style properties and `LV_PART_SCROLLBAR` with the typical background style properties.
|
||||
|
||||
|
||||
### Flags
|
||||
There are some attributes which can be enabled/disabled by `lv_obj_add/clear_flag(obj, LV_OBJ_FLAG_...)`:
|
||||
|
||||
- `LV_OBJ_FLAG_HIDDEN` Make the object hidden. (Like it wasn't there at all)
|
||||
- `LV_OBJ_FLAG_CLICKABLE` Make the object clickable by input devices
|
||||
- `LV_OBJ_FLAG_CLICK_FOCUSABLE` Add focused state to the object when clicked
|
||||
- `LV_OBJ_FLAG_CHECKABLE` Toggle checked state when the object is clicked
|
||||
- `LV_OBJ_FLAG_SCROLLABLE` Make the object scrollable
|
||||
- `LV_OBJ_FLAG_SCROLL_ELASTIC` Allow scrolling inside but with slower speed
|
||||
- `LV_OBJ_FLAG_SCROLL_MOMENTUM` Make the object scroll further when "thrown"
|
||||
- `LV_OBJ_FLAG_SCROLL_ONE` Allow scrolling only one snappable children
|
||||
- `LV_OBJ_FLAG_SCROLL_CHAIN_HOR` Allow propagating the horizontal scroll to a parent
|
||||
- `LV_OBJ_FLAG_SCROLL_CHAIN_VER` Allow propagating the vertical scroll to a parent
|
||||
- `LV_OBJ_FLAG_SCROLL_CHAIN` Simple packaging for (`LV_OBJ_FLAG_SCROLL_CHAIN_HOR | LV_OBJ_FLAG_SCROLL_CHAIN_VER`)
|
||||
- `LV_OBJ_FLAG_SCROLL_ON_FOCUS` Automatically scroll object to make it visible when focused
|
||||
- `LV_OBJ_FLAG_SCROLL_WITH_ARROW` Allow scrolling the focused object with arrow keys
|
||||
- `LV_OBJ_FLAG_SNAPPABLE` If scroll snap is enabled on the parent it can snap to this object
|
||||
- `LV_OBJ_FLAG_PRESS_LOCK` Keep the object pressed even if the press slid from the object
|
||||
- `LV_OBJ_FLAG_EVENT_BUBBLE` Propagate the events to the parent too
|
||||
- `LV_OBJ_FLAG_GESTURE_BUBBLE` Propagate the gestures to the parent
|
||||
- `LV_OBJ_FLAG_ADV_HITTEST` Allow performing more accurate hit (click) test. E.g. accounting for rounded corners
|
||||
- `LV_OBJ_FLAG_IGNORE_LAYOUT` Make the object positionable by the layouts
|
||||
- `LV_OBJ_FLAG_FLOATING` Do not scroll the object when the parent scrolls and ignore layout
|
||||
- `LV_OBJ_FLAG_OVERFLOW_VISIBLE` Do not clip the children's content to the parent's boundary
|
||||
|
||||
- `LV_OBJ_FLAG_LAYOUT_1` Custom flag, free to use by layouts
|
||||
- `LV_OBJ_FLAG_LAYOUT_2` Custom flag, free to use by layouts
|
||||
|
||||
- `LV_OBJ_FLAG_WIDGET_1` Custom flag, free to use by widget
|
||||
- `LV_OBJ_FLAG_WIDGET_2` Custom flag, free to use by widget
|
||||
|
||||
- `LV_OBJ_FLAG_USER_1` Custom flag, free to use by user
|
||||
- `LV_OBJ_FLAG_USER_2` Custom flag, free to use by user
|
||||
- `LV_OBJ_FLAG_USER_3` Custom flag, free to use by user
|
||||
- `LV_OBJ_FLAG_USER_4` Custom flag, free to use by user
|
||||
|
||||
Some examples:
|
||||
```c
|
||||
/*Hide on object*/
|
||||
lv_obj_add_flag(obj, LV_OBJ_FLAG_HIDDEN);
|
||||
|
||||
/*Make an object non-clickable*/
|
||||
lv_obj_clear_flag(obj, LV_OBJ_FLAG_CLICKABLE);
|
||||
```
|
||||
|
||||
### Groups
|
||||
|
||||
Read the [Input devices overview](/overview/indev) to learn more about *Groups*.
|
||||
|
||||
Objects are added to a *group* with `lv_group_add_obj(group, obj)`, and you can use `lv_obj_get_group(obj)` to see which group an object belongs to.
|
||||
|
||||
`lv_obj_is_focused(obj)` returns if the object is currently focused on its group or not. If the object is not added to a group, `false` will be returned.
|
||||
|
||||
|
||||
### Extended click area
|
||||
By default, the objects can be clicked only within their bounding area. However, this can be extended with `lv_obj_set_ext_click_area(obj, size)`.
|
||||
|
||||
## Events
|
||||
- `LV_EVENT_VALUE_CHANGED` when the `LV_OBJ_FLAG_CHECKABLE` flag is enabled and the object clicked (on transition to/from the checked state)
|
||||
- `LV_EVENT_DRAW_PART_BEGIN` and `LV_EVENT_DRAW_PART_END` is sent for the following types:
|
||||
- `LV_OBJ_DRAW_PART_RECTANGLE` The main rectangle
|
||||
- `part`: `LV_PART_MAIN`
|
||||
- `rect_dsc`
|
||||
- `draw_area`: the area of the rectangle
|
||||
- `LV_OBJ_DRAW_PART_BORDER_POST` The border if the `border_post` style property is `true`
|
||||
- `part`: `LV_PART_MAIN`
|
||||
- `rect_dsc`
|
||||
- `draw_area`: the area of the rectangle
|
||||
- `LV_OBJ_DRAW_PART_SCROLLBAR` the scrollbars
|
||||
- `part`: `LV_PART_SCROLLBAR`
|
||||
- `rect_dsc`
|
||||
- `draw_area`: the area of the rectangle
|
||||
|
||||
Learn more about [Events](/overview/event).
|
||||
|
||||
## Keys
|
||||
If `LV_OBJ_FLAG_CHECKABLE` is enabled, `LV_KEY_RIGHT` and `LV_KEY_UP` make the object checked, and `LV_KEY_LEFT` and `LV_KEY_DOWN` make it unchecked.
|
||||
|
||||
If `LV_OBJ_FLAG_SCROLLABLE` is enabled, but the object is not editable (as declared by the widget class), the arrow keys (`LV_KEY_UP`, `LV_KEY_DOWN`, `LV_KEY_LEFT`, `LV_KEY_RIGHT`) scroll the object. If the object can only scroll vertically, `LV_KEY_LEFT` and `LV_KEY_RIGHT` will scroll up/down instead, making it compatible with an encoder input device. See [Input devices overview](/overview/indev) for more on encoder behaviors and the edit mode.
|
||||
|
||||
|
||||
Learn more about [Keys](/overview/indev).
|
||||
|
||||
## Example
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. include:: ../../examples/widgets/obj/index.rst
|
||||
|
||||
```
|
||||
|
||||
## API
|
||||
|
||||
```eval_rst
|
||||
|
||||
.. doxygenfile:: lv_obj.h
|
||||
:project: lvgl
|
||||
|
||||
```
|
||||
Reference in New Issue
Block a user