CupertinoButton

An iOS-style button.

Inherits: LayoutControl

Properties

• alignment(Alignment | None) –

  The alignment of this button's content.

• autofocus(bool) –

  Whether this button should be selected as the initial focus when no other

• bgcolor(ColorValue | None) –

  The background color of this button.

• border_radius(BorderRadiusValue) –

  The radius of the button's corners when it has a background color.

• color(ColorValue | None) –

  The color of this button's text.

• content(StrOrControl | None) –

  The content of this button.

• disabled_bgcolor(ColorValue | None) –

  The background color of this button when disabled.

• focus_color(ColorValue | None) –

  The color to use for the focus highlight for keyboard interactions.

• icon(IconDataOrControl | None) –

  An icon shown in this button.

• icon_color(ColorValue | None) –

  The foreground color of the icon.

• min_size(Size | None) –

  The minimum size of this button.

• mouse_cursor(MouseCursor | None) –

  The cursor for a mouse pointer when it enters or is hovering over this button.

• opacity_on_click(Number) –

  Defines the opacity of the button when it is clicked.

• padding(PaddingValue | None) –

  The amount of space to surround the content control inside the bounds of the

• size(CupertinoButtonSize) –

  The size of this button.

• url(str | Url | None) –

  The URL to open when this button is clicked.

Events

• on_blur(ControlEventHandler[CupertinoButton] | None) –

  Called when this button loses focus.

• on_click(ControlEventHandler[CupertinoButton] | None) –

  Called when a user clicks this button.

• on_focus(ControlEventHandler[CupertinoButton] | None) –

  Called when this button receives focus.

• on_long_press(ControlEventHandler[CupertinoButton] | None) –

  Called when a user long-presses this button.

Methods

• focus –

Examples

Live example

Basic Example

import flet as ft


def main(page: ft.Page):
    page.add(
        ft.CupertinoButton(
            bgcolor=ft.CupertinoColors.LIGHT_BACKGROUND_GRAY,
            opacity_on_click=0.3,
            on_click=lambda e: print("Normal CupertinoButton clicked!"),
            content=ft.Text(
                value="Normal CupertinoButton",
                color=ft.CupertinoColors.DESTRUCTIVE_RED,
            ),
        ),
        ft.CupertinoButton(
            bgcolor=ft.Colors.PRIMARY,
            alignment=ft.Alignment.TOP_LEFT,
            border_radius=ft.border_radius.all(15),
            opacity_on_click=0.5,
            on_click=lambda e: print("Filled CupertinoButton clicked!"),
            content=ft.Text("Filled CupertinoButton", color=ft.Colors.YELLOW),
        ),
        ft.CupertinoButton(
            bgcolor=ft.Colors.PRIMARY,
            disabled=True,
            alignment=ft.Alignment.TOP_LEFT,
            opacity_on_click=0.5,
            content=ft.Text("Disabled CupertinoButton"),
        ),
        ft.Button(
            adaptive=True,
            bgcolor=ft.CupertinoColors.SYSTEM_TEAL,
            content=ft.Row(
                tight=True,
                controls=[
                    ft.Icon(ft.Icons.FAVORITE, color="pink"),
                    ft.Text("Button+adaptive"),
                ],
            ),
        ),
    )


ft.run(main)

Properties

alignment

alignment: Alignment | None = field(
    default_factory=lambda: CENTER
)

The alignment of this button's content.

Typically buttons are sized to be just big enough to contain the child and its padding. If the button's size is constrained to a fixed size, this property defines how the child is aligned within the available space.

autofocus

autofocus: bool = False

Whether this button should be selected as the initial focus when no other node in its scope is currently focused.

bgcolor

bgcolor: ColorValue | None = None

The background color of this button.

border_radius

border_radius: BorderRadiusValue = field(
    default_factory=lambda: all(8.0)
)

The radius of the button's corners when it has a background color.

color

color: ColorValue | None = None

The color of this button's text.

content

content: StrOrControl | None = None

The content of this button.

disabled_bgcolor

disabled_bgcolor: ColorValue | None = None

The background color of this button when disabled.

focus_color

focus_color: ColorValue | None = None

The color to use for the focus highlight for keyboard interactions.

Defaults to a slightly transparent bgcolor. If bgcolor is None, defaults to a slightly transparent CupertinoColors.ACTIVE_BLUE. 'Slightly transparent' in this context means the color is used with an opacity of 0.80, a brightness of 0.69 and a saturation of 0.835.

icon

icon: IconDataOrControl | None = None

An icon shown in this button.

icon_color

icon_color: ColorValue | None = None

The foreground color of the icon.

min_size

min_size: Size | None = None

The minimum size of this button.

mouse_cursor

mouse_cursor: MouseCursor | None = None

The cursor for a mouse pointer when it enters or is hovering over this button.

opacity_on_click

opacity_on_click: Number = 0.4

Defines the opacity of the button when it is clicked.

When not pressed, the button has an opacity of 1.0.

Raises:

• ValueError –

  If opacity_on_click is not between 0.0 and 1.0 inclusive.

padding

padding: PaddingValue | None = None

The amount of space to surround the content control inside the bounds of the button.

size

size: CupertinoButtonSize = LARGE

The size of this button.

url

url: str | Url | None = None

The URL to open when this button is clicked.

Additionally, if on_click event callback is provided, it is fired after that.

Events

on_blur

on_blur: ControlEventHandler[CupertinoButton] | None = None

Called when this button loses focus.

on_click

on_click: ControlEventHandler[CupertinoButton] | None = None

Called when a user clicks this button.

on_focus

on_focus: ControlEventHandler[CupertinoButton] | None = None

Called when this button receives focus.

on_long_press

on_long_press: (
    ControlEventHandler[CupertinoButton] | None
) = None

Called when a user long-presses this button.

Methods

focus

focus()