Checkbox

Checkbox allows to select one or more items from a group, or switch between two mutually exclusive options (checked or unchecked, on or off).

ft.Checkbox()
ft.Checkbox(label="Checked", value=True)
ft.Checkbox(label="Disabled", disabled=True)

Basic checkboxes

Inherits: LayoutControl, AdaptiveControl

Properties

• active_color - The color to use when this checkbox is checked.
• autofocus - True if the control will be selected as the initial focus.
• border_side - The color and width of this checkbox's border in all or specific ControlStates.
• check_color - The color to use for the check icon when this checkbox is checked.
• error - Whether this checkbox wants to show an error state.
• fill_color - The color that fills this checkbox in all or specific ControlStates.
• focus_color - The color for the checkbox's Material when it has the input focus.
• hover_color - The color to use when this checkbox is hovered.
• label - The clickable label to display on the right of a checkbox.
• label_position - Defines on which side of the checkbox the label should be shown.
• label_style - The label's text style.
• mouse_cursor - The cursor to be displayed when a mouse pointer enters or is hovering over this checkbox.
• overlay_color - The color of this checkbox's overlay in various ControlState states.
• semantics_label - The semantic label for the checkbox that is not shown in the UI, but will be announced by screen readers in accessibility modes (e.g TalkBack/VoiceOver).
• shape - The shape of the checkbox.
• splash_radius - The radius of the circular Material ink response (ripple) in logical pixels.
• tristate - If True the checkbox's value can be True, False, or None.
• value - The value of this checkbox.
• visual_density - Defines how compact the checkbox's layout will be.

Events

• on_blur - Called when this checkbox has lost focus.
• on_change - Called when the state of this checkbox is changed.
• on_focus - Called when this checkbox has received focus.

Examples

Live example

Basic Example

import flet as ft


def main(page: ft.Page):
    def handle_button_click(e: ft.Event[ft.Button]):
        message.value = (
            f"Checkboxes values are:  {c1.value}, {c2.value}, {c3.value}, "
            f"{c4.value}, {c5.value}."
        )

    page.add(
        ft.SafeArea(
            content=ft.Column(
                controls=[
                    c1 := ft.Checkbox(
                        label="Unchecked by default checkbox", value=False
                    ),
                    c2 := ft.Checkbox(
                        label="Undefined by default tristate checkbox", tristate=True
                    ),
                    c3 := ft.Checkbox(label="Checked by default checkbox", value=True),
                    c4 := ft.Checkbox(label="Disabled checkbox", disabled=True),
                    c5 := ft.Checkbox(
                        label="Checkbox with LEFT label_position",
                        label_position=ft.LabelPosition.LEFT,
                    ),
                    ft.Button(content="Submit", on_click=handle_button_click),
                    message := ft.Text(),
                ]
            )
        )
    )


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

After clicking Submit

Handling events

import flet as ft


def main(page: ft.Page):
    events = ft.Column()

    def handle_checkbox_change(e: ft.Event[ft.Checkbox]):
        events.controls.append(ft.Text(f"Checkbox value changed to {e.control.value}"))

    page.add(
        ft.SafeArea(
            content=ft.Column(
                controls=[
                    ft.Checkbox(
                        label="Checkbox with 'change' event",
                        on_change=handle_checkbox_change,
                    ),
                    events,
                ]
            )
        )
    )


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

After three clicks

Styled checkboxes

import flet as ft


def main(page: ft.Page):
    page.add(
        ft.SafeArea(
            content=ft.Column(
                controls=[
                    ft.Checkbox(label="Checkbox with default style"),
                    ft.Checkbox(
                        label="Checkbox with constant fill color",
                        fill_color=ft.Colors.RED,
                        check_color=ft.Colors.YELLOW,
                    ),
                    ft.Checkbox(
                        label="Checkbox with dynamic fill color",
                        fill_color={
                            ft.ControlState.HOVERED: ft.Colors.BLUE,
                            ft.ControlState.SELECTED: ft.Colors.GREEN,
                            ft.ControlState.DEFAULT: ft.Colors.RED,
                        },
                    ),
                ]
            )
        ),
    )


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

Properties

buildactive_colorclass-attributeinstance-attribute

active_color: Optional[ColorValue] = None

The color to use when this checkbox is checked.

buildautofocusclass-attributeinstance-attribute

autofocus: bool = False

True if the control will be selected as the initial focus. If there is more than one control on a page with autofocus set, then the first one added to the page will get focus.

buildborder_sideclass-attributeinstance-attribute

border_side: Optional[ControlStateValue[BorderSide]] = None

