Why Gemfury? Push, build, and install  RubyGems npm packages Python packages Maven artifacts PHP packages Go Modules Debian packages RPM packages NuGet packages

Repository URL to install this package:

Details    
flet / controls / types.py
Size: Mime:
from dataclasses import dataclass, field
from enum import Enum
from typing import (
    TYPE_CHECKING,
    Any,
    Callable,
    Optional,
    Protocol,
    Union,
)

from flet.controls.colors import Colors
from flet.controls.cupertino.cupertino_colors import CupertinoColors
from flet.controls.cupertino.cupertino_icons import CupertinoIcons
from flet.controls.material.icons import Icons

if TYPE_CHECKING:
    from flet.controls.control import Control  # noqa
    from flet.controls.buttons import ShapeBorder


class AppView(Enum):
    """
    TBD
    """
    WEB_BROWSER = "web_browser"
    FLET_APP = "flet_app"
    FLET_APP_WEB = "flet_app_web"
    FLET_APP_HIDDEN = "flet_app_hidden"


class WebRenderer(Enum):
    """
    TBD
    """
    AUTO = "auto"
    CANVAS_KIT = "canvaskit"
    SKWASM = "skwasm"


class RouteUrlStrategy(Enum):
    """
    TBD
    """
    PATH = "path"
    HASH = "hash"


class UrlTarget(Enum):
    """
    TBD
    """
    BLANK = "blank"
    SELF = "_self"
    PARENT = "_parent"
    TOP = "_top"


class FontWeight(Enum):
    """
    The thickness of the glyphs used to draw the text.
    """
    
    NORMAL = "normal"
    """
    The default font weight, equal to `w400`.
    """
    
    BOLD = "bold"
    """
    A commonly used font weight that is heavier than normal, equal to `w700`.
    """
    
    W_100 = "w100"
    """
    Thin, the least thick.
    """
    
    W_200 = "w200"
    """
    Extra-light.
    """
    
    W_300 = "w300"
    """
    Light.
    """
    
    W_400 = "w400"
    """
    Normal / regular / plain.
    """
    
    W_500 = "w500"
    """
    Medium.
    """
    
    W_600 = "w600"
    """
    Semi-bold.
    """
    
    W_700 = "w700"
    """
    Bold.
    """
    
    W_800 = "w800"
    """
    Extra-bold.
    """
    
    W_900 = "w900"
    """
    Black, the most thick.
    """

@dataclass
class NotchShape:
    """
    A shape with a notch in its outline.

    Typically used as the outline of a 'host' control to make a notch that accommodates a 'guest' control.
    e.g the [`BottomAppBar`][flet.BottomAppBar] may have a notch to accommodate
    the [`FloatingActionButton`][flet.FloatingActionButton].
    """

    _type: Optional[str] = field(init=False, repr=False, compare=False, default=None)


@dataclass
class CircularRectangleNotchShape(NotchShape):
    """
    A rectangle with a smooth circular notch.
    """

    inverted: bool = False
    """
    Whether the notch should be placed at the bottom of the rectangle.
    """

    def __post_init__(self):
        self._type = "circular"

@dataclass
class AutomaticNotchShape(NotchShape):
    """
    A notch sahpe created from [`ShapeBorder`][flet.ShapeBorder]s.
    """

    host: "ShapeBorder"
    guest: Optional["ShapeBorder"] = None

    def __post_init__(self):
        self._type = "auto"


class ResponsiveRowBreakpoint(Enum):
    """
    Breakpoints for responsive design.
    """

    XS = "xs"
    SM = "sm"
    MD = "md"
    LG = "lg"
    XL = "xl"
    XXL = "xxl"


Number = Union[int, float]
ResponsiveNumber = Union[dict[Union[str, ResponsiveRowBreakpoint], Number], Number]


class MainAxisAlignment(Enum):
    """
    How the children should be placed along the main axis.
    """
    
    START = "start"
    """
    Place the children as close to the start of the main axis as possible.
    """

    END = "end"
    """
    Place the children as close to the end of the main axis as possible.
    """
    
    CENTER = "center"
    """
    Place the children as close to the middle of the main axis as possible.
    """

    SPACE_BETWEEN = "spaceBetween"
    """
    Place the free space evenly between the children.
    """

    SPACE_AROUND = "spaceAround"
    """
    Place the free space evenly between the children as well as half of that space 
    before and after the first and last child.
    """
    
    SPACE_EVENLY = "spaceEvenly"
    """
    Place the free space evenly between the children as well as before and after the 
    first and last child.
    """


