Slider

Introduction

Slider is a widget in Supervisely that allows users to input numerical values within a specific range. The widget is commonly used to set parameters such as batch size in machine learning models. Users can adjust the slider handle to select the desired value, and the corresponding numerical value is displayed. Slider widget also provides users with the ability to customize the slider range, height in vertical mode and step size between values, allowing for more precise and flexible inputs.

Function signature

Slider(
    value=0,
    min=0,
    max=100,
    step=1,
    show_input=False,
    show_input_controls=False,
    show_stops=False,
    show_tooltip=True,
    range=False,
    vertical=False,
    height=None,
    widget_id=None,
)

Parameters

value

Determine Slider start value.

type: Union[int, List[int]]

default value: 0

slider = Slider(value=15)

min

Determine Slider minimum value.

type: int

default value: 0

max

Determine Slider maximum value.

type: int

default value: 100

slider = Slider(min=30, max=50)

step

Determine step size.

type: int

default value: 1

slider = Slider(step=5)

show_input

Whether to display an input box, works when range is false.

type: bool

default value: false

slider = Slider(show_input=True)

show_input_controls

Whether to display control buttons when show-input is true.

type: bool

default value: false

slider = Slider(show_input=True, show_input_controls=True)

show_stops

Whether to display breakpoints.

type: bool

default value: false

slider = Slider(show_stops=True, max=20, step=5)

show_tooltip

Whether to display tooltip value.

type: bool

default value: true

slider = Slider(show_tooltip=False)

range

Determine whether to select a range, equires value to be List[int, int].

type: bool

default value: true

slider = Slider(value=[5, 20], range=True)

vertical

Determine vertical mode.

type: bool

default value: false

height

Determine Slider height, required in vertical mode.

type: int

default value: None

slider = Slider(vertical=True, height=100)

style

Specifies an inline style for an element.

type: str

default value: ""

slider = Slider(value=15, min=5, max=50, style="padding: 20px;")

widget_id

ID of the widget.

type: str

default value: None

Methods and attributes

Mini App Example

You can find this example in our Github repository:

ui-widgets-demos/controls/005_slider/src/main.py

Import libraries

import os

import supervisely as sly
from dotenv import load_dotenv
from supervisely.app.widgets import Card, Container, Slider, Text

Init API client

First, we load environment variables with credentials and init API for communicating with Supervisely Instance:

load_dotenv("local.env")
load_dotenv(os.path.expanduser("~/supervisely.env"))

api = sly.Api()

Create Text widget we will use in UI for demo Slider widget

text = Text()

Initialize Slider widget

slider = Slider(
    value=[10, 50],
    step=5,
    range=True,
    show_stops=True,
)

Create app layout

Prepare a layout for app using Card widget with the content parameter and place widget that we've just created in the Container widget.

card = Card(title="Slider", content=Container([slider, text]))
layout = Container(widgets=[card])

Create app using layout

Create an app object with layout parameter.

app = sly.Application(layout=layout)

Add functions to control widget from code

@slider.value_changed
def show_value(value):
    text.text = value

Last updated