Skip to main content

CupertinoListTile

An iOS-style list tile. The CupertinoListTile is a Cupertino equivalent of Material ListTile.

It comes in two forms, an old-fashioned edge-to-edge variant known from iOS Settings app and in a new, "Inset Grouped" form, known from either iOS Notes or Reminders app. The first form is created if notched property is False (default value) and the second form is created is notched is True.

Examples​

Live example

import flet as ft


def main(page: ft.Page):
    def tile_clicked(e):
        print("Tile clicked")

    page.add(
        ft.CupertinoListTile(
            additional_info=ft.Text("Wed Jan 24"),
            bgcolor_activated=ft.colors.AMBER_ACCENT,
            leading=ft.Icon(name=ft.cupertino_icons.GAME_CONTROLLER),
            title=ft.Text("CupertinoListTile not notched"),
            subtitle=ft.Text("Subtitle"),
            trailing=ft.Icon(name=ft.cupertino_icons.ALARM),
            on_click=tile_clicked,
        ),
        ft.CupertinoListTile(
            notched=True,
            additional_info=ft.Text("Thu Jan 25"),
            leading=ft.Icon(name=ft.cupertino_icons.GAME_CONTROLLER),
            title=ft.Text("CupertinoListTile notched"),
            subtitle=ft.Text("Subtitle"),
            trailing=ft.Icon(name=ft.cupertino_icons.ALARM),
            on_click=tile_clicked,
        ),
    )


ft.app(target=main)

Properties​

additional_info​

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. Usually a Text control.

bgcolor​

The list tile's background color.

bgcolor_activated​

The list tile's background color after the tile was tapped.

leading​

A Control to display before the title.

leading_size​

The leading_size is used to constrain the width and height of leading control. Defaults to 30.0 if notched=True, else 28.0.

leading_to_title​

The horizontal space between leading and title. Defaults to 12.0 if notched=True, else 16.0.

notched​

If True, list tile will be created in an "Inset Grouped" form, known from either iOS Notes or Reminders app. The default value is False.

padding​

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

See Container.padding property for more information and possible values.

subtitle​

Additional content displayed below the title. Typically a Text control.

title​

A Control to display as primary content of the list tile. Typically a Text control.

toggle_inputs​

Whether clicking on a list tile should toggle the state of Radio, Checkbox or Switch inside the tile. Default is False.

trailing​

A Control to display after the title. Typically an Icon control.

url​

The URL to open when the list tile is clicked. If registered, on_click event is fired after that.

url_target​

Where to open URL in the web mode. See Container.url_target for possible values.

Events​

on_click​

Fires when a user clicks or taps the list tile.