Skip to content

MainAxisAlignment 继承自:Enum

子级应如何沿主轴放置。

示例 ​

python
import flet as ft


def dot(label: str) -> ft.Container:
    return ft.Container(
        width=36,
        height=36,
        border_radius=18,
        bgcolor=ft.Colors.PRIMARY_CONTAINER,
        alignment=ft.Alignment.CENTER,
        content=ft.Text(label, size=12, color=ft.Colors.ON_PRIMARY_CONTAINER),
    )


def showcase_card(alignment: ft.MainAxisAlignment) -> ft.Container:
    return ft.Container(
        width=320,
        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(
                    width=250,
                    height=70,
                    padding=8,
                    border=ft.Border.all(1, ft.Colors.OUTLINE),
                    border_radius=8,
                    bgcolor=ft.Colors.SURFACE,
                    content=ft.Row(
                        alignment=alignment,
                        vertical_alignment=ft.CrossAxisAlignment.CENTER,
                        controls=[dot("1"), dot("2"), dot("3")],
                    ),
                ),
            ],
        ),
    )


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

    page.appbar = ft.AppBar(title="MainAxisAlignment Showcase")
    page.add(
        ft.SafeArea(
            content=ft.Column(
                controls=[
                    ft.Text(
                        "Compare horizontal distribution of children in a "
                        "fixed-width row."
                    ),
                    ft.Row(
                        wrap=True,
                        spacing=12,
                        expand=True,
                        scroll=ft.ScrollMode.AUTO,
                        alignment=ft.MainAxisAlignment.CENTER,
                        controls=[
                            showcase_card(alignment)
                            for alignment in ft.MainAxisAlignment
                        ],
                    ),
                ],
            ),
        )
    )


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

值 ​

名称类型默认值说明
START—'start'让子级尽可能靠近主轴的起点。
END—'end'让子级尽可能靠近主轴的末端。
CENTER—'center'让子级尽可能靠近主轴的中点。
SPACE_BETWEEN—'spaceBetween'将空闲空间均匀地分配在子级之间。
SPACE_AROUND—'spaceAround'将空闲空间均匀地分配在子级之间,并在第一个和最后一个子级前后各留出一半的空闲空间。
SPACE_EVENLY—'spaceEvenly'将空闲空间均匀地分配在子级之间,并在第一个和最后一个子级前后也留出该空间。

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