The color and width of this checkbox's border in all or specific ControlStates.

Defaults to flet.CheckboxTheme.border_side, or if that is None, falls back to BorderSide with a width of 2.0.

Note

Supported states: flet.ControlState.SELECTED, flet.ControlState.HOVERED, flet.ControlState.DISABLED, flet.ControlState.FOCUSED, flet.ControlState.PRESSED, flet.ControlState.ERROR, and flet.ControlState.DEFAULT.

buildcheck_colorclass-attributeinstance-attribute

check_color: Optional[ColorValue] = None

The color to use for the check icon when this checkbox is checked.

builderrorclass-attributeinstance-attribute

error: bool = False

Whether this checkbox wants to show an error state.

If True this checkbox will have a different default container color and check color.

buildfill_colorclass-attributeinstance-attribute

fill_color: Optional[ControlStateValue[ColorValue]] = None

The color that fills this checkbox in all or specific ControlStates.

Note

Supported states: flet.ControlState.SELECTED, flet.ControlState.HOVERED, flet.ControlState.DISABLED, flet.ControlState.FOCUSED, and flet.ControlState.DEFAULT.

buildfocus_colorclass-attributeinstance-attribute

focus_color: Optional[ColorValue] = None

The color for the checkbox's Material when it has the input focus. If overlay_color returns a non-None color in the flet.ControlState.FOCUSED state, it will be used instead.

Defaults to flet.CheckboxTheme.overlay_color in the flet.ControlState.FOCUSED state, or if that is None, falls back to flet.Theme.focus_color.

buildhover_colorclass-attributeinstance-attribute

hover_color: Optional[ColorValue] = None

The color to use when this checkbox is hovered.

buildlabelclass-attributeinstance-attribute

label: Optional[StrOrControl] = None

The clickable label to display on the right of a checkbox.

buildlabel_positionclass-attributeinstance-attribute

label_position: LabelPosition = LabelPosition.RIGHT

Defines on which side of the checkbox the label should be shown.

buildlabel_styleclass-attributeinstance-attribute

label_style: Optional[TextStyle] = None

The label's text style.

buildmouse_cursorclass-attributeinstance-attribute

mouse_cursor: Optional[MouseCursor] = None

The cursor to be displayed when a mouse pointer enters or is hovering over this checkbox.

Defaults to flet.CheckboxTheme.mouse_cursor, or if that is None, falls back to MouseCursor.CLICK.

buildoverlay_colorclass-attributeinstance-attribute

overlay_color: Optional[ControlStateValue[ColorValue]] = None

The color of this checkbox's overlay in various ControlState states.

Note

Supported states: flet.ControlState.PRESSED, flet.ControlState.SELECTED, flet.ControlState.HOVERED, flet.ControlState.FOCUSED, and flet.ControlState.DEFAULT.

buildsemantics_labelclass-attributeinstance-attribute

semantics_label: Optional[str] = None

The semantic label for the checkbox that is not shown in the UI, but will be announced by screen readers in accessibility modes (e.g TalkBack/VoiceOver).

buildshapeclass-attributeinstance-attribute

shape: Optional[OutlinedBorder] = None

The shape of the checkbox.

Defaults to flet.CheckboxTheme.shape, or if that is None, falls back to RoundedRectangleBorder(radius=2).

buildsplash_radiusclass-attributeinstance-attribute

splash_radius: Optional[Number] = None

The radius of the circular Material ink response (ripple) in logical pixels.

Defaults to flet.CheckboxTheme.splash_radius, or if that is None, falls back to 20.0.

buildtristateclass-attributeinstance-attribute

tristate: bool = False

If True the checkbox's value can be True, False, or None.

buildvalueclass-attributeinstance-attribute

value: Optional[bool] = False

The value of this checkbox.

• If True, this checkbox is checked.
• If False, this checkbox is unchecked.
• If None and tristate is True, this checkbox is indeterminate (displayed as a dash).

buildvisual_densityclass-attributeinstance-attribute

visual_density: Optional[VisualDensity] = None

Defines how compact the checkbox's layout will be.

Events

bolton_blurclass-attributeinstance-attribute

on_blur: Optional[ControlEventHandler[Checkbox]] = None

Called when this checkbox has lost focus.

bolton_changeclass-attributeinstance-attribute

on_change: Optional[ControlEventHandler[Checkbox]] = None

Called when the state of this checkbox is changed.

bolton_focusclass-attributeinstance-attribute

on_focus: Optional[ControlEventHandler[Checkbox]] = None

Called when this checkbox has received focus.