ListTileTitleAlignment

Defines how ListTile aligns leading and trailing relative to the tile's title area.

The alignment is computed against the text block formed by title and subtitle. Use this to tune the visual balance between icon/avatar controls and text, especially when tiles switch between one-line, two-line, and three-line layouts.

Inherits: Enum

Properties

• BOTTOM –

  Aligns leading and trailing

• CENTER –

  Centers leading and trailing

• THREE_LINE –

  Uses alignment behavior optimized for three-line list tile layouts.

• TITLE_HEIGHT –

  Uses alignment behavior based on title-height rules from legacy list tile layouts.

• TOP –

  Aligns leading and trailing

Examples

Showcase

import flet as ft


def showcase_card(alignment: ft.ListTileTitleAlignment) -> ft.Container:
    return ft.Container(
        width=380,
        padding=12,
        border=ft.Border.all(1, ft.Colors.RED),
        border_radius=10,
        bgcolor=ft.Colors.SURFACE_CONTAINER_LOW,
        content=ft.Column(
            spacing=8,
            controls=[
                ft.Text(alignment.name, weight=ft.FontWeight.BOLD),
                ft.Container(
                    border=ft.Border.all(1, ft.Colors.OUTLINE),
                    border_radius=8,
                    bgcolor=ft.Colors.SURFACE,
                    content=ft.ListTile(
                        title_alignment=alignment,
                        leading=ft.CircleAvatar(content=ft.Text("JD")),
                        title=ft.Text("Jane Doe"),
                        subtitle=ft.Text(
                            "This subtitle helps visualize vertical alignment."
                        ),
                        is_three_line=True,
                        trailing=ft.Icon(ft.Icons.MORE_VERT),
                    ),
                ),
            ],
        ),
    )


def main(page: ft.Page):
    page.theme_mode = ft.ThemeMode.DARK
    page.horizontal_alignment = ft.CrossAxisAlignment.CENTER

    page.appbar = ft.AppBar(title="ListTileTitleAlignment Showcase")
    page.add(
        ft.Text("Compare leading/trailing alignment against title area."),
        ft.Row(
            wrap=True,
            spacing=12,
            expand=True,
            scroll=ft.ScrollMode.AUTO,
            alignment=ft.MainAxisAlignment.CENTER,
            controls=[
                showcase_card(alignment) for alignment in ft.ListTileTitleAlignment
            ],
        ),
    )


ft.run(main)

Properties

BOTTOM = 'bottom' class-attribute instance-attribute

Aligns leading and trailing toward the bottom of the title area.

Bottom placement respects ListTile.min_vertical_padding.

CENTER = 'center' class-attribute instance-attribute

Centers leading and trailing relative to the title/subtitle block.

THREE_LINE = 'threeLine' class-attribute instance-attribute

Uses alignment behavior optimized for three-line list tile layouts.

This is the default alignment style in Material 3.

TITLE_HEIGHT = 'titleHeight' class-attribute instance-attribute

Uses alignment behavior based on title-height rules from legacy list tile layouts.

This is the default alignment style in Material 2.

TOP = 'top' class-attribute instance-attribute

Aligns leading and trailing toward the top of the title area.

Top placement respects ListTile.min_vertical_padding.