FilePicker

import {ClassMembers, ClassSummary, CodeExample, Image} from '@site/src/components/crocodocs';

Usage

Create an instance of FilePicker:

import flet as ft

file_picker = ft.FilePicker()

To open the file picker dialog call one of these three methods: pick_files(), save_file() or get_directory_path(), depending on the use case.

In most cases you can use a lambda function for that:

ft.Button(
    content="Pick files,
    on_click=lambda _: file_picker.pick_files(allow_multiple=True)
)

Uploading files

To upload one or more files, call FilePicker.pick_files() to let the user select files, then pass the returned list to FilePicker.upload() to perform the upload.

:::note[Separate uploads per user] If you need to separate uploads for each user you can specify a filename prepended with any number of directories in page.get_upload_url() call, for example:

upload_url = page.get_upload_url(f"/{username}/pictures/{f.name}", 600)

/{username}/pictures directories will be automatically created inside upload_dir if non-existent. :::

Upload storage

Notice the usage of page.get_upload_url() method – it generates a presigned upload URL for Flet's internal upload storage.

:::note[Use any storage for file uploads] You can generate presigned upload URL for AWS S3 storage using boto3 library.

The same technique should work for Wasabi, Backblaze, MinIO and any other storage providers with S3-compatible API. :::

To enable Flet saving uploaded files to a directory provide a full or relative path to that directory in flet.run() call:

ft.run(main, upload_dir="uploads")

You can even put uploads inside assets directory, so uploaded files, e.g. pictures, docs, or other media, can be accessed from a Flet client right away:

ft.run(main, assets_dir="assets", upload_dir="assets/uploads")

and in your app you can display the uploaded picture with:

ft.Image(src="/uploads/<some-uploaded-picture.png>")

Examples

Live example

Pick, save, and get directory paths

<CodeExample path={frontMatter.examples + '/pick_save_and_get_directory_path/main.py'} language="python" />

<Image src={frontMatter.example_images + '/pick_save_and_get_directory_path.png'} width="55%" />

Pick and upload files

The following example demonstrates multi-file pick and upload app.

<CodeExample path={frontMatter.examples + '/pick_and_upload/main.py'} language="python" />

<Image src={frontMatter.example_images + '/pick_and_upload.png'} width="55%" />

Pick text content and save/download it

Use pick_files() with with_data=True when you need file contents directly, such as in web apps where FilePickerFile.path is not available.

<CodeExample path={frontMatter.examples + '/pick_and_save_text_content/main.py'} language="python" />