class CrossAxisAlignment(Enum):
    """
    How the children should be placed along the cross axis
    """

    START = "start"
    """
    Place the children with their start edge aligned with the start side of the cross 
    axis.
    """

    END = "end"
    """
    Place the children as close to the end of the cross axis as possible.
    """

    CENTER = "center"
    """
    Place the children so that their centers align with the middle of the cross axis.
    """

    STRETCH = "stretch"
    """
    Require the children to fill the cross axis.
    """

    BASELINE = "baseline"
    """
    Place the children along the cross axis such that their baselines match.
    """


class VerticalAlignment(Enum):
    """
    The vertical alignment of text within an input box.
    """

    NONE = None
    
    START = -1.0
    """
    Aligns the text vertically at the topmost location of the TextField.
    """
    
    END = 1.0
    """
    Aligns the text vertically at the bottommost location of the TextField.
    """
    
    CENTER = 0.0
    """
    Aligns the text vertically in the center of the TextField.
    """


class TabAlignment(Enum):
    """
    Defines how tabs are aligned horizontally in a [`Tabs`][flet.Tabs].
    """

    START = "start"
    """
    If `Tabs.scrollable` is `True`, tabs are aligned to the start of the `Tabs`. 
    Otherwise throws an exception.
    """

    START_OFFSET = "startOffset"
    """
    If `Tabs.scrollable` is `True`, tabs are aligned to the start of the `Tabs` with an 
    offset of 52.0 pixels. Otherwise throws an exception.
    """

    FILL = "fill"
    """
    If `Tabs.scrollable` is `False`, tabs are stretched to fill the `Tabs`. Otherwise 
    throws an exception.
    """
    
    CENTER = "center"
    """
    Tabs are aligned to the center of the `Tabs`.
    """


class LabelPosition(Enum):
    """
    Position of label in a [`Checkbox`][flet.Checkbox], [`Radio`][flet.Radio] or 
    [`Switch`][flet.Switch]
    """

    RIGHT = "right"
    """
    The label is positioned to the right of the control.
    """

    LEFT = "left"
    """
    The label is positioned to the left of the control.
    """


class BlendMode(Enum):
    """
    See [BlendMode](https://api.flutter.dev/flutter/dart-ui/BlendMode.html) from 
    Flutter documentation for blend mode examples.
    """

    CLEAR = "clear"
    COLOR = "color"
    COLOR_BURN = "colorBurn"
    COLOR_DODGE = "colorDodge"
    DARKEN = "darken"
    DIFFERENCE = "difference"
    DST = "dst"
    DST_A_TOP = "dstATop"
    DST_IN = "dstIn"
    DST_OUT = "dstOut"
    DST_OVER = "dstOver"
    EXCLUSION = "exclusion"
    HARD_LIGHT = "hardLight"
    HUE = "hue"
    LIGHTEN = "lighten"
    LUMINOSITY = "luminosity"
    MODULATE = "modulate"
    MULTIPLY = "multiply"
    OVERLAY = "overlay"
    PLUS = "plus"
    SATURATION = "saturation"
    SCREEN = "screen"
    SOFT_LIGHT = "softLight"
    SRC = "src"
    SRC_A_TOP = "srcATop"
    SRC_IN = "srcIn"
    SRC_OUT = "srcOut"
    SRC_OVER = "srcOver"
    VALUES = "values"
    XOR = "xor"


class TextAlign(Enum):
    """
    The horizontal alignment of text within an input box.
    """

    LEFT = "left"
    """
    Align the text on the left edge of the container.
    """
    
    RIGHT = "right"
    """
    Align the text on the right edge of the container.
    """

    CENTER = "center"
    """
    Align the text in the center of the container.
    """

    JUSTIFY = "justify"
    """
    Stretch lines of text that end with a soft line break to fill the width of the 
    container.
    """

    START = "start"
    """
    Align the text on the leading edge of the container.
    """

    END = "end"
    """
    Align the text on the trailing edge of the container.
    """


class ScrollMode(Enum):
    """
    Weather scrolling is enabled and visibility of scroll bar options.
    """
    
    AUTO = "auto"
    """
    Scrolling is enabled and scroll bar is only shown when scrolling occurs.
    """

    ADAPTIVE = "adaptive"
    """
    Scrolling is enabled and scroll bar is always shown when running app as web or 
    desktop.
    """
    
    ALWAYS = "always"
    """
    Scrolling is enabled and scroll bar is always shown.
    """

    HIDDEN = "hidden"
    """
    Scrolling is enabled, but scroll bar is always hidden.
    """


