Skip to content

Slider

<slider>
Components.slider(...)

The slider component represents a draggable slider for selecting a value within a range.

Parameters:

  • text: The text to display alongside the slider.
  • value: The current value of the slider.
  • active: Whether the slider is active or not.

Example (Code-driven):

Components.slider(Sizing.fill(50))
    .message(s -> Text.literal("Volume"))
    .active(true)

Example (Data-driven):

<slider>
    <text>Volume</text>
    <value>0.5</value>
    <active>true</active>
    <sizing>
        <horizontal method="fill">20</horizontal>
        <vertical method="fixed">10</vertical>
    </sizing>
</slider>

Last update: 2025-04-13