Python Flet DropDown: selected option is not visible

I developed a simple app with a button using Python Flet (ver 0.21.2). Once the button is clicked, it adds to the page a row with a textfield and a dropdown control. Here is the full code:

import flet as ft

def main(page: ft.Page):    
    def show_dd_on_click(e):
        page_content.controls.append(
            ft.Row(
                    [
                        ft.TextField(label="Field Name", expand=True, height=40,border_color = ft.colors.BLUE_500, tooltip="Name of the column"),
                        ft.Dropdown(
                            border_color = ft.colors.BLUE_500,
                            width= 150,
                            height=40,
                            label="Data Type",
                            tooltip="Data type of the column",
                            options=[
                                ft.dropdown.Option("Option_1"),
                                ft.dropdown.Option("Option_2"),
                                ft.dropdown.Option("Option_3"),
                                ft.dropdown.Option("Option_4"),
                                ft.dropdown.Option("Option_5"),
                            ],
                        ),
                    ],
                ),
        )
        page.update()


    page.theme = ft.Theme(color_scheme_seed=ft.colors.BLUE)
    page.theme_mode = ft.ThemeMode.LIGHT
    page_content= ft.Column([], horizontal_alignment=ft.CrossAxisAlignment.CENTER)
    page.add(
        ft.Column(
            [
                ft.ElevatedButton("Show DD", on_click=show_dd_on_click),
                page_content,
            ],
            horizontal_alignment=ft.CrossAxisAlignment.CENTER,
        )        
    )

ft.app(target=main, assets_dir="\assets")

Unexpectedly, once the user selects a dropdown option,

the selected value is not visible. I guess it depends on the theming / color scheme set. I tried modifying the dropdown attributes values, but nothing changed. How can I make the option visible without changing the theme and the current color scheme?

Solution

The selected option was not visible because the default padding in the dropdown was large enough that it was not visible with the dropdown height you specified.

I added content_padding=8 in Dropdown control and the selected option became visible. If the padding feels too cramped, increase the height of the dropdown. The visibility of selected option has nothing to do with your theme.

Full code:

import flet as ft

def main(page: ft.Page):    
    def show_dd_on_click(e):
        page_content.controls.append(
            ft.Row(
                    [
                        ft.TextField(label="Field Name", expand=True, height=40,border_color = ft.colors.BLUE_500, tooltip="Name of the column"),
                        ft.Dropdown(
                            border_color = ft.colors.BLUE_500,
                            content_padding=8,
                            width= 150,
                            height=40,
                            label="Data Type",
                            tooltip="Data type of the column",
                            options=[
                                ft.dropdown.Option("Option_1"),
                                ft.dropdown.Option("Option_2"),
                                ft.dropdown.Option("Option_3"),
                                ft.dropdown.Option("Option_4"),
                                ft.dropdown.Option("Option_5"),
                            ],
                        ),
                    ],
                ),
        )
        page.update()


    page.theme = ft.Theme(color_scheme_seed=ft.colors.BLUE)
    page.theme_mode = ft.ThemeMode.LIGHT
    page_content= ft.Column([], horizontal_alignment=ft.CrossAxisAlignment.CENTER)
    page.add(
        ft.Column(
            [
                ft.ElevatedButton("Show DD", on_click=show_dd_on_click),
                page_content,
            ],
            horizontal_alignment=ft.CrossAxisAlignment.CENTER,
        )        
    )

ft.app(target=main, assets_dir="\assets")