class ClipBehavior(Enum):
    """
    Different ways to clip content. See [Clip](https://api.flutter.dev/flutter/dart-ui/Clip.html) 
    from Flutter documentation for ClipBehavior examples.
    """

    NONE = "none"
    """
    No clip at all.

    This is the default option for most widgets: if the content does not overflow the 
    widget boundary, don't pay any performance cost for clipping.
    """

    ANTI_ALIAS = "antiAlias"
    """
    Clip with anti-aliasing.

    This mode has anti-aliased clipping edges, which reduces jagged edges when the clip 
    shape itself has edges that are diagonal, curved, or otherwise not axis-aligned.
    """

    ANTI_ALIAS_WITH_SAVE_LAYER = "antiAliasWithSaveLayer"
    """
    Clip with anti-aliasing and saveLayer immediately following the clip.
    """
    
    HARD_EDGE = "hardEdge"
    """
    Clip, but do not apply anti-aliasing.

    This mode enables clipping, but curves and non-axis-aligned straight lines will be 
    jagged as no effort is made to anti-alias.
    """


class ImageRepeat(Enum):
    """
    How to paint any portions of a box not covered by an image.
    """

    NO_REPEAT = "noRepeat"
    REPEAT = "repeat"
    REPEAT_X = "repeatX"
    REPEAT_Y = "repeatY"


class PagePlatform(Enum):
    IOS = "ios"
    ANDROID = "android"
    ANDROID_TV = "android_tv"
    MACOS = "macos"
    WINDOWS = "windows"
    LINUX = "linux"

    def is_apple(self) -> bool:
        """Whether this PagePlatform instance is an Apple (iOS or macOS) platform."""
        return self in {PagePlatform.IOS, PagePlatform.MACOS}

    def is_mobile(self) -> bool:
        """Whether this PagePlatform instance is a mobile (iOS or Android) platform."""
        return self in {PagePlatform.IOS, PagePlatform.ANDROID}

    def is_desktop(self) -> bool:
        """
        Whether this PagePlatform instance is a desktop (macOS, Windows, Linux)
        platform.
        """
        return self in {PagePlatform.MACOS, PagePlatform.WINDOWS, PagePlatform.LINUX}


class ThemeMode(Enum):
    SYSTEM = "system"
    LIGHT = "light"
    DARK = "dark"


class Brightness(Enum):
    LIGHT = "light"
    DARK = "dark"


class Orientation(Enum):
    PORTRAIT = "portrait"
    LANDSCAPE = "landscape"


class FloatingActionButtonLocation(Enum):
    CENTER_DOCKED = "centerDocked"
    CENTER_FLOAT = "centerFloat"
    CENTER_TOP = "centerTop"
    END_CONTAINED = "endContained"
    END_DOCKED = "endDocked"
    END_FLOAT = "endFloat"
    END_TOP = "endTop"
    MINI_CENTER_DOCKED = "miniCenterDocked"
    MINI_CENTER_FLOAT = "miniCenterFloat"
    MINI_CENTER_TOP = "miniCenterTop"
    MINI_END_DOCKED = "miniEndDocked"
    MINI_END_FLOAT = "miniEndFloat"
    MINI_END_TOP = "miniEndTop"
    MINI_START_DOCKED = "miniStartDocked"
    MINI_START_FLOAT = "miniStartFloat"
    MINI_START_TOP = "miniStartTop"
    START_DOCKED = "startDocked"
    START_FLOAT = "startFloat"
    START_TOP = "startTop"


class AppLifecycleState(Enum):
    SHOW = "show"
    RESUME = "resume"
    HIDE = "hide"
    INACTIVE = "inactive"
    PAUSE = "pause"
    DETACH = "detach"
    RESTART = "restart"


class MouseCursor(Enum):
    ALIAS = "alias"
    ALL_SCROLL = "allScroll"
    BASIC = "basic"
    CELL = "cell"
    CLICK = "click"
    CONTEXT_MENU = "contextMenu"
    COPY = "copy"
    DISAPPEARING = "disappearing"
    FORBIDDEN = "forbidden"
    GRAB = "grab"
    GRABBING = "grabbing"
    HELP = "help"
    MOVE = "move"
    NO_DROP = "noDrop"
    NONE = "none"
    PRECISE = "precise"
    PROGRESS = "progress"
    RESIZE_COLUMN = "resizeColumn"
    RESIZE_DOWN = "resizeDown"
    RESIZE_DOWN_LEFT = "resizeDownLeft"
    RESIZE_DOWN_RIGHT = "resizeDownRight"
    RESIZE_LEFT = "resizeLeft"
    RESIZE_LEFT_RIGHT = "resizeLeftRight"
    RESIZE_RIGHT = "resizeRight"
    RESIZE_ROW = "resizeRow"
    RESIZE_UP = "resizeUp"
    RESIZE_UP_DOWN = "resizeUpDown"
    RESIZE_UP_LEFT = "resizeUpLeft"
    RESIZE_UP_LEFT_DOWN_RIGHT = "resizeUpLeftDownRight"
    RESIZE_UP_RIGHT = "resizeUpRight"
    RESIZE_UP_RIGHT_DOWN_LEFT = "resizeUpRightDownLeft"
    TEXT = "text"
    VERTICAL_TEXT = "verticalText"
    WAIT = "wait"
    ZOOM_IN = "zoomIn"
    ZOOM_OUT = "zoomOut"


