Skip to content
On this page

Slider

A slider is a commonly used user interface element for selecting a value within a given range. Users can adjust the value by sliding the slider. If you want to learn more about sliders, you can refer to this link:

For more detailed information, you can refer to this link: https://docs.lvgl.io/8.3/widgets/core/slider.html

Properties

A slider has several properties to define its behavior and appearance.

  • Slider range: Defines the maximum and minimum values of the slider.
  • Left value: In range slider mode, the left value represents the starting value of the slider range.
  • Slider value: Represents the currently selected value of the slider.
  • Mode: Normal slider mode represents a single slider; symmetrical slider mode represents a range selector consisting of two sliders.
Slider Properties
Slider rangeMax, Minlv_slider_set_range
Left value (applicable in range slider mode)Leftlv_slider_set_left_value
Slider valuevaluelv_slider_set_value
ModeNormal sliderLV_SLIDER_MODE_NORMAL
ModeSymmetrical sliderLV_SLIDER_MODE_SYMMETRICAL

Styles

The appearance of the slider can be defined using styles. Here are some common slider styles:

  • MAIN: The main part, including the bottom track of the slider.
  • INDICATOR: The upper track indicating the current value of the slider.
  • KNOB: The draggable button that users can drag to adjust the slider value.

Example

slider_1.png