Slider

Simple example:

with flx.VBox():
    flx.Slider(min=10, max=20, value=12)
    flx.RangeSlider(min=10, max=90, value=(20, 60))
open in new tab

Also see examples: sine.py, twente.py, deep_event_connections.py.


class flexx.ui.Slider(*init_args, **kwargs)

Inherits from: Widget

An input widget to select a value in a certain range.

The node of this widget is a <div> containing a few HTML elements for rendering. It does not use a <input type='range'> because of its different appearance and behaviour accross browsers.

properties: disabled, max, min, step, text, value

emitters: user_done, user_value

actions: set_disabled, set_max, set_min, set_step, set_text, set_value

disabled

BoolProp – Whether the slider is disabled.

max

FloatProp – The maximum slider value.

min

FloatProp – The minimal slider value.

set_disabled(*val)

action – Setter for the ‘disabled’ property.

set_max(*val)

action – Setter for the ‘max’ property.

set_min(*val)

action – Setter for the ‘min’ property.

set_step(*val)

action – Setter for the ‘step’ property.

set_text(*val)

action – Setter for the ‘text’ property.

set_value(value)

action – set_value

step

FloatProp – The step size for the slider.

text

StringProp – The label to display on the slider during dragging. Occurances of “{percent}” are replaced with the current percentage, and “{value}” with the current value. Default “{value}”.

user_done()

emitter – Event emitted when the user stops manipulating the slider. Has old_value and new_value attributes (which have the same value).

user_value(value)

emitter – Event emitted when the user manipulates the slider. Has old_value and new_value attributes.

value

FloatProp – The current slider value.

class flexx.ui.RangeSlider(*init_args, **kwargs)

Inherits from: Slider

An input widget to select a range (i.e having two handles instead of one).

The node of this widget is a <div> containing a few HTML elements for rendering.

properties: value

actions: set_value

set_value(*value)

action – Set the RangeSlider’s value. Can be called using set_value([val1, val2]) or set_value(val1, val2).

value

FloatPairProp – The current slider value as a two-tuple.