class PointerDeviceType(Enum):
    TOUCH = "touch"
    MOUSE = "mouse"
    STYLUS = "stylus"
    INVERTED_STYLUS = "invertedStylus"
    TRACKPAD = "trackpad"
    UNKNOWN = "unknown"


class StrokeCap(Enum):
    ROUND = "round"
    SQUARE = "square"
    BUTT = "butt"


class StrokeJoin(Enum):
    MITER = "miter"
    ROUND = "round"
    BEVEL = "bevel"


class VisualDensity(Enum):
    STANDARD = "standard"
    COMPACT = "compact"
    COMFORTABLE = "comfortable"
    ADAPTIVE_PLATFORM_DENSITY = "adaptivePlatformDensity"


@dataclass
class Locale:
    language_code: Optional[str] = None
    country_code: Optional[str] = None
    script_code: Optional[str] = None


@dataclass
class LocaleConfiguration:
    supported_locales: Optional[list[Locale]] = None
    current_locale: Optional[Locale] = None


# Colors
ColorValue = Union[str, Colors, CupertinoColors]
"""Type alias for color values.

Represents a color and can be:
- a string (representing a color name or hex value),
- a material color from the [`Colors`][flet.Colors] enum,
- or a Cupertino color from the [`CupertinoColors`][flet.CupertinoColors] enum.

<img src="/img/docs/colors/color_palettes.png"className="screenshot-100" />

### Hex value

Hex value should be in format `#aarrggbb` (`0xaarrggbb`) or `#rrggbb` (`0xeeggbb`). 
In case `aa` ([opacity](/docs/reference/colors#color-opacity)) is omitted, it is set to `ff` (not transparent).

```
>>> Container(bgcolor='#ff0000')
```

[Live example](https://flet-controls-gallery.fly.dev/colors/controlcolors)

### Named colors

Named colors are the Material Design [theme colors](https://m3.material.io/styles/color/the-color-system/color-roles) 
and [colors palettes](https://m2.material.io/design/color/the-color-system.html#color-usage-and-palettes). 
They can either be set with a string value or using the `Colors` or `CupertinoColors` enums.

```python
>>> Container(bgcolor=ft.Colors.YELLOW)
>>> Container(bgcolor='yellow')
```

#### Theme colors

<img src="/img/docs/colors/theme_colors.png"className="screenshot-100" />

[Live Example](https://flet-controls-gallery.fly.dev/colors/themecolors)

There are 30 named theme colors in [`Theme.color_scheme`][flet.Theme.color_scheme] that are 
generated based on the [`Theme.color_scheme_seed`][flet.Theme.color_scheme_seed] property, 
which defaults to `Colors.BLUE`.

```
# example for generating page theme colors based on the seed color
page.theme = Theme(color_scheme_seed=ft.Colors.GREEN)
page.update()
```

Any of the 30 colors can be overridden, in which case they will have an absolute value 
that will not be dependent on the seed color.
```
page.theme = ft.Theme(
    color_scheme=ft.ColorScheme(
        primary=ft.Colors.GREEN,
        primary_container=ft.Colors.GREEN_200
    ),
)
```

<img src="/img/docs/colors/theme_colors_green.png"className="screenshot-100" />

Theme colors define fallback colors for most of Flet controls.

#### Color palettes

<img src="/img/docs/colors/color_palettes_2.png"className="screenshot-100" />

[Live example](https://flet-controls-gallery.fly.dev/colors/colorspalettes)

Originally created by Material Design in 2014, color palettes are comprised of colors designed 
to work together harmoniously. 

Color swatches (palettes) consist of different shades of a certain color. 
Most swatches have shades from `100` to `900` in increments of one hundred, plus the color `50`. 
The smaller the number, the more pale the color. The greater the number, the darker the color. 
The accent swatches (e.g. `redAccent`) only have the values `100`, `200`, `400`, and `700`.

In addition, a series of blacks and whites with common opacities are available. 
For example, `black54` is a pure black with 54% opacity.

Palette colors can be used for setting individual controls color property or as a 
seed color for generating Theme colors.

## Color opacity

You can specify opacity for any color (hex value or named) using `with_opacity` method. 
Opacity value should be between `0.0` (completely transparent) and `1.0` (not transparent).

```python
color = ft.Colors.with_opacity(0.5, ft.Colors.PRIMARY)
color = ft.Colors.with_opacity(0.5, '#ff6666')
```

Another way to specify opacity for string value:

```python
color = "surface,0.5"
```

For hex value, you can specify `aa` channel with values between `00` and `ff`, for example:

```python
color = "#7fff6666"
``` 

## Defining colors for Flet controls

Most Flet controls have default colors defined by the `color_scheme` that can be 
overridden on different levels.

[Live example](https://flet-controls-gallery.fly.dev/colors/controlcolors)

<img src="/img/docs/colors/colors_fallback.svg"className="screenshot-80" />

### Control level

If the color is defined on the control level, it will be used.

```python
c = ft.Container(width=100, height=100, bgcolor=ft.Colors.GREEN_200)
```

Not every Flet control has a color property that can be set on the control level. 
For example, `FilledButton` always has a default "primary" color defined by the nearest 
ancestor's `theme`.

### Control Theme level

For `ScrollBar` (used in scrollable controls: `Page`, `View`, `Column`, `Row`, `ListView` 
and `GridView`), `Tabs` and `Text` controls, Flet will check if the [nearest anscestor](/blog/scrolling-controls-and-theming#nested-themes) 
theme has [ScrollBar Theme](/blog/scrolling-controls-and-theming#scrollbar-theme), [Tabs theme](/blog/scrolling-controls-and-theming#tabs-theming) or [Text theme](/blog/scrolling-controls-and-theming#text-theming) specified.

Note:
    If you need to change theme for a particular ScrollBar, Text or Tabs control, you can wrap 
    this control in a Container and customize `scrollbar_theme`, `text_theme` or `tabs_theme` 
    for this Container `theme`.

### Theme level

Flet will check for the nearest ancestor that has `theme` defined, which is of type 
[`Theme`][flet.Theme], and will take color from its [`color_scheme`][flet.Theme.color_scheme]. 

/// details | Example
    type: example
In the example below, the nearest anscestor for the [`FilledButton`][flet.FilledButton]
is [`Container`][flet.Container], and the `primary` color that is used for the button 
will be taken from [`Container.theme`][flet.Container.theme].

```python
import flet as ft

def main(page: ft.Page):          
    page.add(
        ft.Container(
            width=200,
            height=200,
            border=ft.border.all(1, ft.Colors.BLACK),
            theme=ft.Theme(color_scheme=ft.ColorScheme(primary=ft.Colors.YELLOW))
            content=ft.FilledButton("Primary color"),
        )
    )

ft.run(main)   
```

If control's color property, control-specific theme or nearest ancestor's theme is not 
specified, the nearest ancestor will be the [`Page`][flet.Page] and the colors from its 
[`theme.color_scheme`][flet.Page.theme] will be used.  
///
"""

