input.md

Input

Introduction

Input widget in Supervisely allows to create input fields for text. It is a useful widget for applications that require users to enter text, such as project name, dataset name or path to folder or archive with data.

The Input widget also allows you to set default text to be displayed in the input field, set text placeholder, set input field to be readonly, and set a minimum and maximum length for the input.

Function signature

Input(
    value="",
    minlength=0,
    maxlength=1000,
    placeholder="",
    size=None,
    readonly=False,
    widget_id=None
)

Parameters

Parameters	Type	Description
value	str	Binding value
minlength	int	Minimum input text length
maxlength	int	Maximum input text length
placeholder	str	Placeholder of input
size	Literal["mini", "small", "large", None]	Size of input
readonly	bool	Same as readonly in native input
type	Literal["text", "password"]	Same as type in native input
icon	Literal["search", "edit"]	Set an icon to indicate input type
widget_id	str	ID of the widget

value

Binding value.

type: str

default value: ""

input = Input(value="Start input value")

minlength

Minimum input text length.

type: int

default value: 0

input = Input(minlength=5)

maxlength

Maximum input text length.

type: int

default value: 1000

input = Input(maxlength=500)

placeholder

Placeholder of input.

type: str

default value: ""

input = Input(placeholder="Please input")

size

Size of input.

type: Literal["mini", "small", "large", None]

default value: None

input = Input()
input_mini = Input(size="mini", placeholder="input mini")
input_small = Input(size="small", placeholder="input small")
input_large = Input(size="large", placeholder="input large")

readonly

Same as readonly in native input.

type: bool

default value: false

input = Input(readonly=True)

type

Same as type in native input.

type: Literal["text", "password"]

default value: None

input = Input(type="password")

icon

Set an icon to indicate input type. Set to None to disable icon.

type: Literal["search", "edit"]

default value: None

input = Input(value="Search", icon="search")

widget_id

ID of the widget.

type: str

default value: None

Methods and attributes

Attributes and Methods	Description
is_readonly()	Return True if input is readonly, else False.
set_value(value: str)	Set input value.
get_value()	Get input value.
enable_readonly()	Enable input`s readonly property.
disable_readonly()	Disable input`s readonly property.
set_icon()	Set icon type: "edit" or "search".
@value_changed	Decorator functions is handled when input value is changed.

Mini App Example

You can find this example in our Github repository:

ui-widgets-demos/input/001_input/src/main.py

Import libraries

import os
from random import choice

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

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 Input widget

input_text = Input(placeholder="Please input")

Create buttons to control Input widget values.

button_random_planet = Button(text="Random planet name")
button_clean_input = Button(text="Clean input")
button_set_readonly = Button(text="Set readonly")

buttons_container = Container(
    widgets=[
        button_random_planet,
        button_clean_input,
        button_set_readonly,
    ],
    direction="horizontal",
)

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",
    content=Container(widgets=[input_text, buttons_container]),
)

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

Create app using layout

Create an app object with layout parameter.

app = sly.Application(layout=layout)

Add functions to control widget from python code

@button_random_planet.click
def random_planet():
    input_text.set_value(
        choice(
            [
                "Mercury",
                "Venus",
                "Earth",
                "Mars",
                "Jupiter",
                "Saturn",
                "Uranus",
                "Neptune",
            ]
        )
    )

@button_clean_input.click
def random_word():
    input_text.set_value("")


@button_set_readonly.click
def set_readonly():
    if input_text.is_readonly():
        input_text.disable_readonly()
        print("Readonly: Disabled")
    else:
        input_text.enable_readonly()
        print("Readonly: Enabled")