Skip to content

StrokeJoin

Styles to use for line segment joins.

Inherits: Enum

Properties

  • BEVEL

    Joins between line segments connect the corners of the butt ends of the line segments to give a beveled appearance.

  • MITER

    Joins between line segments form sharp corners.

  • ROUND

    Joins between line segments are semi-circular.

Examples#

Showcase#

import flet as ft
import flet.canvas as cv


def showcase_card(stroke_join: ft.StrokeJoin) -> ft.Container:
    return ft.Container(
        width=280,
        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(stroke_join.name, weight=ft.FontWeight.BOLD),
                cv.Canvas(
                    width=240,
                    height=120,
                    shapes=[
                        cv.Path(
                            elements=[
                                cv.Path.MoveTo(40, 95),
                                cv.Path.LineTo(120, 25),
                                cv.Path.LineTo(200, 95),
                            ],
                            paint=ft.Paint(
                                style=ft.PaintingStyle.STROKE,
                                stroke_width=24,
                                color=ft.Colors.PRIMARY,
                                stroke_cap=ft.StrokeCap.BUTT,
                                stroke_join=stroke_join,
                            ),
                        )
                    ],
                ),
            ],
        ),
    )


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

    page.appbar = ft.AppBar(title="StrokeJoin Showcase")
    page.add(
        ft.Text("Compare corner rendering for each StrokeJoin value."),
        ft.Row(
            wrap=True,
            spacing=12,
            expand=True,
            scroll=ft.ScrollMode.AUTO,
            alignment=ft.MainAxisAlignment.CENTER,
            controls=[showcase_card(stroke_join) for stroke_join in ft.StrokeJoin],
        ),
    )


ft.run(main)

Properties#

BEVEL = 'bevel' class-attribute instance-attribute #

Joins between line segments connect the corners of the butt ends of the line segments to give a beveled appearance.

MITER = 'miter' class-attribute instance-attribute #

Joins between line segments form sharp corners.

ROUND = 'round' class-attribute instance-attribute #

Joins between line segments are semi-circular.