selectstring.md

SelectString

Introduction

SelectString widget in Supervisely is a dropdown menu that allows users to select a single string value from a list of predefined options. It is commonly used when a specific string value is required as input, such as when selecting a specific class name or annotation type. Selected value can be accessed programmatically in the code.

Function signature

SelectString(
    values=["cat", "dog","horse", "sheep", "squirrel"],
    labels=None,
    filterable=False,
    placeholder="select",
    size=None,
    multiple=False,
    widget_id=None,
)

Parameters

Parameters	Type	Description
values	List[str]	Determine list of strings for SelectString widget
labels	Optional[List[str]]	Determine list of label strings
filterable	Optional[bool]	Whether SelectString is filterable
placeholder	Optional[str]	Input placeholder
size	Optional[Literal["large", "small", "mini", None]]	Size of input
multiple	Optional[bool]	Whether multiple-select is activated
items_right_text	List[str]	Determine text on the right side of each item
items_links	List[str]	Display help text with links for each item
widget_id	Optional[str]	ID of the widget

values

Determine list of strings for SelectString widget.

type: List[str]

select_string = SelectString(["cat", "dog","horse", "sheep", "squirrel"])

labels

Determine list of label strings.

type: List[str] or None

default value: None

select_string = SelectString(
    ["string1", "string2", "string3"], labels=["label1", "label2", "label3"]
)

filterable

Whether SelectString is filterable.

type: Optional[bool]

default value: false

select_string = SelectString(
    ["cat", "dog", "horse"],
    filterable=True,
)

placeholder

Input placeholder.

type: Optional[str]

default value: select

select_string = SelectString(
    ["cat", "dog", "horse"],
    filterable=True,
    placeholder="Select string please",
)

size

Size of input.

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

default value: None

select_string = SelectString(["cat"])
select_string_mini = SelectString(["cat"], size="mini")
select_string_small = SelectString(["cat"], size="small")
select_string_large = SelectString(["cat"], size="large")

multiple

Whether multiple-select is activated.

type: Optional[bool]

default value: false

select_string = SelectString(
    values=["cat", "dog","horse", "sheep", "squirrel"],
    multiple=True,
)

items_right_text

Determine text on the right side of each item.

type: List[str] or None

default value: None

items_links

Display help text with links for each item.

type: List[str] or None

default value: None

images = api.image.get_list(60402)

select_string = SelectString(
    values=[sly.fs.get_file_name(image.name) for image in images],
    items_links=[image.full_storage_url for image in images],
)

widget_id

ID of the widget.

type: Optional[str]

default value: None

Methods and attributes

Attributes and Methods	Description
get_value()	Return selected item value.
set(values: List[str], labels: Optional[List[str]] = None, right_text: Optional[List[str]] = None,)	Define string options to widget.
get_items()	Return list of items from widget.
@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/blob/master/selection/009_select_string/src/main.py

Import libraries

import os

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

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

Get Dataset ID from environment variables

dataset_id = sly.env.dataset_id()

Get images infos from current dataset

images = api.image.get_list(dataset_id=dataset_id)

Create Image widget we will use in UI in this tutorial for demo

image = Image()

Initialize SelectString widget

select_string = SelectString(
    values=[img.name for img in images],
    items_links=[img.full_storage_url for img in images],
)

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="Select string",
    content=Container(
        [select_string, image],
        direction="horizontal",
        fractions=[1, 1],
    ),
)

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

@select_string.value_changed
def display_select_string(value):
    if value is not None:
        img = api.image.get_info_by_name(dataset_id, value)
        image.set(url=img.full_storage_url)