fletmint icon indicating copy to clipboard operation
fletmint copied to clipboard

A sharp and modern components library for Flet

++++

fletmint logo PyPI version

A sharp and modern components library for Flet.
Accessible. Customizable. Open Source.

DocumentationSupport Me

fletmint logo ++++

link:https://www.patreon.com/edoardobalducci[ image:https://pbs.twimg.com/media/DC4gjLRUMAAyQ92.jpg[Donate, align="center", width=180]]

= Installation

  • from link:https://pypi.org/project/fletmint/[PyPI]
pip install fletmint
  • from source
git clone https://github.com/Bbalduzz/fletmint.git

cd fletmint

py311 setup.py install

= Documentation

TIP: every component inherits its parent's class methods

=== fletmint.*Button* The Button component inherits the flet.TextButton

===== params

  • width: int = width of the button
  • height:int = height of the button
  • disabled: bool = make the button disabled
  • label: str = button's label
  • icon: ft.icons = button's icon

===== methods

  • on_click = fires when the button is clicked

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    ft.Row(
        [
            Button(),
            Button(disabled=True),
        ]
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/59810910-65bd-43d8-8980-f54c2508a881[alt="not bad.",width=400]

=== fletmint.*TextInput* The TextInput component inherits the flet.Container

===== params

  • prefix: Any
  • suffix: Any
  • on_focus_additional: Any = set a function to fire when the field is focused
  • on_blur_additional: Any = set a function to fire when the field is not focused
  • theme: ThemeMode

===== methods

  • every in the TextButton

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    ft.Row(
        [
            TextInput(),
            TextInput(password=True)
        ]
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/6788bed5-f79a-45f1-b8fd-5259fdb1575c[alt="not bad.",width=400]

It offers less style modifications, but enhances the flet.TextField accepting by default a prefix and a suffix: [source,python]

text_input_with_suffix_and_prefix = TextInput( prefix=ft.Icon(name=ft.icons.SEARCH, color=ft.colors.GREY_200, size=18), suffix=ft.CircleAvatar( foreground_image_src="https://cdn.pixabay.com/photo/2015/10/05/22/37/blank-profile-picture-973460_1280.png", radius=30, ), )

def show_password(e): e.control.parent.parent.controls[0].password ^= True e.control.parent.parent.controls[0].update() e.control.icon = ( ft.icons.LOCK_OPEN_ROUNDED if e.control.icon == ft.icons.LOCK_ROUNDED else ft.icons.LOCK_ROUNDED ) e.control.update() password_input = TextInput( password=True, suffix=ft.IconButton( icon=ft.icons.LOCK_ROUNDED, icon_color="#e3e2e2", icon_size=10, splash_radius=0, on_click=show_password, ), )

=== fletmint.*TagsInput* The TagsInput component inherits the flet.Container. The tags are fletmint.Badge.

===== params

  • max_width: int
  • max_tags: int
  • theme: ThemeMode

===== methods

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    TagsInput(max_width=300, max_tags=2)
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/d1fd5130-aca5-4603-99e5-4588a3fd964b[alt="not bad.",width=400]

=== fletmint.*Stepper* The Stepper component inherits the flet.Container.

===== params

  • initial_value: int
  • suffix: str

===== methods

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    Stepper(initial_value=123, suffix="px")
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/e09c7410-1f68-4d55-a48b-c0e6f9288ea6[alt="not bad.",height=150]

=== fletmint.*TabSwitch* The TabSwitch component inherits the flet.Container.

===== params

  • tab_labels: list
  • initial_value: 0 | 1
  • theme: ThemeMode

===== methods

  • on_switch: return the selected label

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    TabSwitch(
        ["Label", "Label", "Label"],
        on_switch=lambda value: print(f"Switched to tab {value}"),
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/b3a69719-8306-4525-bed8-ca9367800f6e[alt="not bad.",height=150]

=== fletmint.*Dropdown* The Dropdown component inherits the flet.Container.

===== params

  • controls: list = could be both plain strings or other flet components
  • dropdown_icons: list[ft.icons]
  • max_width: int
  • theme: ThemeMode

===== methods

  • on_select: return the selected control

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    Dropdown(
        max_width=250,
        controls=[
            "figma",
            "sketch",
            "invision studio",
            "framer",
            "adobe xd",
        ],
        on_select=lambda e: print(f"Selected: {e}"),
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/4fae1089-75e4-49cf-a575-f9d2f2e64d27[alt="not bad.",height=300]

=== fletmint.*DatePicker* The DatePicker component inherits the flet.UserControl.

===== params

  • is_dropdown: bool = if the calendar is dropdown (default False)
  • left_content: Any = set the left content of the calendars' footer
  • multi_select_mode: bool = if the user can select multiple dates (default True)
  • dropdown_icons: list[ft.icons]
  • max_width: int = set the width of the dropdown

===== methods

  • on_date_choosen: return the selected date/dates as a datetime object. Here you can specify the date string formatting ex. "%Y-%m-%d", "%d/%m/%Y" etc..
  • on_cancel: return nothing, if datepicker is in dropdown mode it closes it

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    DatePicker(
        is_dropdown=False,
        multi_select_mode=True,
        on_date_choosen=lambda value: print(f"Selected dates: {value}"),
    )
)

ft.app(target=main)

|================== |is_dropdown=False|is_dropdown=True |image:https://github.com/Bbalduzz/fletmint/assets/81587335/ecafb7ad-e132-4ce3-8b5b-0759ee9ff0b6[alt="not bad.",height=300] | image:https://github.com/Bbalduzz/fletmint/assets/81587335/f0dfd7ea-16d1-4242-b230-2be9e03eea0e[alt="not bad.",height=300] |==================

=== fletmint.*Badge* The Badge component inherits the flet.Container.

The component offers predefined colors: BadgeColors.

  • success: BadgeColors.SUCCESS (default)
  • warning: BadgeColors.WARNING
  • error: BadgeColors.ERROR

or you can define custom colors in the colors param

===== params

  • colors: dict | BadgeColors = the dict must be in the form: {"bgcolor": "#xxxxxx", "color": "#xxxxxx"}
  • badge_text: str = text inside the badge
  • icon: ft.icons = icon on the right of the text

===== methods

  • on_click: fires when the badge is clicked (check the TagsInput code to see an example)

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    ft.Row([
        Badge(
            badge_text="Success",
            colors=BadgeColors.WARNING,
            icon=ft.icons.CLOSE,
            on_click=lambda e: print("cliked"),
        ),
        Badge(
            badge_text="Warning",
            colors=BadgeColors.SUCCESS,
            icon=ft.icons.CLOSE,
            on_click=lambda e: print("cliked"),
        ),
        Badge(
            badge_text="Error",
            colors=BadgeColors.ERROR,
            icon=ft.icons.CLOSE,
            on_click=lambda e: print("cliked"),
        )
    ])
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/830ca341-717e-4ece-b155-ff5255dee48d[alt="not bad.",width=400]

=== fletmint.*CheckBox* The CheckBox component inherits the flet.Container.

===== params

  • disabled: bool = checkbox is disabled
  • label: str = text of the right of the checkbox
  • checked: bool = checkbox starts checked
  • size: int = checkbox size
  • font_size: int = set the label font size
  • theme: str | ThemeMode = programall set the theme

===== methods

  • on_click: fires when the checkbox is clicked

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    ft.Column(
        [
            CheckBox(
                disabled=False, label="Label", checked=False, on_click=lambda e: print(e)
            ),
            CheckBox(
                disabled=False, label="Label", checked=True, on_click=lambda e: print(e)
            ),
            CheckBox(
                disabled=True, label="Label", checked=False, on_click=lambda e: print(e)
            ),
        ]
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/0c785d26-5d26-443a-8545-9504d0c0c77a[alt="not bad.",height=250]

=== fletmint.*Radio* The Radio component inherits the flet.Radio.

===== params

  • value: str = value of the radio checkbox
  • label: str = text of the right of the radio

===== methods

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    ft.RadioGroup(
        content=ft.Column(
            [
                Radio(
                    value="red",
                    label="Label",
                ),
                Radio(
                    value="blue",
                    label="Label",
                ),
                Radio(
                    value="green",
                    label="Label",
                ),
            ]
        )
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/d1406e2f-2802-4df6-b7e1-74c4e30bcb2e[alt="not bad.",height=250]

=== fletmint.*ToggleSwitch* The ToggleSwitch component inherits the flet.Container.

===== params

===== methods

  • on_switch: fires when the switch is clicked

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    ToggleSwitch(on_switch=change_theme)
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/cb5f9053-e906-48f2-ae1d-e42c4fe6a9b5[alt="not bad.",height=150]

=== fletmint.*Slider* The Slider component inherits the flet.Slider.

===== params

  • theme_mode: page.theme_mode

===== methods

  • on_switch: fires when the switch is clicked

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    Slider(theme_mode=page.theme_mode)
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/577be873-066a-40ba-9f4b-beafd996be40[alt="not bad.",width=250]

=== fletmint.*Toggle* The Slider component inherits the flet.Slider.

===== params

  • label: page.theme_mode
  • value: bool = default value
  • theme: ThemeMode

===== methods

  • on_change: fires when the toggle is clicked

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    ft.Column(
        [
            Toggle(label="Light", value=False, on_change=lambda e: print(e)),
            Toggle(label="Dark", on_change=lambda e: print(e)),
        ]
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/d71fcec6-7a05-48c7-a0ca-df7176b7d49d[alt="not bad.",width=250]

=== fletmint.*UserProfile* The UserProfile component inherits the flet.Container.

The component offers predefined profile statuses: ProfileStatus.

  • private: ProfileStatus.PRIVATE (default)
  • public: ProfileStatus.OPEN

===== params

  • username: str = username shown in the profile
  • avatar_foreground_img: str = profile photo, local or url
  • status: ProfileStatus

===== methods

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    UserProfile(
        username="Edoardo B.",
        avatar_foreground_img="https://fiverr-res.cloudinary.com/image/upload/t_profile_original,q_auto,f_auto/v1/attachments/profile/photo/e6ee5c5f29487a42edba6bd2914fee74-1707225777335/002e6712-84fc-4d83-9b26-e5fd2f26739a.jpg",
        status=ProfileStatus.PRIVATE,
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/2accab4d-5faf-4952-9bde-72a5bf34bdb7[alt="not bad.",width=250]

=== fletmint.*Carousel* The Carousel component inherits the flet.UserControl.

===== params

  • images_list: list[tuple] = list of images with their descriptions
  • animations: list = animations, IN and OUT
  • compact: bool = determine the type of the image carousel
  • descriptive: bool = show descriptions of the images
  • transform_factor: float = image carousel scale factor (to resize it)

===== methods

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    Carousel(
        images_list=[
            (
                "https://images.unsplash.com/photo-1714891203404-b25f32706e0a?q=80&w=2370&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
                "image description 1",
            ),
            (
                "https://images.unsplash.com/photo-1714837291207-4985c06c9a60?q=80&w=2371&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
                "image description 2",
            ),
            (
                "https://images.unsplash.com/photo-1715109429876-e00fbe6c4ae3?q=80&w=2370&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
                "image description 3",
            ),
            (
                "https://plus.unsplash.com/premium_photo-1714115035000-023149febb01?q=80&w=2370&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
                "image description 4",
            ),
            (
                "https://images.unsplash.com/photo-1714836992953-b8f7b4dc8afc?q=80&w=2371&auto=format&fit=crop&ixlib=rb-4.0.3&ixid=M3wxMjA3fDB8MHxwaG90by1wYWdlfHx8fGVufDB8fHx8fA%3D%3D",
                "image description 5",
            ),
        ],
        animations=[ft.AnimationCurve.EASE_IN, ft.AnimationCurve.EASE_IN_OUT_CUBIC_EMPHASIZED],
        compact=False,
        descriptive=False,
        transform_factor=0.5,
    )
)

ft.app(target=main)

|================== |compact=False|is_dropdown=True |image:https://github.com/Bbalduzz/fletmint/assets/81587335/9f533344-d638-4c0d-8cc4-599d876d14c9[alt="not bad.",width=450] | image:https://github.com/Bbalduzz/fletmint/assets/81587335/eb15e370-b8f0-40f3-b168-bfe0bd77b1fd[alt="not bad.",width=400] |==================

=== fletmint.*AudioPlayer* The AudioPlayer component inherits the flet.Container.

===== params

  • url: str = audio source

===== methods

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    audio_player := AudioPlayer(
        url="https://github.com/mdn/webaudio-examples/blob/main/audio-analyser/viper.mp3?raw=true"
    )
)
page.overlay.append(audio_player.audio)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/554d94f6-1702-402c-9994-ea7bd8256a70[alt="not bad.",width=450]

=== fletmint.*VideoPlayer* The VideoPlayer component inherits the flet.Container.

===== params

  • playlist: list[ft.VideoMedia] = set VideoPlayer video sources
  • player_title: str = player title

===== methods

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK page.bgcolor = "#22242a"

page.add(
    VideoPlayer(
        playlist=[
            ft.VideoMedia(
                "https://user-images.githubusercontent.com/28951144/229373720-14d69157-1a56-4a78-a2f4-d7a134d7c3e9.mp4"
            ),
            ft.VideoMedia(
                "https://user-images.githubusercontent.com/28951144/229373718-86ce5e1d-d195-45d5-baa6-ef94041d0b90.mp4"
            ),
            ft.VideoMedia(
                "https://user-images.githubusercontent.com/28951144/229373716-76da0a4e-225a-44e4-9ee7-3e9006dbc3e3.mp4"
            ),
        ],
        player_title="Demo video by Bbalduzz",
    )
)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/d6dedf70-d79f-45a0-9141-b5f961f0ff4a[alt="not bad.",width=450]

=== fletmint.*Code* The Code component inherits the flet.UserControl.

The component offers predefined code editor themes: CodeTheme. As of now it's supported:

  • Ayu:
    • dark mode: CodeTheme.AYU_DARK
    • light mode: CodeTheme.AYU_LIGHT
  • Github:
    • dark mode: CodeTheme.GITHUB_DARK (default)
  • One Dark Pro:
    • dark mode: CodeTheme.ONE_DARK_PRO

===== params

  • language: str = set the code editor language's syntax rules
  • code: str = code to show
  • font: str = editor's font (ttf), can be online url, local path or page font
  • theme: CodeTheme = editor's theme
  • read_only: bool = enables edit mode (default: False)
  • height: int = editor's height

===== methods

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.fonts = { "JetBrainsMono": "C:\path\to\font\JetBrainsMono-Regular.ttf", "SourceCodePro": "/path/to/font/SourceCodePro.ttf", } page.theme_mode = ft.ThemeMode.DARK code_editor = Code( # code=initial_code, language="python", font="https://github.com/JetBrains/JetBrainsMono/raw/master/fonts/ttf/JetBrainsMono-Regular.ttf'", height=800, theme=CodeTheme.ONE_DARK_PRO, read_only=False, ) page.add(code_editor)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/a56a0ee0-f0c1-4d74-bb0a-baa1a5bbebe4[alt="not bad.",width=450]

=== fletmint.*ColorPicker* The Picker component inherits the flet.UserControl.

===== params

  • color: str = start color picker's color
  • width: int = color picker width
  • height: int = color picker height

===== methods

  • on_color_select: def = fires when the color is selected

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.theme_mode = ft.ThemeMode.DARK color_picker = ColorPicker( color="#00ff00", on_color_select=lambda value: print("selected color:", value) ) page.add(color_picker)

ft.app(target=main)

image:https://github.com/Bbalduzz/fletmint/assets/81587335/56d27a74-0511-415c-a311-c769c5f96f90[alt="not bad.",width=450]

=== fletmint.*Toaster* The component shows in the page's overlay the fletmint.*Toast*

===== params

  • page: ft.Page = pass the flet page (mandatory)
  • expand: bool = decide if the toaster should be expanded by default
  • position: ToastPosition = set the toaster position
    • ToastPosition.TOP_LEFT
    • ToastPosition.TOP_RIGHT
    • ToastPosition.BOTTOM_LEFT
    • ToastPosition.BOTTOM_RIGHT

===== methods

  • show_toast:
    • message: str,
    • text: str,
    • description: str,
    • toast: fletmint.Toast,
    • duration: int,
    • toast_type: fletmint.ToastType | str = check the fletmint.Toast documentation
  • show_promise_toast:
    • function: def,
    • success_message: str,
    • error_message: str,
    • descriptive: bool = this shows the function's output as the toast's desctiption
  • remove_toast:
    • toast: fletmint.Toast,

example: [source,python]

import flet as ft from fletmint import *

def main(page: ft.Page): page.fonts = { "JetBrainsMono": "C:\path\to\font\JetBrainsMono-Regular.ttf", "SourceCodePro": "/path/to/font/SourceCodePro.ttf", } page.theme_mode = ft.ThemeMode.DARK toast_manager = Toaster(page, expand=False, position=ToastPosition.TOP_RIGHT)

def show_action(e):
    toast = Toast(
        content=ft.Row(
            [
                ft.Row(
                    [
                        ft.Text("This is an custom action"),
                    ]
                ),
                ft.TextButton(
                    content=ft.Text(
                        "close",
                        style=ft.TextStyle(
                            size=13,
                            weight=ft.FontWeight.W_200,
                        ),
                    ),
                    style=ft.ButtonStyle(
                        shape=ft.ContinuousRectangleBorder(radius=8),
                        color=ft.colors.WHITE,
                        bgcolor=ft.colors.BLACK,
                    ),
                    on_click=lambda e: toast_manager.remove_toast(toast),
                ),
            ],
            alignment=ft.MainAxisAlignment.SPACE_BETWEEN,
        )
    )
    toast_manager.show_toast(toast=toast)

def show_promise(e):
    def long_running_task():
        import time

        time.sleep(5)  # long-running task
        # raise Exception("Something went wrong")
        return "long running task output"

    toast_manager.show_promise_toast(
        long_running_task,
        success_message="Task Completed Successfully",
        error_message="Task Failed",
        descriptive=True,  # shows the function's output as the toast's desctiption
    )

toast_showcase = ft.Column([
    SecondaryButton(
        label="Action",
        on_click=show_action,
    ),
    SecondaryButton(
        label="Info",
        on_click=lambda e: toast_manager.show_toast(
            toast_type=ToastType.INFO,
            text="This is a info message",
        ),
    ),
    SecondaryButton(
        label="Success",
        on_click=lambda e: toast_manager.show_toast(
            toast_type=ToastType.SUCCESS,
            text="This is a success message",
        ),
    ),
    SecondaryButton(
        label="Warning",
        on_click=lambda e: toast_manager.show_toast(
            toast_type=ToastType.WARNING,
            text="This is a warning message",
        ),
    ),
    SecondaryButton(
        label="Error",
        on_click=lambda e: toast_manager.show_toast(
            toast_type=ToastType.ERROR,
            text="This is a error message",
        ),
    ),
    SecondaryButton(
        label="Promise",
        on_click=show_promise,
    ),
    ft.TextButton(
        content=ft.Text(
            "Remove latest toast",
            color="#e57373",
            size=13,
            weight=ft.FontWeight.W_200,
        ),
        style=ft.ButtonStyle(
            shape=ft.ContinuousRectangleBorder(radius=10),
            side=ft.BorderSide(color="#5a3b3b", width=1),
            bgcolor="#2a1c1c",
            color={
                ft.MaterialState.HOVERED: "#211717",
                ft.MaterialState.FOCUSED: "#211717",
                ft.MaterialState.DEFAULT: "#211717",
            },
        ),
        on_click=lambda e: toast_manager.remove_toast(
            toast_manager.toasts[0]
        ),
    ),
])
page.add(toast_showcase)

ft.app(target=main)

https://github.com/Bbalduzz/fletmint/assets/81587335/ecc94756-1830-46ff-b15d-798d0669e50d[title="Toast"]

=== fletmint.*Toast* The Toast component inherits the flet.Container.

===== params

  • content: Any = the toast content, can be anything. If this is set you cannot set the text and description
  • text: str = the toast title
  • description: str = the toast description
  • toast_type: ToastType = the toast type. This defines colors and icons
    • ToastType.DEFAULT
    • ToastType.INFO
    • ToastType.SUCCESS
    • ToastType.WARNING
    • ToastType.ERROR
    • ToastType.PROMISE

===== methods

any method that may be defined in the content (see example)

example: [source,python]

this creates a custom action toast

toast = Toast( content=ft.Row( [ ft.Row( [ ft.Text("This is an custom action"), ] ), ft.TextButton( content=ft.Text( "close", style=ft.TextStyle( size=13, weight=ft.FontWeight.W_200, ), ), style=ft.ButtonStyle( shape=ft.ContinuousRectangleBorder(radius=8), color=ft.colors.WHITE, bgcolor=ft.colors.BLACK, ), on_click=lambda e: toast_manager.remove_toast(toast), ), ], alignment=ft.MainAxisAlignment.SPACE_BETWEEN, ) )

image:https://github.com/Bbalduzz/fletmint/assets/81587335/b173b756-a336-4905-bcf4-4306e73d10bb[title="Toasts",width=450]

== Utils

=== fletmint.utils.*change_app_icon* This utility let the user chnage the app icon on runtime. This utility works on windows, macos, linux, each os laverage its unique methods.

NOTE: When building the app, use the --icon flag to set the icon in the build.

===== params

  • icon_path: str | Path = path of your custom icon. This can be png, jpeg, ico, bpm, icns (any)
  • app_name: Optional[str] = (macos only)
  • app_path: Optional[str] = (macos only)

example: [source,python]

import os import flet as ft from fletmint.utils import change_app_icon

icon_path = os.path.join("icons", "my_custom_icon.png")

def main(page: ft.Page): page.window_width, page.window_height = 400, 400 page.title = "Flet App with Custom Icon" page.vertical_alignment = ft.MainAxisAlignment.CENTER page.horizontal_alignment = ft.CrossAxisAlignment.CENTER

page.add(
    ft.Image(src=icon_path, width=64, height=64),
    ft.Text("Hello, this is a Flet app with a custom icon!"),
)

change_app_icon(icon_path=icon_path)

ft.app(target=main)

|================== |macos|windows | linux |image:https://github.com/Bbalduzz/fletmint/assets/81587335/cced79a2-256c-405d-a8ce-55be728aecc9[alt="not bad.",width=400] | image:https://github.com/Bbalduzz/fletmint/assets/81587335/fee9d862-1338-4543-b224-515f008b43b7[alt="not bad.",height=300] | not tested |==================

= Support Maintaining and updating this kit, along with adding new components, is a time-consuming and often challenging process. However, I believe it's important to make this resource available to everyone because it's the right thing to do. If you find value in this components library and would like to support its development, please consider contributing in any way you can.

Thank you for your support, even if it's just leaving a star on the project! Your encouragement means a lot.

link:https://www.patreon.com/edoardobalducci[ image:https://pbs.twimg.com/media/DC4gjLRUMAAyQ92.jpg[Donate, align="center", width=180]]

link:https://liberapay.com/balduzz/donate[image:https://liberapay.com/assets/widgets/donate.svg[Donate, align="center"]]

link:https://www.paypal.com/donate/?hosted_button_id=3C8G7V8DUWLQG[image:https://cwc-berkeley.org/wp-content/uploads/2017/11/btn-donation-paypal-2x-167.png[PayPal, align="center", width=150]]

link:https://ko-fi.com/C0C8T2OJ6[image:https://ko-fi.com/img/githubbutton_sm.svg[Ko-fi, align="center"]]