時間選擇器Time picker

時間選擇器為您提供一個標準化的方式,可以讓使用者利用觸控、滑鼠或鍵盤輸入來挑選時間值。The time picker gives you a standardized way to let users pick a time value using touch, mouse, or keyboard input.

時間選擇器的範例

取得 Windows UI 程式庫Get the Windows UI Library

WinUI 標誌

Windows UI 程式庫 2.2 或更新版本中有這個控制項使用圓角的新範本。Windows UI Library 2.2 or later includes a new template for this control that uses rounded corners. 如需詳細資訊,請參閱圓角半徑For more info, see Corner radius. WinUI 是 NuGet 套件,其中包含適用於 Windows 應用程式的新控制項和 UI 功能。WinUI is a NuGet package that contains new controls and UI features for Windows apps. 如需詳細資訊 (包括安裝指示),請參閱 Windows UI 程式庫For more info, including installation instructions, see Windows UI Library.

平台 APITimePicker 類別Time 屬性Platform APIs: TimePicker class, Time property

這是正確的控制項嗎?Is this the right control?

使用時間選擇器讓使用者挑選單一時間值。Use a time picker to let a user pick a single time value.

如需有關如何選擇正確控制項的詳細資訊,請參閱日期和時間控制項文章。For more info about choosing the right control, see the Date and time controls article.

範例Examples

XAML 控制項庫XAML Controls Gallery
XAML controls gallery

如果您已安裝 XAML 控制項庫應用程式,請按一下這裡開啟應用程式並查看 TimePicker 運作情形If you have the XAML Controls Gallery app installed, click here to open the app and see the TimePicker in action.

進入點會顯示所選的時間,當使用者選取進入點時,選擇器介面就會從中央垂直展開供使用者選取。The entry point displays the chosen time, and when the user selects the entry point, a picker surface expands vertically from the middle for the user to make a selection. 時間選擇器會重疊於其他 UI 上;其不會將其他 UI 移開。The time picker overlays other UI; it doesn't push other UI out of the way.

展開中的時間選擇器範例

建立時間選擇器Create a time picker

此範例說明如何建立含有標頭的簡易時間選擇器。This example shows how to create a simple time picker with a header.

<TimePicker x:Name="arrivalTimePicker" Header="Arrival time"/>
TimePicker arrivalTimePicker = new TimePicker();
arrivalTimePicker.Header = "Arrival time";

產生的時間選擇器外觀如下:The resulting time picker looks like this:

時間選擇器的範例

注意

如需日期及時間值的重要資訊,請參閱 DateTime 和 Calendar 值 (位於 <日期及時間控制項>文章中)。For important info about date and time values, see DateTime and Calendar values in the Date and time controls article.

取得範例程式碼Get the sample code