Skip to content

CupertinoListTile

An iOS-style list tile.

Can also serve as a cupertino equivalent of the Material ListTile.

Inherits: LayoutControl

Properties

Events

Examples#

Live example

Notched and non-notched list tiles#

import flet as ft


def main(page: ft.Page):
    def handle_tile_click(e: ft.Event[ft.CupertinoListTile]):
        print("Tile clicked")

    page.add(
        ft.CupertinoListTile(
            additional_info=ft.Text("Wed Jan 24"),
            bgcolor_activated=ft.Colors.AMBER_ACCENT,
            leading=ft.Icon(ft.CupertinoIcons.GAME_CONTROLLER),
            title=ft.Text("CupertinoListTile: notched = False"),
            subtitle=ft.Text("Subtitle"),
            trailing=ft.Icon(ft.CupertinoIcons.ALARM),
            on_click=handle_tile_click,
        ),
        ft.CupertinoListTile(
            notched=True,
            additional_info=ft.Text("Thu Jan 25"),
            leading=ft.Icon(ft.CupertinoIcons.GAME_CONTROLLER),
            title=ft.Text("CupertinoListTile: notched = True"),
            subtitle=ft.Text("Subtitle"),
            trailing=ft.Icon(ft.CupertinoIcons.ALARM),
            on_click=handle_tile_click,
        ),
    )


ft.run(main)

notched

Properties#

additional_info #

additional_info: StrOrControl | None = None

A Control to display on the right of the list tile, before trailing.

Similar to subtitle, an additional_info is used to display additional information.

Typically a Text control.

bgcolor #

bgcolor: ColorValue | None = None

The background color of this list tile.

bgcolor_activated #

bgcolor_activated: ColorValue | None = None

The background color of this list tile after it was tapped.

leading #

leading: IconDataOrControl | None = None

A control to display before the title.

leading_size #

leading_size: Number | None = None

Used to constrain the width and height of leading control.

Defaults to 30.0, if notched is True, else 28.0.

leading_to_title #

leading_to_title: Number | None = None

The horizontal space between leading and [title`][flet.controls.cupertino.cupertino_list_tile.CupertinoListTile.title].

Defaults to 12.0, if notched is True, else 16.0.

notched #

notched: bool = False

Whether this list tile should be created in an "Inset Grouped" form, known from either iOS Notes or Reminders app.

padding #

padding: PaddingValue | None = None

The tile's internal padding. Insets a CupertinoListTile's contents: its leading, title, subtitle, additional_info and trailing controls.

subtitle #

subtitle: StrOrControl | None = None

Additional content displayed below the title.

Typically a Text control.

title #

title: StrOrControl

The primary content of this list tile.

Typically a Text control.

Raises:

toggle_inputs #

toggle_inputs: bool = False

Whether clicking on this tile should toggle the state of (visible) toggleable controls like Radio, Checkbox or Switch inside it.

trailing #

trailing: IconDataOrControl | None = None

A control to display after the title.

Typically an Icon control.

url #

url: str | Url | None = None

The URL to open when this button is clicked.

Additionally, if on_click event callback is provided, it is fired after that.

Events#

on_click #

on_click: ControlEventHandler[CupertinoListTile] | None = (
    None
)

Called when a user clicks/taps the list tile.