重新想象 Windows 8.1 Store Apps (73) - 新增控件: DatePicker, TimePicker
作者:webabcd
介绍
重新想象 Windows 8.1 Store Apps 之新增控件
- DatePicker - 日期选择控件
- TimePicker - 时间选择控件
示例
1、演示 DatePicker 的应用
DatePickerDemo.xaml
<Page x:Class="Windows81.Controls.DatePickerDemo" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Windows81.Controls" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Background="Transparent"> <StackPanel Margin="120 0 0 0"> <TextBlock Name="lblMsg" FontSize="14.667" /> <!-- DatePicker - 日期选择控件(默认横排,需要竖排的话则设置 Orientation="Vertical" 即可) Header - 控件的标题 DateChanged - 选中的日期发生变化时所触发的事件 --> <DatePicker x:Name="datePicker" Header="Date" DateChanged="datePicker_DateChanged" Margin="0 20 0 0" /> <!-- 通过格式模板(format templates)设置 DatePicker 的显示格式 --> <DatePicker DayFormat="day" MonthFormat="month.numeric" YearFormat="year.abbreviated" Margin="0 20 0 0" /> <!-- 通过格式模式(format patterns)设置 DatePicker 的显示格式 --> <DatePicker DayFormat="{}{day.integer}({dayofweek.abbreviated})" MonthFormat="{}{month.integer(2)}" YearFormat="{}{year.full}" Margin="0 20 0 0" /> <DatePicker DayFormat="{}{day.integer}日 ({dayofweek.abbreviated})" MonthFormat="{}{month.integer(2)}月" YearFormat="{}{year.full}年" Margin="0 20 0 0" /> <!-- 关于 format templates 和 format patterns 请参见: http://msdn.microsoft.com/en-us/library/windows/apps/windows.globalization.datetimeformatting.datetimeformatter.aspx --> </StackPanel> </Grid> </Page>
DatePickerDemo.xaml.cs
/* * DatePicker - 日期选择控件 */ using System; using Windows.Globalization; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; namespace Windows81.Controls { public sealed partial class DatePickerDemo : Page { public DatePickerDemo() { this.InitializeComponent(); this.Loaded += DatePickerDemo_Loaded; } void DatePickerDemo_Loaded(object sender, RoutedEventArgs e) { // Date - DatePicker 控件当前显示的日期 datePicker.Date = DateTimeOffset.Now.AddMonths(1); // MinYear - DatePicker 控件所允许选择的最小的年份 datePicker.MinYear = DateTimeOffset.Now.AddYears(-20); // MaxYear - DatePicker 控件所允许选择的最大的年份 datePicker.MaxYear = DateTimeOffset.Now.AddYears(20); // YearVisible - 是否显示 year 选择框 datePicker.YearVisible = true; // MonthVisible - 是否显示 month 选择框 datePicker.MonthVisible = true; // DayVisible - 是否显示 day 选择框 datePicker.DayVisible = true; // CalendarIdentifier - DatePicker 控件所使用的日历系统(Gregorian, Hebrew, Hijri, Japanese, Julian, Korean, Taiwan, Thai, UmAlQura) datePicker.CalendarIdentifier = CalendarIdentifiers.Gregorian; } // DatePicker 控件所选择的日期发生了变化 private void datePicker_DateChanged(object sender, DatePickerValueChangedEventArgs e) { // e.OldDate - 原日期 // e.NewDate - 新日期 lblMsg.Text = e.NewDate.ToString("yyyy-MM-dd hh:mm:ss"); } } }
2、演示 TimePicker 的应用
TimePickerDemo.xaml
<Page x:Class="Windows81.Controls.TimePickerDemo" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Windows81.Controls" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d"> <Grid Background="Transparent"> <StackPanel Margin="120 0 0 0"> <TextBlock Name="lblMsg" FontSize="14.667" /> <!-- TimePicker - 时间选择控件(默认横排,需要竖排的话则设置 Orientation="Vertical" 即可) Header - 控件的标题 TimeChanged - 选中的时间发生变化时所触发的事件 --> <TimePicker Name="timePicker" Header="Time" TimeChanged="timePicker_TimeChanged" Margin="0 20 0 0" /> <TimePicker Name="timePicker2" Header="Time" Margin="0 20 0 0" /> </StackPanel> </Grid> </Page>
TimePickerDemo.xaml.cs
/* * TimePicker - 时间选择控件 */ using System; using Windows.Globalization; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; namespace Windows81.Controls { public sealed partial class TimePickerDemo : Page { public TimePickerDemo() { this.InitializeComponent(); this.Loaded += TimePickerDemo_Loaded; } void TimePickerDemo_Loaded(object sender, RoutedEventArgs e) { // Time - TimePicker 控件当前显示的时间 timePicker.Time = new TimeSpan(16, 0, 0); // MinuteIncrement - 分钟选择框的分钟增量(0, 15, 30, 45) timePicker.MinuteIncrement = 15; // ClockIdentifier - 小时制式,ClockIdentifiers.TwelveHour(12HourClock),12 小时制 timePicker.ClockIdentifier = ClockIdentifiers.TwelveHour; // ClockIdentifier - 小时制式,ClockIdentifiers.TwentyFourHour(24HourClock),24 小时制 timePicker2.ClockIdentifier = ClockIdentifiers.TwentyFourHour; } // TimePicker 控件所选择的时间发生变化时所触发的事件 private void timePicker_TimeChanged(object sender, TimePickerValueChangedEventArgs e) { // e.OldTime - 原时间 // e.NewTime - 新时间 lblMsg.Text = e.NewTime.ToString("c"); } } }
OK
[源码下载]
郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。