Input

About Supervisely Ecosystem Contact us Slack

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

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

input_text = Input(placeholder="Please input")

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)

@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")

Introduction

Function signature

Parameters

value

minlength

maxlength

placeholder

size

readonly

type

icon

widget_id

Methods and attributes

Mini App Example

Import libraries

Init API client

Initialize `Input` widget

Create buttons to control `Input` widget values.

Create app layout

Create app using layout

Add functions to control widget from python code

Introduction

Function signature

Parameters

value

minlength

maxlength

placeholder

size

readonly

type

icon

widget_id

Methods and attributes

Mini App Example

Import libraries

Init API client

Initialize Input widget

Create buttons to control Input widget values.

Create app layout

Create app using layout

Add functions to control widget from python code

Initialize `Input` widget

Create buttons to control `Input` widget values.