一、前言
有个项目需要用到时间编辑控件，在大量搜索无果后只能自己自定义一个了。MFC中倒是有这个控件，叫CDateTimeCtrl。大概是这个样子：
二、要实现的功能
- 要实现的功能包含：
- 编辑时、分、秒（可按数字键输入编辑）
- 获取焦点后可实现递增或递减
三、WFP实现原理
四个TextBox和两个TextBlock组和，再加两个按钮应该就能组成这个控件的基本结构了。再设置焦点事件及按键事件可以实现编辑。
Xaml代码如下：
1 <Style TargetType="{x:Type controls:TimeEditer}"> 2 <Setter Property="BorderThickness" Value="1"/> 3 <Setter Property="BorderBrush" Value="#ececec"/> 4 <Setter Property="Hour" Value="00"/> 5 <Setter Property="Minute" Value="00"/> 6 <Setter Property="Second" Value="00"/> 7 <Setter Property="Template"> 8 <Setter.Value> 9 <ControlTemplate TargetType="{x:Type controls:TimeEditer}"> 10 <Border Background="{TemplateBinding Background}" 11 BorderBrush="{TemplateBinding BorderBrush}" 12 BorderThickness="{TemplateBinding BorderThickness}"> 13 <Grid Margin="3 0"> 14 <Grid.ColumnDefinitions> 15 <ColumnDefinition Width="18"/> 16 <ColumnDefinition Width="auto"/> 17 <ColumnDefinition Width="18"/> 18 <ColumnDefinition Width="auto"/> 19 <ColumnDefinition Width="18"/> 20 <ColumnDefinition Width="*"/> 21 </Grid.ColumnDefinitions> 22 <TextBox x:Name="PART_TXTHOUR" HorizontalContentAlignment="Center" Cursor="Arrow" BorderThickness="0" SelectionBrush="White" AutoWordSelection="False" Text="{Binding Hour,RelativeSource={RelativeSource TemplatedParent},StringFormat={}{0:00},UpdateSourceTrigger=PropertyChanged}" Foreground="Black" Focusable="True" IsReadOnly="True" IsReadOnlyCaretVisible="False" VerticalAlignment="Center"/> 23 <TextBlock Text=":" VerticalAlignment="Center" Grid.Column="1"/> 24 <TextBox x:Name="PART_TXTMINUTE" HorizontalContentAlignment="Center" Cursor="Arrow" Grid.Column="2" BorderThickness="0" AutoWordSelection="False" Text="{Binding Minute,RelativeSource={RelativeSource TemplatedParent},StringFormat={}{0:00},UpdateSourceTrigger=PropertyChanged}" Foreground="Black" Focusable="True" IsReadOnly="True" IsReadOnlyCaretVisible="False" VerticalAlignment="Center"/> 25 <TextBlock Text=":" VerticalAlignment="Center" Grid.Column="3"/> 26 <TextBox x:Name="PART_TXTSECOND" HorizontalContentAlignment="Center" Cursor="Arrow" Grid.Column="4" BorderThickness="0" AutoWordSelection="False" Text="{Binding Second,RelativeSource={RelativeSource TemplatedParent},StringFormat={}{0:00},UpdateSourceTrigger=PropertyChanged}" Foreground="Black" Focusable="True" IsReadOnly="True" IsReadOnlyCaretVisible="False" VerticalAlignment="Center"/> 27 <TextBox x:Name="PART_TXT4" Grid.Column="5" Background="Transparent" BorderThickness="0" IsReadOnly="True" AutoWordSelection="False" IsReadOnlyCaretVisible="False" Cursor="Arrow" /> 28 29 <Grid Grid.Column="5" HorizontalAlignment="Right" x:Name="numIncrease" Visibility="{TemplateBinding NumIncreaseVisible}"> 30 <Grid.RowDefinitions> 31 <RowDefinition/> 32 <RowDefinition/> 33 </Grid.RowDefinitions> 34 <controls:ButtonEx x:Name="PART_UP" Focusable="False" ButtonType="Icon" Icon="/BaseControl;component/Images/arrowTop.png" Width="17" Height="11" VerticalAlignment="Bottom"/> 35 <controls:ButtonEx x:Name="PART_DOWN" Focusable="False" ButtonType="Icon" Icon="/BaseControl;component/Images/arrowBottom.png" Width="17" Height="11" VerticalAlignment="Top" Grid.Row="1"/> 36 </Grid> 37 </Grid> 38 </Border> 39 </ControlTemplate> 40 </Setter.Value> 41 </Setter> 42 </Style>