Skip to content

ListTileTitleAlignment 继承自: Enum

定义 ListTile 如何将 leading 与 trailing 相对其标题区域对齐。

对齐方式以由 title 和 subtitle 组成的文本块为基准计算。当列表项在单行、双行、三行布局之间切换时,可用它来调节图标/头像控件与文字之间的视觉平衡。

示例 ​

python
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.horizontal_alignment = ft.CrossAxisAlignment.CENTER

    page.appbar = ft.AppBar(title="ListTileTitleAlignment Showcase")
    page.add(
        ft.SafeArea(
            content=ft.Column(
                controls=[
                    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
                        ],
                    ),
                ],
            ),
        )
    )


if __name__ == "__main__":
    ft.run(main)

枚举值 ​

名称类型默认值说明
TOP—'top'Aligns leading and trailing toward the top of the title area. Top placement respects min_vertical_padding.
CENTER—'center'Centers leading and trailing relative to the title/subtitle block.
BOTTOM—'bottom'Aligns leading and trailing toward the bottom of the title area. Bottom placement respects min_vertical_padding.
THREE_LINE—'threeLine'Uses alignment behavior optimized for three-line list tile layouts. This is the default alignment style in Material 3.
TITLE_HEIGHT—'titleHeight'Uses alignment behavior 基于 title-height rules from legacy list tile layouts. This is the default alignment style in Material 2.

关注我,学习大模型、大数据、Python等热门技术。