Liri Fluid API

DateTimePicker QML Type

Control to select a both date and time. More...

Import Statement: import Fluid.Controls 1.1

Properties

Detailed Description

Stand-alone control to select both date and time.


  import QtQuick 2.10
  import Fluid.Controls 1.0 as FluidControls

  Item {
      width: 600
      height: 600

      FluidControls.DateTimePicker {
          anchors.centerIn: parent
          onSelectedDateTimeChanged: {
              console.log("You have selected:", selectedDateTime);
          }
      }
  }

For more information you can read the Material Design guidelines.

Property Documentation

background : Item

This property holds the background item.


dayOfWeekRowVisible : bool

This property determines the visibility of the day of week row.


This property holds the footer item.


from : date

This property holds the start date.


header : Item

This property holds the header item.


locale : Locale

This property holds the locale of the control.


mode : enumeration

This property holds the current selection mode.

It is changed by the user, clicking on the year or calendar.

Possible values:

ConstantDescription
DateTimePicker.YearThe user is selecting the year.
DateTimePicker.MonthThe user is selecting the month.
DateTimePicker.HourThe user is selecting the hour.
DateTimePicker.MinuteThe user is selecting the minute.
DateTimePicker.SecondThe user is selecting the second.

orientation : enumeration

This property holds the date picker orientation. The default value is automatically selected based on the device orientation.

Possible values:

ConstantDescription
DatePicker.LandscapeThe date picker is landscape.
DatePicker.PortraitThe date picker is portrait.

prefer24Hour : bool

This property determines the visibility of the AM/PM switch.


selectedDateTime : date

This property holds the date and time that has been selected by the user. The default value is the current date and time.


selector : Item

This property holds the selector item.


to : date

This property holds the end date.


weekNumberVisible : bool

This property determines the visibility of the week number column.