2021-05-13 23:42:33 +08:00
```eval_rst
.. include:: /header.rst
:github_url: |github_link_base|/widgets/span.md
```
2021-05-18 14:25:17 +02:00
# Span (lv_span)
2021-05-13 23:42:33 +08:00
## Overview
2021-06-09 15:10:35 +02:00
A spangroup is the object that is used to display rich text. Different from the label object, `spangroup` can automatically organize text of different fonts, colors, and sizes into the spangroup obj.
2021-05-13 23:42:33 +08:00
## Parts and Styles
2021-06-09 15:10:35 +02:00
- `LV_PART_MAIN` The spangroup has only one part.
2021-05-13 23:42:33 +08:00
## Usage
### Set text and style
2021-06-09 15:10:35 +02:00
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 modified text is the same as the normal style used, eg:`lv_style_set_text_color(&span->style, lv_palette_main(LV_PALETTE_RED))` .
2021-05-13 23:42:33 +08:00
2021-06-09 15:10:35 +02:00
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).
2021-05-13 23:42:33 +08:00
### Text align
2021-06-09 15:10:35 +02:00
like label object, the spangroup can be set to one the following modes:
2021-05-13 23:42:33 +08:00
- `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.
2021-05-20 20:47:46 +08:00
use function `lv_spangroup_set_align(spangroup, LV_TEXT_ALIGN_CENTER)` to set text align.
2021-05-13 23:42:33 +08:00
### Modes
2021-06-09 15:10:35 +02:00
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.
2021-05-13 23:42:33 +08:00
- `LV_SPAN_MODE_BREAK` Keep width, break the too long lines and auto expand height.
2021-06-09 15:10:35 +02:00
Use `lv_spangroup_set_mode(spangroup, LV_SPAN_MODE_BREAK)` to set object mode.
2021-05-13 23:42:33 +08:00
### Overflow
2021-06-09 15:10:35 +02:00
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.
2021-05-13 23:42:33 +08:00
2021-06-09 15:10:35 +02:00
Use `lv_spangroup_set_overflow(spangroup, LV_SPAN_OVERFLOW_CLIP)` to set object overflow mode.
2021-05-13 23:42:33 +08:00
### first line indent
2021-06-09 15:10:35 +02:00
Use `lv_spangroup_set_indent(spangroup, 20)` to set the indent of the first line, in pixels.
2021-05-13 23:42:33 +08:00
## Events
2021-05-18 14:25:17 +02:00
No special events are sent by this widget.
2021-05-13 23:42:33 +08:00
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
```
