[Question] how do i manage the dropdown value overflow

[Alejandrotr22]

Question

Hi
I have been working with the dropdown component, and I have noticed that if the text of an option is larger than the component itself, the text of the selected value protrudes from the component. Is there any way to make the value of the dropdown behave similarly to truncation or warp?

here`s an example of what i mean:

Code sample

import flet as ft

def main(page: ft.Page):
    options = [ft.dropdown.Option("Option 1"), ft.dropdown.Option("Option 2"), ft.dropdown.Option("Option 3 with a very long text that should wrap")]
    dropdown = ft.Dropdown(options=options,width=100,value=options)
    page.add(
        ft.Column([dropdown])
    )

ft.app(target=main)

Error message

No response

------------------------------------------------------

• I have searched for answers to my question both in the issues and in previous discussions.

[plugeit]

import flet as ft
#you can write a program to choose longest text in your dropdown list by comparing there tex len and then multiply the length of the longest text with 8.5 and you will not see textoverflow
def main(page: ft.Page):
options = [ft.dropdown.Option("Option 1"), ft.dropdown.Option("Option 2"), ft.dropdown.Option("Option 3 with a very long text that should wrap")]
dropdown = ft.Dropdown(options=options,width=len("Option 3 with a very long text that should wrap")*8.5,value=options, border_radius=30)
page.add(
ft.Column([dropdown, ])
)

ft.app(target=main)

[Alejandrotr22]

That's a interesting option but I need the text to adapt to the width of the dropdown, not the dropdown to the text.
thanks for your answer

I was thinking about creating my own dropdown component but i don't know how dropdown works, to add an resize event, and check if the text length is larger than de dropdown with to "cut" the text to something like this: " option 3 with a very lo..."

[plugeit]

but it will not look good since you will not be able to see full text the solution which i provided is fast and quick making own component will take time you can do as you wish btw if you got the answer mark it as answer it motivates

[plugeit]

btw you didn't specify that you need the text to adapt to the width of the dropdown