Skip to content

CupertinoDatePicker

Examples#

Live example

Basic Example#

from datetime import datetime

import flet as ft


def main(page: ft.Page):
    page.horizontal_alignment = ft.CrossAxisAlignment.CENTER

    def handle_date_change(e: ft.Event[ft.CupertinoDatePicker]):
        message.value = f"Chosen Date: {e.control.value.strftime('%Y-%m-%d %H:%M %p')}"
        page.update()

    cupertino_date_picker = ft.CupertinoDatePicker(
        value=datetime.now(),
        date_picker_mode=ft.CupertinoDatePickerMode.DATE_AND_TIME,
        on_change=handle_date_change,
    )

    page.add(
        ft.CupertinoFilledButton(
            content="Open CupertinoDatePicker",
            on_click=lambda e: page.show_dialog(
                ft.CupertinoBottomSheet(
                    content=cupertino_date_picker,
                    height=216,
                    padding=ft.Padding.only(top=6),
                )
            ),
        ),
        message := ft.Text("Chosen Time: "),
    )


ft.run(main)

basic

CupertinoDatePicker #

Bases: LayoutControl

An iOS-styled date picker.

bgcolor #

bgcolor: ColorValue | None = None

The background color of this date picker.

date_order #

date_order: CupertinoDatePickerDateOrder | None = None

The order in which the columns inside this picker are displayed.

Note

The final order in which the columns are displayed is also influenced by the date_picker_mode. For example, if date_picker_mode is CupertinoDatePickerMode.MONTH_YEAR both CupertinoDatePickerDateOrder.DAY_MONTH_YEAR and CupertinoDatePickerDateOrder.MONTH_DAY_YEAR will result in the month|year order.

date_picker_mode #

date_picker_mode: CupertinoDatePickerMode = DATE_AND_TIME

The mode of the date picker.

first_date #

first_date: DateTimeValue | None = None

The earliest allowable date that the user can select.

  • If set to None (the default), there is no lower date limit.
  • When not None, one can still scroll the picker to dates earlier than first_date, with the exception that the on_change will not be called. Once let go, the picker will scroll back to first_date.
Note

In CupertinoDatePickerMode.TIME mode, a time becomes unselectable if the datetime produced by combining that particular time and the date part of value is earlier than last_date. So typically, first_date needs to be set to a datetime that is on the same date as value.

item_extent #

item_extent: Number = 32.0

The uniform height of all children.

last_date #

last_date: DateTimeValue | None = None

The latest allowable date that the user can select.

  • If set to None (the default), there is no upper date limit.
  • When not None, one can still scroll the picker to dates later than last_date, with the exception that the on_change will not be called. Once let go, the picker will scroll back to last_date.
Note

In CupertinoDatePickerMode.TIME mode, a time becomes unselectable if the datetime produced by combining that particular time and the date part of value is later than last_date. So typically, last_date needs to be set to a datetime that is on the same date as value.

maximum_year #

maximum_year: int | None = None

Maximum year to which the picker can be scrolled when in CupertinoDatePickerMode.DATE mode.

Defaults to None - no limit.

minimum_year #

minimum_year: int = 1

Minimum year to which the picker can be scrolled when in CupertinoDatePickerMode.DATE mode.

minute_interval #

minute_interval: int = 1

The granularity of the minutes spinner, if it is shown in the current date_picker_mode.

Note

Must be an integer factor of 60.

on_change #

on_change: (
    ControlEventHandler[CupertinoDatePicker] | None
) = None

Called when the selected date and/or time changes.

Will not be called if the new selected value is not valid, or is not in the range of first_date and last_date.

show_day_of_week #

show_day_of_week: bool = False

Whether to show day of week alongside day.

use_24h_format #

use_24h_format: bool = False

Whether to use the 24-hour time format.

If False, the 12-hour time format is used.

value #

value: DateTimeValue = field(default_factory=lambda: now())

The initial date and/or time of the picker.

It must conform to the intervals set in first_date, last_date, minimum_year, and maximum_year, else a ValueError will be raised.

Defaults to the present date and time.

before_update #

before_update()