【万里征程——Windows App开发】DatePickerFlyout、TimePickerFlyout的使用

浏览数：30 / 时间：2015年06月11日

已经有挺长时间没有更新这个专栏了，不过刚才有网友私信问我一个问题现在就火速更新上一篇~

这一篇讲解在WP上DataPickerFlyout和TimePickerFlyout的使用，但它们只能在WP上跑哦~

 <Grid Background="Blue">  
        <Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

            <StackPanel Grid.Row="0" Margin="12" Orientation="Vertical">     
                <Button Content="Let‘s Show DatePicker" >
                    <Button.Flyout>        
                        <DatePickerFlyout x:Name="datePickerFlyout" Title="选择日期" 
                                      DatePicked="datePickerFlyout_DatePicked" Closed="datePickerFlyout_Closed" />
                    </Button.Flyout>
                </Button>

                <DatePicker Header="Date"  Margin="4" />          
                <TextBlock Name="textBlockDate" FontSize="20" Margin="4" />            
            </StackPanel>

        <StackPanel Grid.Row="1" Margin="12" Orientation="Vertical">
            <Button Content="Let‘s Show TimePicker" >
                <Button.Flyout>
                    <TimePickerFlyout x:Name="timePickerFlyout" Title="选择时间" 
                                      TimePicked="timePickerFlyout_TimePicked" Closed="timePickerFlyout_Closed" />
                </Button.Flyout>
            </Button>

            <TimePicker Header="Time" Margin="4" />
            <TextBlock Name="textBlockTime" FontSize="20" Margin="4"/>             
        </StackPanel>                                      
    </Grid>

后台事件如下：

 public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();

            this.NavigationCacheMode = NavigationCacheMode.Required;
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
            // 令天数加1
            datePickerFlyout.Date = DateTimeOffset.Now.AddDays(1);

            // 设置可选择的最大年份和最小年份
            datePickerFlyout.MinYear = DateTimeOffset.Now.AddYears(-100);   
            datePickerFlyout.MaxYear = DateTimeOffset.Now.AddYears(100);

            // 此处也可以令“年“、”月“、”日“中的某一个不显示
            datePickerFlyout.YearVisible = true;
            datePickerFlyout.MonthVisible = true;       
            datePickerFlyout.DayVisible = true;

            // 选择的历法
            // （Gregorian 公历, Hebrew 希伯来历, Hijri 回历, Japanese 日本历, Julian 罗马儒略历, Korean 朝鲜历, Taiwan 台湾历, Thai 泰国历, UmAlQura 古兰经历）
            datePickerFlyout.CalendarIdentifier = CalendarIdentifiers.Gregorian;                                                                                                         


            // Time - TimePicker 控件当前显示的时间
            timePickerFlyout.Time = new TimeSpan(18, 0, 0);

            // 设置TimePickerFlyout的分钟选择框内数字的增幅
            timePickerFlyout.MinuteIncrement = 2;                                                                                                           

            //设置为24小时制，也可以为12小时制
            timePickerFlyout.ClockIdentifier = ClockIdentifiers.TwentyFourHour;                 
        }

        // 当用户点击DatePicker的完成按钮后激活该事件
        private void datePickerFlyout_DatePicked(DatePickerFlyout sender, DatePickedEventArgs args)
        {                      
            textBlockDate.Text = args.NewDate.ToString("yyyy-MM-dd hh:mm:ss");
            textBlockDate.Text += Environment.NewLine;
        }

        // 当用户点击DatePicker的取消按钮或手机的返回按钮后激活该事件，当点击完成按钮后也将调用该事件
        private void datePickerFlyout_Closed(object sender, object e)
        {
            textBlockDate.Text += "You just close the DatePickerFlyout.";
            textBlockDate.Text += Environment.NewLine;
        }

        // 当用户点击TimePicker的完成按钮后激活该事件
        private void timePickerFlyout_TimePicked(TimePickerFlyout sender, TimePickedEventArgs args)
        {
            // e.OldTime - 原时间
            // e.NewTime - 新时间
            textBlockTime.Text = args.NewTime.ToString("c");
            textBlockTime.Text += Environment.NewLine;
        }

        // 当用户点击TimePicker的取消按钮或手机的返回按钮后激活该事件，当点击完成按钮后也将调用该事件
        private void timePickerFlyout_Closed(object sender, object e)
        {
            textBlockTime.Text += "You just close the TimePickerFlyout.";
            textBlockTime.Text += Environment.NewLine;
        }
    }