Cascader
Introduction
Cascader
is a dropdown list with hierarchical options.
Function signature
Cascader(
items=None,
filterable=False,
placeholder="select",
size=None,
expand_trigger="click",
disabled=False,
clearable=False,
show_all_levels=True,
change_on_select=False,
selected_options=None,
widget_id=None,
)
Example of input data we will use.
pussy_black_cat = Cascader.Item(value="pussy cat", label="pussy cat")
smooth_haired_cat = Cascader.Item(value="smooth-haired cat", label="smooth-haired cat")
black_cat = Cascader.Item(
value="black cat", label="black cat", children=[pussy_black_cat, smooth_haired_cat]
)
white_cat = Cascader.Item(value="white cat", label="white cat")
red_cat = Cascader.Item(value="red cat", label="red cat")
angry_dog = Cascader.Item(value="angry dog", label="angry dog", disabled=True)
kind_dog = Cascader.Item(value="kind dog", label="kind dog")
animals = [
Cascader.Item(value="cat", label="cat", children=[black_cat, white_cat, red_cat]),
Cascader.Item(value="dog", label="dog", children=[angry_dog, kind_dog]),
Cascader.Item(value="horse", label="horse"),
Cascader.Item(value="sheep", label="sheep"),
]
select_items = Cascader(items=animals)

Parameters
items
List[Cascader.Item]
Input Cascader
data
filterable
bool
Whether the options can be searched
placeholder
str
Input placeholder
size
Literal["large", "small", "mini", None]
Size of input
expand_trigger
Literal["click", "hover"]
Trigger mode of expanding current item
clearable
bool
Whether selected value can be cleared
show_all_levels
bool
Whether to display all levels of the selected value in the input
change_on_select
bool
Whether selecting an option of any level is permitted
selected_options
List[str]
Current selected option
widget_id
str
ID of the widget
items
Determine input Cascader
data.
type: List[Cascader.Item]
default value: None
filterable
Determine whether the options can be searched.
type: bool
default value: False
select_items = Cascader(items=animals, filterable=True)

placeholder
Determine input placeholder.
type: str
default value: select
select_items = Cascader(items=animals, placeholder="Choose the pet")

size
Determine size of input.
type: Literal["large", "small", "mini", None]
default value: None
select_items = Cascader(items=animals)
select_items_mini = Cascader(items=animals, size="mini")
select_items_small = Cascader(items=animals, size="small")
select_items_large = Cascader(items=animals, size="large")

expand_trigger
Trigger mode of expanding current item.
type: Literal["click", "hover"]
default value: "click"
select_items = Cascader(items=animals, expand_trigger="hover")

clearable
Determine whether selected value can be cleared.
type: bool
default value: False
select_items = Cascader(items=animals, clearable=True)

show_all_levels
Determine whether to display all levels of the selected value in the input.
type: bool
default value: True
select_items = Cascader(items=animals, show_all_levels=False)

change_on_select
Determine whether selecting an option of any level is permitted.
type: bool
default value: False
select_items = Cascader(items=animals, change_on_select=True)

selected_options
Determine current selected option.
type: List[str]
default value: None
select_items = Cascader(items=animals, selected_options=["horse"])

widget_id
ID of the widget.
type: str
default value: None
Methods and attributes
get_value()
Return Cascader
selected value.
set_value(value: List[str])
Set Cascader
selected value.
get_items()
Return Cascader
items.
get_item()
Return Cascader.Item
item.
set_items(value: List[Cascader.Item])
Set Cascader
items.
add_items(value: List[Cascader.Item])
Add items in Cascader
.
expand_to_hover()
Set expand_trigger
to hover
mode.
expand_to_click()
Set expand_trigger
to click
mode.
@value_changed
Decorator function to handle selected value change.
Mini App Example
You can find this example in our Github repository:
supervisely-ecosystem/ui-widgets-demos/selection/015_cascader/src/main.py
Import libraries
import os
import supervisely as sly
from dotenv import load_dotenv
from supervisely.app.widgets import Card, Container, Cascader, 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()
Prepare items for cascader
pussy_black_cat = Cascader.Item(value="pussy cat", label="pussy cat")
smooth_haired_cat = Cascader.Item(value="smooth-haired cat", label="smooth-haired cat")
black_cat = Cascader.Item(
value="black cat", label="black cat", children=[pussy_black_cat, smooth_haired_cat]
)
white_cat = Cascader.Item(value="white cat", label="white cat")
red_cat = Cascader.Item(value="red cat", label="red cat")
angry_dog = Cascader.Item(value="angry dog", label="angry dog", disabled=True)
kind_dog = Cascader.Item(value="kind dog", label="kind dog")
animals = [
Cascader.Item(value="cat", label="cat", children=[black_cat, white_cat, red_cat]),
Cascader.Item(value="dog", label="dog", children=[angry_dog, kind_dog]),
Cascader.Item(value="horse", label="horse"),
Cascader.Item(value="sheep", label="sheep"),
]
Initialize Cascader
and Text
widgets
Cascader
and Text
widgetsselect_items = Cascader(items=animals)
text = Text()
Create app layout
Prepare a layout for app using Card
widget with the content
parameter.
card = Card(
title="Cascader",
content=Container(widgets=[select_items, text]),
)
layout = Container(widgets=[card])
Create app using layout
Create an app object with layout parameter.
app = sly.Application(layout=card)
Add functions to control widgets from python code
@select_items.value_changed
def show_item(res):
info = f"You choise: {'/'.join(str(x) for x in res)} item"
text.set(text=info, status="info")

Last updated
Was this helpful?