Domino UI UI components library
Domino Brix MVP framework for DominoKit apps
Domino Jackson JSON Mapping library
Domino Rest REST Client generation library
Domino History URL Manipulation library

Top Basic Docs

Range slider

A double-ended (range) slider component that allows selecting a lower and upper value within a defined range.

This component internally manages two separate Slider instances—one for the lower value and one for the upper value. Both sliders enforce a minimal gap to ensure the lower value does not exceed the upper, and vice versa.

Example:


 RangeSlider slider = RangeSlider.create(0, 100)
     .setStep(5)
     .setValue(Range.of(20.0, 80.0))
     .addChangeListener((oldValue, newValue) -> {
       console.log("Range changed: " + newValue);
     });

In this example, the slider covers values from 0 to 100. Both the lower and upper slider thumbs move in increments of 5, and their combined range is enforced by a minimal gap (if specified).

Examples

Basic range slider Slider with a range value instead of a single one

API Docs: RangeSlider

Browse full javadocs

Constructors

public void RangeSlider(double minValue, double maxValue, double lowerValue, double upperValue, double minGap)

Constructs a RangeSlider with the specified minimum, maximum, initial lower/upper values, and minimal gap.

minValue

the minimum allowed value

maxValue

the maximum allowed value

lowerValue

the initial lower slider value

upperValue

the initial upper slider value

minGap

the minimal gap (distance) enforced between lower and upper values

Static methods

public static RangeSlider create(double minValue, double maxValue)

Creates a new RangeSlider from minValue to maxValue with a default gap of 1 , initially covering the entire range.

minValue

the minimum value

maxValue

the maximum value

Returns:

a new range slider

public static RangeSlider create(double minValue, double maxValue, double minGap)

Creates a new RangeSlider from minValue to maxValue with a specified minGap , initially covering the entire range.

minValue

the minimum value

maxValue

the maximum value

minGap

the minimum distance between the lower and upper slider values

Returns:

a new range slider

public static RangeSlider create(double minValue, double maxValue, double lowerValue, double upperValue)

Creates a new RangeSlider from minValue to maxValue with a default gap of 1 , and sets the initial lower/upper values.

minValue

the minimum value

maxValue

the maximum value

lowerValue

the initial value of the lower slider

upperValue

the initial value of the upper slider

Returns:

a new range slider

public static RangeSlider create(double minValue, double maxValue, double lowerValue, double upperValue, double minGap)

Creates a new RangeSlider from minValue to maxValue with a specified minGap , and sets the initial lower/upper values.

minValue

the minimum value

maxValue

the maximum value

lowerValue

the initial value of the lower slider

upperValue

the initial value of the upper slider

minGap

the minimum distance between the lower and upper slider values

Returns:

a new range slider

Public methods

public RangeSlider pauseChangeListeners()

Check super implementation documentation.

public RangeSlider resumeChangeListeners()

Check super implementation documentation.

public RangeSlider togglePauseChangeListeners(boolean toggle)

Check super implementation documentation.

public Set<ChangeListener<? super Range<Double>>> getChangeListeners()

Check super implementation documentation.

public boolean isChangeListenersPaused()

Check super implementation documentation.

public RangeSlider triggerChangeListeners(Range<Double> oldValue, Range<Double> newValue)

Check super implementation documentation.

public RangeSlider withThumb()

Displays the thumbs for both sliders (lower and upper). Equivalent to calling withThumb on both underlying sliders.

Returns:

this RangeSlider

public RangeSlider setMaxValue(double max)

Sets the maximum allowed value for both underlying sliders.

max

the new maximum

Returns:

this RangeSlider

public RangeSlider setMinValue(double min)

Sets the minimum allowed value for both underlying sliders.

min

the new minimum

Returns:

this RangeSlider

public RangeSlider setValue(Range<Double> newValue)

Sets the slider's current value and triggers change listeners.

newValue

the new range value

Returns:

this RangeSlider

public RangeSlider setValue(Range<Double> newValue, boolean silent)

Sets the slider's current value, optionally disabling change listeners (silent).

newValue

the new range value

silent

if true, change listeners are not triggered

Returns:

this RangeSlider

public Range<Double> getValue()

Retrieves the current range (lower and upper values) from the underlying sliders.

Returns:

the current Range

public RangeSlider setShowThumb(boolean withThumb)

Toggles the visibility of both slider thumbs.

withThumb

true to show thumbs

Returns:

this RangeSlider

public RangeSlider setAutoHideThumb(boolean autoHideThumb)

Sets whether to auto-hide the thumbs, meaning they only appear when hovering or focusing the slider.

autoHideThumb

true if the thumbs should auto-hide

Returns:

this RangeSlider

public boolean isAutoHideThumb()

Indicates whether the thumbs are configured to auto-hide.

Returns:

true if thumbs auto-hide

public RangeSlider setThumbStyle(ThumbStyle thumbStyle)

Updates the thumb style (e.g., round, square) for both sliders.

thumbStyle

the new ThumbStyle

Returns:

this RangeSlider

public RangeSlider setStep(double step)

Sets the stepping interval for both sliders (e.g., 0.1, 1.0), determining how much the value changes per step.

step

the step size

Returns:

this RangeSlider

public RangeSlider anyStep()

Configures both sliders to accept any fractional step (i.e., no enforced stepping).

Returns:

this RangeSlider

public SlidersConfig getOwnConfig()

Check super implementation documentation.

public RangeSlider setConfig(SlidersConfig config)

Assigns a SlidersConfig to both underlying sliders.

config

the new SlidersConfig

Returns:

this RangeSlider

public RangeSlider withLowerSlider(ChildHandler<RangeSlider, Slider> handler)

Applies a ChildHandler to the lower slider, allowing additional configuration or styling.

handler

a functional interface that receives this RangeSlider and its lower Slider

Returns:

this RangeSlider

public RangeSlider withUpperSlider(ChildHandler<RangeSlider, Slider> handler)

Applies a ChildHandler to the upper slider, allowing additional configuration or styling.

handler

a functional interface that receives this RangeSlider and its upper Slider

Returns:

this RangeSlider

public RangeSlider addSliderMoveListener(Handler<RangeSlider> handler)

Registers a listener that is notified whenever either the lower or upper slider moves (i.e., changes its value).

handler

a Handler for RangeSlider movement events

Returns:

this RangeSlider

public RangeSlider removeSliderMoveListener(Handler<Slider> handler)

Removes a previously registered slider-move listener.

handler

the handler to remove

Returns:

this RangeSlider

public HTMLDivElement element()

Check super implementation documentation.

Returns the root

for this range slider, which contains the track and both slider thumbs.

We are a group of passionate people who love what we do

Donate & Support Us