Roller

Scrollable cylindrical selector for picking one option from a fixed list, configured via lv_roller_set_options.

Roller bind value

Roller bound to a subject; a button jumps it programmatically.

The roller's bind_value is wired to subject_index. A "Wednesday" button uses subject_set_int_event to write 3 into the subject on click — the roller picks up the change and animates to that option without any direct call into the roller widget.

Roller value-changed event

Mirror the settled selection into a sibling label.

LV_EVENT_VALUE_CHANGED fires once the roller has settled on a new option (not while it's still scrolling). Read the option text with lv_roller_get_selected_str and push it into a label from the handler.

Roller with top and bottom fade

Fade the roller edges to black using a generated bitmap mask.

The active screen is tinted LV_PALETTE_BLUE_GREY and a month roller in LV_ROLLER_MODE_NORMAL takes a style that paints it black with white text and no border. A 130x150 LV_COLOR_FORMAT_L8 draw buffer is filled on a canvas with two LV_GRAD_DIR_VER rectangles (black-to-white on top, white-to-black on bottom), leaving the middle opaque. The resulting buffer is attached through lv_obj_set_style_bitmap_mask_src so the first and last rows fade out.

Roller options and mode

Define the option list and choose between normal and infinite scrolling.

options is a newline-separated list of items, written with 
 between entries because raw \n inside an attribute survives as the literal two characters. options-mode controls scroll behaviour: normal stops at the first/last entry; infinite wraps around so the user can keep scrolling in either direction. selected picks the initially focused index.

Roller styling

Style the main listbox and the selected item; use text_line_space to set the selected band's height.

Roller has two relevant parts: MAIN (the whole listbox, where unselected items are drawn) and SELECTED (the highlighted row in the middle). Name a style for each and attach them with selector="main" and selector="selected".

text_line_space on MAIN does more than space the text rows: because the selected indicator always sits in the gap between two list items, growing text_line_space directly grows the height of the highlighted band — so the selected row gets visually taller without a separate height setting.

Roller visible row count

Tune how many list items the roller shows at once.

visible_row_count determines the height of the roller in items, not pixels — the widget computes its own pixel height from the current font and line spacing. A short roller (3 rows) feels compact for a yes/no pick; a tall one (7 rows) shows more context but takes more screen real estate.