.NET MAUI TimeSpanPicker Modes

The TimeSpanPicker for .NET MAUI exposes PickerMode property of Telerik.Maui.Controls.PickerMode type which can be set to one of the following values:

• Popup—Shows the UI for picking a date inside a popup. It's the default value for mobile (Android and iOS);
• DropDown—Opens the UI for picking a date inside a dropdown. It's the default value for Desktop (Windows, macOS);

Here is a sample of PickerMode set to Popup:

<telerik:RadTimeSpanPicker Time="5:10:30:00"
                                PickerMode="Popup"/>

Check below the result on mobile and desktop:

Quick example of PickerMode set to DropDown:

<telerik:RadTimeSpanPicker Time="5:10:30:00"
                                PickerMode="DropDown"/>

Check the result of DropDown mode on mobile and desktop:

Toggle Button

In addition, TimeSpanPicker exposes IsToggleButtonVisible property which when set to True renders an "arrow" button for opening the UI for picking a time. By default, IsToggleButtonVisible is enabled for Desktop together with the DropDown picker mode, and is disabled for mobile platforms. You can explicitly apply it in both cases:

<telerik:RadTimeSpanPicker Time="5:10:30:00"
                                PickerMode="DropDown"
                                IsToggleButtonVisible="True" />

See Also

• Templates
• Styling
• Commands
• Selection