# Icons
IconValue = Union[str, Icons, CupertinoIcons]
"""Type alias for icon values.

Represents an icon and can be:
- a string (icon name),
- a material icon from the [`Icons`][flet.Icons] enum,
- or a Cupertino icon from the `[CupertinoIcons`][flet.CupertinoIcons] enum.

/// details | Example
    type: example

```python
>>> import flet as ft
>>> ft.Icons.ABC
>>> ft.CupertinoIcons.BACK
>>> ft.Icons.random()
>>> ft.CupertinoIcons.random()
>>> ft.Icons.random(exclude=[ft.Icons.FAVORITE, ft.Icons.SCHOOL], weights={ft.Icons.SCHOOL: 150, ft.Icons.ADJUST: 5})
>>> ft.CupertinoIcons.random(exclude=[ft.CupertinoIcons.CAMERA, ft.CupertinoIcons.TABLE], weights={ft.CupertinoIcons.TABLE: 150, ft.CupertinoIcons.PENCIL: 5})
```
///
"""
IconValueOrControl = Union[IconValue, "Control"]

# Content
StrOrControl = Union[str, "Control"]
"""
Type alias for string or control values.

Represents a string or a control and can be:
- a string, which will be converted internally into a [`Text`][flet.Text] control,
- or a control.

"""

# Wrapper
Wrapper = Callable[..., Any]


# Protocols
class SupportsStr(Protocol):
    def __str__(self) -> str: ...