Tile

Overview

Tile is a widget Layout. It’s the core element of any sepal_ui app. It inherits from the SepalWidget class. Any argument from the original Card ipyvuetify class can be used to complement it.

from sepal_ui import sepalwidgets as sw
import ipyvuetify as v

# correct colors for the documentation
# set to dark in SEPAL by default
v.theme.dark = False

tile = sw.Tile(
    id_ = "tile",
    title = "My first tile",
    inputs = [sw.Markdown('lorem ipsum'), v.Select(), v.TextField()],
    output = sw.Alert().add_msg('lorem ipsum'),
    btn = sw.Btn()
)
tile

Tip

The best way to use the tiles in an sepal_ui framework is to use Tile as an abstract tile and build specific Tiles adapted to your need in the component/tile package. Everything is shown following this tutorial.

Methods

nest

Prepare the tile to be used as a nested component in a tile. The elevation will be set to 0 and the title remove from children. The mount_id will also be changed to “nested”.

from sepal_ui import sepalwidgets as sw
import ipyvuetify as v

# correct colors for the documentation
# set to dark in SEPAL by default
v.theme.dark = False

tile = sw.Tile(
    id_ = "tile",
    title = "My first tile",
    inputs = [sw.Markdown('lorem ipsum'), v.Select(), v.TextField()],
    alert = sw.Alert().add_msg('lorem ipsum'),
    btn = sw.Btn()
)

tile.nest()

set_content

Replace the current content of the tile with the provided inputs. it will keep the output and btn widget if existing.

from sepal_ui import sepalwidgets as sw
import ipyvuetify as v

# correct colors for the documentation
# set to dark in SEPAL by default
v.theme.dark = False

tile = sw.Tile(
    id_ = "tile",
    title = "My first tile",
    inputs = [sw.Markdown('lorem ipsum'), v.Select(), v.TextField()],
    alert = sw.Alert().add_msg('lorem ipsum'),
    btn = sw.Btn()
)

tile.set_content([sw.PasswordField()])

set_title

Replace the current title and activate it. If no title is provided, the title is removed from the tile content.

from sepal_ui import sepalwidgets as sw
import ipyvuetify as v

# correct colors for the documentation
# set to dark in SEPAL by default
v.theme.dark = False

tile = sw.Tile(
    id_ = "tile",
    title = "My first tile",
    inputs = [sw.Markdown('lorem ipsum'), v.Select(), v.TextField()],
    alert = sw.Alert().add_msg('lorem ipsum'),
    btn = sw.Btn()
)

tile.set_title("A custom title")

get_title

Return the current title of the tile

from sepal_ui import sepalwidgets as sw
import ipyvuetify as v

# correct colors for the documentation
# set to dark in SEPAL by default
v.theme.dark = False

tile = sw.Tile(
    id_ = "tile",
    title = "My first tile",
    inputs = [sw.Markdown('lorem ipsum'), v.Select(), v.TextField()],
    alert = sw.Alert().add_msg('lorem ipsum'),
    btn = sw.Btn()
)

tile.get_title()

'My first tile'

toggle_inputs

Display only the widgets that are part of the input_list. the widget_list is the list of all the widgets of the tile.

from sepal_ui import sepalwidgets as sw
import ipyvuetify as v

# correct colors for the documentation
# set to dark in SEPAL by default
v.theme.dark = False

inputs = [sw.Markdown('lorem ipsum'), v.Select(), v.TextField()]

tile = sw.Tile(
    id_ = "tile",
    title = "My first tile",
    inputs = inputs,
    alert = sw.Alert().add_msg('lorem ipsum'),
    btn = sw.Btn()
)

tile.toggle_inputs([inputs[2]], inputs)

Note

More information can be found here.