Win8 自定义TimePicker --- 用户控件

MyTimePicker.xaml

<UserControl
    x:Class="BPCompanion.MyTimePicker"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:BPCompanion"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d"
    d:DesignHeight="40"
    d:DesignWidth="260">
    
    <Grid>
        <StackPanel Orientation="Horizontal" Height="40">
            <ComboBox x:Name="hourlist" HorizontalAlignment="Left" VerticalAlignment="Top" Width="80" Height="40" >
                <!--<ComboBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Path=HOUR}" VerticalAlignment="Center" FontSize="16" Width="60"/>
                    </DataTemplate>
                </ComboBox.ItemTemplate>-->
                <ComboBoxItem Content="1" IsSelected="True"/>
                <ComboBoxItem Content="2" />
                <ComboBoxItem Content="3" />
                <ComboBoxItem Content="4" />
                <ComboBoxItem Content="5" />
                <ComboBoxItem Content="6" />
                <ComboBoxItem Content="7" />
                <ComboBoxItem Content="8" />
                <ComboBoxItem Content="9" />
                <ComboBoxItem Content="10" />
                <ComboBoxItem Content="11" />
                <ComboBoxItem Content="12" />
            </ComboBox>
            <ComboBox x:Name="minutelist"  HorizontalAlignment="Left"  VerticalAlignment="Top" Width="80" Height="40" Margin="10,0,0,0">
                <!--<ComboBox.ItemTemplate>
                    <DataTemplate>
                        <TextBlock Text="{Binding Path=MINUTE}" VerticalAlignment="Center" FontSize="16" />
                    </DataTemplate>
                </ComboBox.ItemTemplate>-->
                <ComboBoxItem Content="00" IsSelected="True"/>
                <ComboBoxItem Content="01" />
                <ComboBoxItem Content="02" />
                <ComboBoxItem Content="03" />
                <ComboBoxItem Content="04" />
                <ComboBoxItem Content="05" />
                <ComboBoxItem Content="06" />
                <ComboBoxItem Content="07" />
                <ComboBoxItem Content="08" />
                <ComboBoxItem Content="09" />
                <ComboBoxItem Content="10" />
                <ComboBoxItem Content="11" />
                <ComboBoxItem Content="12" />
                <ComboBoxItem Content="13" />
                <ComboBoxItem Content="14" />
                <ComboBoxItem Content="15" />
                <ComboBoxItem Content="16" />
                <ComboBoxItem Content="17" />
                <ComboBoxItem Content="18" />
                <ComboBoxItem Content="19" />
                <ComboBoxItem Content="20" />
                <ComboBoxItem Content="21" />
                <ComboBoxItem Content="22" />
                <ComboBoxItem Content="23" />
                <ComboBoxItem Content="24" />
                <ComboBoxItem Content="25" />
                <ComboBoxItem Content="26" />
                <ComboBoxItem Content="27" />
                <ComboBoxItem Content="28" />
                <ComboBoxItem Content="29" />
                <ComboBoxItem Content="30" />
                <ComboBoxItem Content="31" />
                <ComboBoxItem Content="32" />
                <ComboBoxItem Content="33" />
                <ComboBoxItem Content="34" />
                <ComboBoxItem Content="35" />
                <ComboBoxItem Content="36" />
                <ComboBoxItem Content="37" />
                <ComboBoxItem Content="38" />
                <ComboBoxItem Content="39" />
                <ComboBoxItem Content="40" />
                <ComboBoxItem Content="41" />
                <ComboBoxItem Content="42" />
                <ComboBoxItem Content="43" />
                <ComboBoxItem Content="44" />
                <ComboBoxItem Content="45" />
                <ComboBoxItem Content="46" />
                <ComboBoxItem Content="47" />
                <ComboBoxItem Content="48" />
                <ComboBoxItem Content="49" />
                <ComboBoxItem Content="50" />
                <ComboBoxItem Content="51" />
                <ComboBoxItem Content="52" />
                <ComboBoxItem Content="53" />
                <ComboBoxItem Content="54" />
                <ComboBoxItem Content="55" />
                <ComboBoxItem Content="56" />
                <ComboBoxItem Content="57" />
                <ComboBoxItem Content="58" />
                <ComboBoxItem Content="59" />
            </ComboBox>
            <ComboBox x:Name="ampmlist" HorizontalAlignment="Left" VerticalAlignment="Top" 
                      Width="80" Height="40" Margin="10,0,0,0">
                <ComboBoxItem Content="AM" IsSelected="True"/>
                <ComboBoxItem Content="PM" />
            </ComboBox>
        </StackPanel>
    </Grid>
</UserControl>

MyTimePicker.cs

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.Foundation;
using Windows.Foundation.Collections;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Controls.Primitives;
using Windows.UI.Xaml.Data;
using Windows.UI.Xaml.Input;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Navigation;

