BorderSideStrokeAlign

Defines where a border stroke is painted relative to the border path.

Inherits: float, Enum

Properties

• CENTER –

  The border is drawn on the center of the border path, with half of the BorderSide.width on the inside, and the other half on the outside of the path.

• INSIDE –

  The border is drawn fully inside of the border path.

• OUTSIDE –

  The border is drawn on the outside of the border path.

Examples

Showcase

import flet as ft


def showcase_card(align: ft.BorderSideStrokeAlign) -> ft.Container:
    preview = ft.Container(
        width=150,
        height=150,
        alignment=ft.Alignment.CENTER,
        content=ft.Stack(
            controls=[
                ft.Container(
                    width=90,
                    height=90,
                    border_radius=45,
                    bgcolor=ft.Colors.ON_SURFACE,
                ),
                ft.Container(
                    width=90,
                    height=90,
                    border_radius=45,
                    border=ft.Border.all(
                        side=ft.BorderSide(
                            width=18,
                            color=ft.Colors.RED,
                            stroke_align=align,
                        )
                    ),
                ),
            ],
        ),
    )

    return ft.Container(
        width=300,
        padding=12,
        border=ft.Border.all(1, ft.Colors.RED),
        border_radius=10,
        bgcolor=ft.Colors.SURFACE_CONTAINER_LOW,
        content=ft.Column(
            spacing=8,
            horizontal_alignment=ft.CrossAxisAlignment.CENTER,
            controls=[
                ft.Text(align.name, weight=ft.FontWeight.BOLD),
                preview,
                ft.Text(f"value={align.value}", size=11),
            ],
        ),
    )


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

    page.appbar = ft.AppBar(title="BorderSideStrokeAlign Showcase")
    page.add(
        ft.Text("Compare how thick borders are painted relative to the shape path."),
        ft.Row(
            wrap=True,
            spacing=12,
            expand=True,
            scroll=ft.ScrollMode.AUTO,
            alignment=ft.MainAxisAlignment.CENTER,
            controls=[showcase_card(align) for align in ft.BorderSideStrokeAlign],
        ),
    )


ft.run(main)

Properties

CENTER = 0.0 class-attribute instance-attribute

The border is drawn on the center of the border path, with half of the BorderSide.width on the inside, and the other half on the outside of the path.

INSIDE = -1.0 class-attribute instance-attribute

The border is drawn fully inside of the border path.

OUTSIDE = 1.0 class-attribute instance-attribute

The border is drawn on the outside of the border path.