1

I'm trying to make a GUI with flet, i am displaying an image, a button and a text field in the interface, but when i pick a file with FilePickerResultEvent, my image disappear. I follow the example of FilePicker of flet. It happens if i select any type of file.

I have also tried this solution by adding an image, but i have the same problem.

I have also tried to get the path to a folder and then display an image that is in the folder, but it does not appear. Flet can only manage one file at a time or am I missing something?

This is the code:

import flet as ft

def main(page: ft.Page):

    def pickFilesResult(e: ft.FilePickerResultEvent):
        txt.value = "".join(map(lambda f: f.name, e.files)) if e.files else "cancelled!"
        txt.update()

    txt = ft.Text(value="...")

    pickFilesDialog = ft.FilePicker(on_result=pickFilesResult)
    page.overlay.append(pickFilesDialog)

    page.add(
        ft.Image(src="img/faceX.jpg",width=100, height=100),
        ft.IconButton(icon=ft.icons.SEARCH,on_click=lambda _: pickFilesDialog.pick_files()),
        txt
    )

if __name__ == "__main__":
    ft.app(target=main, )
jariasca
  • 33
  • 4

2 Answers2

2

I have found that it only works if you use the absolute path. It does not work using the relative path. Thus, the image does not disappear.

jariasca
  • 33
  • 4
1

You can specify assets_dir in flet.app() call to set the location of assets that should be available to the application. assets_dir could be a relative to your main.py directory or an absolute path. For example, consider the following program structure:

/assets
   /images/my-image.png
main.py

You can access your images in the application as following: import flet as ft

def main(page: ft.Page):
    page.add(ft.Image(src=f"/images/my-image.png"))

flet.app(
    target=main,
    assets_dir="assets"[enter link description here][1]
)
gremcha
  • 26
  • 1