slider¶
Displays and allows the user to set a value within a range.
The range is set by the values min
and max
which must be integer values.
If the lov property is used, then the slider can be used to select a value among the different choices.
Properties¶
Name | Type | Default | Description |
---|---|---|---|
(★) |
dynamic(int | float | str) | The value that is set for this slider. It would be a lov label if it is used. |
|
min |
int | float | 0 | The minimum value. This is ignored when lov is defined. |
max |
int | float | 100 | The maximum value. This is ignored when lov is defined. |
text_anchor |
str | "bottom" | When the lov property is used, this property indicates the location of the label. Possible values are:
|
labels |
bool|dict | The labels for specific points of the slider. If set to True, this slider uses the labels of the lov if there are any. If set to a dictionary, the slider uses the dictionary keys as a lov key or index, and the associated value as the label. |
|
continuous |
bool | True | If set to False, the control emits an on_change notification only when the mouse button is released, otherwise notifications are emitted during the cursor movements. If lov is defined, the default value is False. |
change_delay |
int | App config | Minimum time between triggering two on_change calls. The default value is defined at the application configuration level by the change_delay configuration option. if None or 0, there's no delay. |
width |
str | "300px" | The width, in CSS units, of this element. |
height |
str | The height, in CSS units, of this element. It defaults to the width value when using the vertical orientation. |
|
orientation |
str | "horizontal" | The orientation of this slider. Valid values are "horizontal" or "vertical". |
lov |
dict[str, any] | The list of values. See the section on List of Values for details. |
|
adapter |
Function | `lambda x: str(x)` | The function that transforms an element of lov into a tuple(id:str, label:str|Icon). |
type |
str | Type of first lov element | Must be specified if lov contains a non-specific type of data (ex: dict). value must be of that type, lov must be an iterable on this type, and the adapter function will receive an object of this type. |
value_by_id |
bool | False | If False, the selection value (in value) is the selected element in lov. If set to True, then value is set to the id of the selected element in lov. |
on_change |
Callback | The name of a function that is triggered when the value is updated.
|
|
propagate |
bool | App config | Allows the control's main value to be automatically propagated. |
active |
dynamic(bool) | True | Indicates if this component is active. An inactive component allows no user interaction. |
id |
str | The identifier that will be assigned to the rendered HTML component. |
|
properties |
dict[str, any] | Bound to a dictionary that contains additional properties for this element. |
|
class_name |
str | List of CSS class names that will be associated with the generated HTML Element.
This class names will be added to the default |
|
hover_text |
dynamic(str) | Information that is displayed when the user hovers over this element. |
(★)value
is the default property for this visual element.
Usage¶
Selecting a value between 0 and 100¶
A numeric value can easily be represented and interacted with using the following content:
Page content
<|{value}|slider|>
<taipy:slider>{value}</taipy:slider>
Constraining values¶
You can specify what bounds the value should be restrained to:
Page content
<|{value}|slider|min=1|max=10|>
<taipy:slider min="1" max="10">{value}</taipy:slider>
Changing orientation¶
Page content
<|{value}|slider|orientation=vert|>
<taipy:slider orientation="vertical">{value}</taipy:slider>