`DropdownMenu` Control

[ndonkoHenri]

Closes https://github.com/flet-dev/flet/issues/1088

Test Code

import flet as ft


def main(page: ft.Page):
    def handle_menu_change(e):
        t.value = f"Selected color: {menu.value}"
        page.update()

    t = ft.Text("Dropdown Menu Example")
    menu = ft.DropdownMenu(
        label="Color",
        expand=True,
        expand_loose=True,
        hint_text="Hint text",
        helper_text="Pick a color",
        # width=300,
        enable_filter=True,
        enable_search=True,
        request_focus_on_tap=False,
        hint_fade_duration=ft.Duration(seconds=500),
        capitalization=ft.TextCapitalization.WORDS,
        prefix=ft.Icon(ft.icons.COLOR_LENS),
        prefix_icon=ft.cupertino_icons.SEARCH,
        suffix=ft.Icon(ft.icons.PIN_END),
        icon_color=ft.colors.RED,
        active_indicator_border_side=ft.BorderSide(color=ft.colors.RED, width=2),
        on_change=handle_menu_change,
        options=[
            ft.DropdownMenuOption(
                key="red",
                content=ft.Text("Red"),
                prefix=ft.Icon(ft.icons.COLOR_LENS, color=ft.colors.RED),
            ),
            ft.DropdownMenuOption(
                key="green",
                content=ft.Text("Green"),
                prefix=ft.Icon(ft.icons.COLOR_LENS, color=ft.colors.GREEN),
            ),
            ft.DropdownMenuOption(
                key="blue",
                content=ft.Text("Blue"),
                prefix=ft.Icon(ft.icons.COLOR_LENS, color=ft.colors.BLUE),
            ),
        ],
    )
    page.add(t, menu)


ft.app(target=main)

Summary by Sourcery

This pull request introduces a new DropdownMenu control with extensive customization options and enhances the FormFieldControl to support additional properties for better form field customization. It also includes a bug fix for a typo in the AnimationCurve enum.

• New Features:
  • Introduced a new DropdownMenu control with various customization options including prefix, suffix, helper, and error controls, as well as icon colors and text styles.
• Bug Fixes:
  • Fixed a typo in AnimationCurve enum from FAST_OUT_SLOWIN to FAST_OUT_SLOW_IN.
• Enhancements:
  • Enhanced FormFieldControl to support additional properties such as icon_color, prefix_icon_color, suffix_icon_color, focus_color, align_label_with_hint, floating_label_text_style, active_indicator_border_side, hint_fade_duration, error_max_lines, helper_max_lines, and hint_max_lines.
  • Updated InputDecoration and InputDecorationTheme to include new properties for better customization of form fields.
  • Refactored Dropdown, TextField, and DropdownMenu controls to utilize the new properties and enhancements in FormFieldControl.

[sourcery-ai[bot]]

Reviewer's Guide by Sourcery

This pull request introduces a new DropdownMenu control with extensive customization options and event handling capabilities. It also enhances the FormFieldControl class with additional properties for better input decoration customization and refactors existing code to improve theming consistency. Key changes include the addition of new properties to FormFieldControl, TextField, and Dropdown, the refactoring of buildInputDecoration to use a common theme variable, and the introduction of a new Duration class to handle time-related properties.

File-Level Changes

Files	Changes
sdk/python/packages/flet-core/src/flet_core/form_field_control.py sdk/python/packages/flet-core/src/flet_core/textfield.py sdk/python/packages/flet-core/src/flet_core/dropdown.py	Enhanced input decoration customization by adding new properties and refactoring constructors.
packages/flet/lib/src/utils/form_field.dart packages/flet/lib/src/controls/dropdown.dart packages/flet/lib/src/controls/textfield.dart	Refactored buildInputDecoration to include new properties and use a common theme variable.
sdk/python/packages/flet-core/src/flet_core/dropdown_menu.py packages/flet/lib/src/controls/dropdown_menu.dart	Introduced and implemented new DropdownMenu control with extensive customization options.

---

Tips

• Trigger a new Sourcery review by commenting @sourcery-ai review on the pull request.
• Continue your discussion with Sourcery by replying directly to review comments.
• You can change your review settings at any time by accessing your dashboard:
  • Enable or disable the Sourcery-generated pull request summary or reviewer's guide;
  • Change the review language;
• You can always contact us if you have any questions or feedback.

[FeodorFitsner]

Could you resolve a conflict in this PR please?

[FeodorFitsner]

I've tried the new control and observed the strange behavior - it triggers changed event on the second click. Here's the video:

https://github.com/user-attachments/assets/0970aadc-7d25-4dd0-9042-0ac54243feac

Do you have the same issue? I built macOS client with Flutter 3.24.0.

[FeodorFitsner]

Merging gone wrong?

[ndonkoHenri]

Implemented in #4885