// 

namespace BPCompanion
{
    public partial class MyTimePicker : UserControl
    {
        public delegate void Time_ChangedHandler(DateTime date);     // 声明一个 委托，在日期选择发生变化时调用
        public event Time_ChangedHandler Time_ChangedHandlerEvent;                  // 声明一个这种委托的事件  

        private int select_hour { get; set; }                    // 当前选中的 Hour
        private int select_minute { get; set; }                  // 当前选中的 Minute
        private int select_ampm { get; set; }                    // 当前选中的AM / PM
        public DateTime currentTime { get; set; }               // 任何时间都可以通过currentTime属性来获得当前选择时间

        public void setDate(DateTime datetime)
        {
            this.hourlist.SelectedIndex = datetime.Hour % 12 - 1;
            this.minutelist.SelectedIndex = datetime.Minute;

            select_hour = datetime.Hour%12;
            select_minute = datetime.Minute;

            if (datetime.ToString().Contains("PM"))
            {
                this.ampmlist.SelectedIndex = 1;            // PM 
                select_ampm = 1;
            }
            else
            {
                this.ampmlist.SelectedIndex = 0;            // AM
                select_ampm = 0;
            }

            currentTime = new DateTime(datetime.Year, datetime.Month, datetime.Day, select_hour, select_minute, 0);
            if (datetime.ToString().Contains("PM"))      // 如果是下午的话，就添加12个小时
            {
                currentTime = currentTime.AddHours(12);
            }
        }               // 用户通过此方法  设置时间

        public MyTimePicker()
        {
            this.InitializeComponent();

            DateTime now = DateTime.Now;                            // 在没有调用setDate之前，默认显示当前时间

            this.hourlist.SelectedIndex = now.Hour%12 - 1;
            this.minutelist.SelectedIndex = now.Minute;

            select_hour = now.Hour%12;
            select_minute = now.Minute;

            if (now.ToString().Contains("PM"))
            {
                this.ampmlist.SelectedIndex = 1;            // PM 
                select_ampm = 1;
            }
            else
            {
                this.ampmlist.SelectedIndex = 0;            // AM
                select_ampm = 0;
            }

            currentTime = new DateTime(now.Year, now.Month, now.Day, select_hour, select_minute, 0);        // 因为这个地方一定是上午，所以不用判断了

            this.hourlist.SelectionChanged += (a, args) =>
                {
                    select_hour = this.hourlist.SelectedIndex + 1;

                    DateTime dt = new DateTime(now.Year, now.Month, now.Day, select_hour, select_minute, 0);
                    if (1 == select_ampm)       // 如果选择的是下午的话， 添加12个小时，转换为下午
                    {
                        dt = dt.AddHours(12);
                    }
                    currentTime = dt;

                    if (Time_ChangedHandlerEvent != null)           // 判断是否有注册事件, 注意这个地方一定要判断,不然会crash
                    {
                        Time_ChangedHandlerEvent(dt);      //调用所有注册对象的方法
                    }
                };
            this.minutelist.SelectionChanged += (a, args) =>
                {
                    select_minute = this.minutelist.SelectedIndex;

                    DateTime dt = new DateTime(now.Year, now.Month, now.Day, select_hour, select_minute, 0);
                    if (1 == select_ampm)       // 如果选择的是下午的话， 添加12个小时，转换为下午
                    {
                        dt = dt.AddHours(12);
                    }
                    currentTime = dt;

                    if (Time_ChangedHandlerEvent != null)           // 判断是否有注册事件
                    {
                        Time_ChangedHandlerEvent(dt);      //调用所有注册对象的方法
                    }
                };
            this.ampmlist.SelectionChanged += (a, args) =>
                {
                    select_ampm = this.ampmlist.SelectedIndex;

                    DateTime dt = new DateTime(now.Year, now.Month, now.Day, select_hour, select_minute, 0);
                    if (1 == select_ampm)       // 如果选择的是下午的话， 添加12个小时，转换为下午
                    {
                        dt = dt.AddHours(12);
                    }
                    currentTime = dt;

                    if (Time_ChangedHandlerEvent != null)           // 判断是否有注册事件
                    {
                        Time_ChangedHandlerEvent(dt);      //调用所有注册对象的方法
                    }
                };
        }
    }
}

用法：

1 ：在XAML 文件中引入 -------  xmlns:picker="using:BPCompanion"

2： 在使用的地方---------------<picker:MyTimePicker x:Name="timepicker"/>

3：设置、获取时间

   

this.timepicker.setDate(DateTime.Now.AddHours(-8));
            this.cur_time.Text = this.timepicker.currentTime.ToString("hh:mm:ss t") + "M";

            this.timepicker.Time_ChangedHandlerEvent += (time)=>
            {
                this.cur_time.Text = time.ToString("hh:mm:ss t") + "M";
            };

效果：