Skip to main content

TimePicker

A Material-style time picker dialog.

It is added to page.overlay and called using its pick_time() method.

Depending on the time_picker_entry_mode, it will show either a Dial or an Input (hour and minute text fields) for picking a time.

Examples

Live example

Basic time picker

import datetime
import flet as ft

def main(page: ft.Page):
def change_time(e):
print(f"Time picker changed, value (minute) is {time_picker.value.minute}")

def dismissed(e):
print(f"Time picker dismissed, value is {time_picker.value}")

time_picker = ft.TimePicker(
confirm_text="Confirm",
error_invalid_text="Time out of range",
help_text="Pick your time slot",
on_change=change_time,
on_dismiss=dismissed,
)

page.overlay.append(time_picker)

date_button = ft.ElevatedButton(
"Pick time",
icon=ft.icons.TIME_TO_LEAVE,
on_click=lambda _: time_picker.pick_time(),
)

page.add(date_button)


ft.app(target=main)

Properties

cancel_text

The text that is displayed on the cancel button. The default value is "Cancel".

confirm_text

The text that is displayed on the confirm button. The default value is "OK".

error_invalid_text

The error message displayed below the input text field if the input is not a valid hour/minute. The default value is "Enter a valid time".

hour_label_text

The text that is displayed below the hour input text field.

The default value is "Hour".

help_text

The text that is displayed at the top of the header.

This is used to indicate to the user what they are selecting a time for. The default value is "Enter time".

minute_label_text

The text that is displayed below the minute input text field.

The default value is "Minute".

orientation

The orientation of the dialog when displayed. Value is of type Orientation enum which has the following possible values: PORTRAIT and LANDSCAPE.

time_picker_entry_mode

The initial mode of time entry method for the time picker dialog.

Property value is TimePickerEntryMode enum with the following values:

  • DIAL (default)
  • INPUT
  • DIAL_ONLY
  • INPUT_ONLY

In DIAL mode, user picks time from a clock dial. Can switch to input by activating a mode button in the dialog.

In INPUT mode, user can input the time by typing it into text fields. Can switch to dial by activating a mode button in the dialog.

DIAL_ONLY and INPUT_ONLY are variants of the above that don't allow the user to change to the mode.

value

The selected time that the picker should display. The default value is equal to the current time.

Methods

pick_time()

Opens a time picker dialog.

Events

on_change

Fires when user clicks confirm button. value property is updated with selected time. e.data also contains the selected time.

on_dismiss

Fires when dialog is dismissed by clicking on the cancel button or outside of time picker dialog.

on_entry_mode_change

Fires when the time_picker_entry_mode is changed. The event handler (e) is of type TimePickerEntryModeChangeEvent and the new entry mode could be gotten from e.entry_mode (value of type TimePickerEntryMode enum).