InputNumber

Introduction

InputNumber widget in Superivsely allows to create input fields for numeric values. It is a useful widget for applications that require users to input numbers, such as a number of data to process or how many augmentations to perform.

The InputNumber widget also allows you to set default values for the input field, and set minimum and maximum values for the range of numbers that can be entered. You can also set a step value to control how much the number increases or decreases when the user uses the controls to adjust the value.

Function signature

InputNumber(
    value=1,
    min=None,
    max=None,
    step=1,
    size="small",
    controls=True,
    debounce=300,
    precision=0,
    widget_id=None,
)

Parameters

Parameters	Type	Description
value	Union[int, float]	Binding value
min	Union[int, float, None]	The minimum allowed value
max	Union[int, float, None]	The maximum allowed value
step	Union[int, float]	Incremental steps
size	str	Size of the component
controls	bool	Whether to enable the control buttons
debounce	int	Debounce delay when typing, in millisecond
precision	int	Precision
widget_id	str	ID of the widget

value

Binding value.

type: Union[int, float]

default value: 1

input_number = InputNumber(value=7)

min

Minimum allowed value.

type: Union[int, float, None]

default value: None

input = InputNumber(min=5)

max

Maximum allowed value.

type: Union[int, float, None]

default value: None

input = InputNumber(max=500)

step

Incremental steps.

type: Union[int, float]

default value: 1

input = InputNumber(step=3)

size

Size of the component.

type: str

default value: small

input_small = InputNumber(size="small")
input_large = InputNumber(size="large")

controls

Whether to enable the control buttons.

type: bool

default value: true

input = InputNumber(controls=False)

debounce

Debounce delay when typing, in millisecond.

type: int

default value: 300

input = InputNumber(debounce=500)

precision

Precision.

type: int

default value: 0

input = InputNumber(precision=2)

widget_id

ID of the widget.

type: str

default value: None

Methods and attributes

Attributes and Methods	Description
value(value: Union[int, float])	Set widgets value field.
get_value()	Get input number value.
min(value: Union[int, float])	Set min value value.
max(value: Union[int, float])	Set max value value.
@value_changed	Decorator function is handled when input value is changed.

Mini App Example

You can find this example in our Github repository:

ui-widgets-demos/input/002_input_number/src/main.py

Import libraries

import os

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

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()

Initialize InputNumber widget

input_number = InputNumber()

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="Input Number",
    content=Container(widgets=[input_number]),
)

layout = Container(widgets=[card], direction="vertical")

Create app using layout

Create an app object with layout parameter.

app = sly.Application(layout=layout)