flet-dev / flet-contrib

Flet controls written in Python by community
Apache License 2.0
37 stars 9 forks source link

```page.update()``` doesn't work when I operate the color picker multiple times #20

Open calocenrieti opened 1 month ago

calocenrieti commented 1 month ago

problem

page.update() doesn't work when I operate the color picker multiple times

When you operate the color picker only once, the start and stop buttons on the page will work correctly thanks to page.update(). If you operate the color picker multiple times, page.update() will no longer be performed and the page will become inoperable.

code

from flet_contrib.color_picker import ColorPicker
import flet as ft

def main(page: ft.Page):

    def color_picker_example():

        async def open_color_picker(e):
            e.control.page.dialog = d
            d.open = True
            await e.control.page.update_async()

        color_picker = ColorPicker(color="#c8df6f", width=300)
        color_icon = ft.IconButton(icon=ft.icons.BRUSH, on_click=open_color_picker)

        async def change_color(e):
            color_icon.icon_color = color_picker.color
            d.open = False
            await e.control.page.update_async()

        async def close_dialog(e):
            d.open = False
            await d.update_async()

        d = ft.AlertDialog(
            content=color_picker,
            actions=[
                ft.TextButton("OK", on_click=change_color),
                ft.TextButton("Cancel", on_click=close_dialog),
            ],
            actions_alignment=ft.MainAxisAlignment.END,
            on_dismiss=change_color,
        )

        return color_icon

    def loop_func():
        while True:
            if start_button.disabled==False:
                break

    def snack_bar_message(mes):
        page.snack_bar = ft.SnackBar(ft.Text(mes))
        page.snack_bar.open = True
        page.snack_bar.update

    def start_clicked(e):
        example1.disabled=True
        example2.disabled=True
        example3.disabled=True
        stop_button.disabled=False
        start_button.disabled=True
        snack_bar_message('start')
        page.update()
        loop_func()

    def stop_clicked(e):
        example1.disabled=False
        example2.disabled=False
        example3.disabled=False
        start_button.disabled=False
        stop_button.disabled=True
        snack_bar_message('stop')
        page.update()

    example1=color_picker_example()
    example2=color_picker_example()
    example3=color_picker_example()

    page.snack_bar = ft.SnackBar(
        content=ft.Text("Hello, world!"),
        action="Alright!",
    )

    start_button=ft.ElevatedButton(
                    "Start",
                    icon=ft.icons.AUTO_FIX_HIGH,
                    icon_color=ft.colors.BLUE,
                    on_click=start_clicked,
                    disabled=False,
                    )

    stop_button=ft.ElevatedButton(
                    "STOP",
                    icon=ft.icons.STOP,
                    icon_color='',
                    on_click=stop_clicked,
                    disabled=True,
                    )

    page.add(
        ft.Row(controls=
            [
                ft.Text("sample", theme_style=ft.TextThemeStyle.BODY_LARGE),
            ]
            ),
        ft.Row(controls=[
                example1,
                example2,
                example3
                ]
            ),
        ft.Row(controls=
            [
                start_button,
                stop_button,
                ]
            ),
        ),
ft.app(target=main)

OS、Flet ver.

OS:Windows11 python:3.11 Flet version:0.24.1

video

https://youtu.be/6f7rsU12avU

remarks

Maybe it's related to issue #3571. https://github.com/flet-dev/flet/issues/3571

ndonkoHenri commented 1 month ago

Please describe the steps (in text form) to perform inorder to reproduce the issue?

calocenrieti commented 1 month ago
  1. Click the three brush icons to select a color.
  2. Press the Start button (to enter the loop).
  3. Press the Stop button (to exit the loop).
  4. Click the three brush icons to select a color again.
  5. Press the Start button (to enter the loop).
  6. Once the loop is entered, the screen drawing will no longer be updated.
calocenrieti commented 1 month ago

Sorry. I wasn't clear enough, so let me add something. When you press the stop button, the loop stops, but the UI's page.update() doesn't work, and start and colorpicker, which are disabled, cannot be executed.

calocenrieti commented 1 month ago

The same behavior occurred in the gallery. I have taken a video, so please refer to it. https://youtu.be/8D76MMu9-DY

Windows11 Google Chrome