WPF Extended Toolkit DateTimePicker Style

ExtendedToolkitDateTimePickerStyle

<ResourceDictionary
  xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
	xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
	xmlns:theme="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"
	xmlns:xctk="http://schemas.xceed.com/wpf/xaml/toolkit"
	xmlns:rti="clr-namespace:RTI">
	<!-- http://stackoverflow.com/questions/560811/how-to-use-datetimepicker-in-wpf -->
	<!-- https://github.com/IsNull/Archimedes/blob/master/Archimedes.Controls.WPF/Themes/Generic.xaml -->
	<!-- http://wpftoolkit.codeplex.com/discussions/355784 -->
	<rti:TimeFormatToDateTimeFormatConverter x:Key="TimeFormatToDateTimeFormatConverter" />
	
	<Style x:Key="PulseDateTimePickerStyle" TargetType="{x:Type xctk:DateTimePicker}">
		<Setter Property="Template">
			<Setter.Value>
				<ControlTemplate TargetType="{x:Type xctk:DateTimePicker}">
					<Border>
						<Grid>
							<Grid>
								<Grid.ColumnDefinitions>
									<ColumnDefinition Width="*"/>
									<ColumnDefinition Width="Auto"/>
								</Grid.ColumnDefinitions>

								<xctk:DateTimeUpDown AllowSpin="{TemplateBinding AllowSpin}" 
														BorderThickness="1,1,0,1" 
														FormatString="{TemplateBinding FormatString}" 
														Format="{TemplateBinding Format}" 
														ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}" 
														Value="{Binding Value, RelativeSource={RelativeSource TemplatedParent}}" 
														WatermarkTemplate="{TemplateBinding WatermarkTemplate}" 
														Watermark="{TemplateBinding Watermark}" 
														Foreground="{StaticResource PulseFontColor}" 
														BorderBrush="Black"
														Background="{StaticResource PulseBackBorder1Color}">
								</xctk:DateTimeUpDown>

								<ToggleButton x:Name="_calendarToggleButton" Background="{x:Null}" Grid.Column="1" IsChecked="{Binding IsOpen, RelativeSource={RelativeSource TemplatedParent}}">
									<ToggleButton.IsHitTestVisible>
										<Binding Path="IsOpen" RelativeSource="{RelativeSource TemplatedParent}">
											<Binding.Converter>
												<rti:InverseBoolConverter/>
											</Binding.Converter>
										</Binding>
									</ToggleButton.IsHitTestVisible>
									<ToggleButton.Style>
										<Style TargetType="{x:Type ToggleButton}">
											<Setter Property="Template">
												<Setter.Value>
													<ControlTemplate TargetType="{x:Type ToggleButton}">
														<Grid SnapsToDevicePixels="True">
															<theme:ButtonChrome x:Name="ToggleButtonChrome" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}" BorderBrush="{x:Null}" />
																<Grid>
																	<Grid.ColumnDefinitions>
																		<ColumnDefinition Width="*"/>
 																		<ColumnDefinition Width="Auto"/>
																	</Grid.ColumnDefinitions>
																	<ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="Stretch" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Stretch"/>
																	<Grid x:Name="arrowGlyph" Grid.Column="1" IsHitTestVisible="False" Margin="5">
																		<Path Data="M0,1C0,1 0,0 0,0 0,0 3,0 3,0 3,0 3,1 3,1 3,1 4,1 4,1 4,1 4,0 4,0 4,0 7,0 7,0 7,0 7,1 7,1 7,1 6,1 6,1 6,1 6,2 6,2 6,2 5,2 5,2 5,2 5,3 5,3 5,3 4,3 4,3 4,3 4,4 4,4 4,4 3,4 3,4 3,4 3,3 3,3 3,3 2,3 2,3 2,3 2,2 2,2 2,2 1,2 1,2 1,2 1,1 1,1 1,1 0,1 0,1z" Fill="White" Height="4" Width="7"/>
																</Grid>
															</Grid>
														</Grid>
													</ControlTemplate>
												</Setter.Value>
											</Setter>
										</Style>
									</ToggleButton.Style>
								</ToggleButton>
							</Grid>

							<Popup IsOpen="{Binding IsChecked, ElementName=_calendarToggleButton}" StaysOpen="False">
								<Border BorderThickness="1" Padding="3" Background="{StaticResource PulseBackBorder1Color}" BorderBrush="Black">
									<StackPanel Background="{x:Null}">
										<Calendar x:Name="Part_Calendar" BorderThickness="0" DisplayDate="{Binding Value, RelativeSource={RelativeSource TemplatedParent}}" Background="{StaticResource PulseBackBorder2Color}" SelectedDate="{Binding Value, RelativeSource={RelativeSource TemplatedParent}}"  />
										<xctk:TimePicker x:Name="Part_TimeUpDown" Format="ShortTime" Value="{Binding Value, RelativeSource={RelativeSource TemplatedParent}}" WatermarkTemplate="{TemplateBinding TimeWatermarkTemplate}" Watermark="{TemplateBinding TimeWatermark}" Background="{x:Null}" Style="{DynamicResource TimePickerStyle1}"/>
									</StackPanel>
								</Border>
							</Popup>
						</Grid>
					</Border>
				</ControlTemplate>
			</Setter.Value>
		</Setter>
	</Style>

	<Style x:Key="TimePickerStyle1" TargetType="{x:Type xctk:TimePicker}">
		<Setter Property="WatermarkTemplate">
			<Setter.Value>
				<DataTemplate>
					<ContentControl Content="{Binding}" Foreground="Gray" Focusable="False"/>
				</DataTemplate>
			</Setter.Value>
		</Setter>
		<Setter Property="Template">
			<Setter.Value>
				<ControlTemplate TargetType="{x:Type xctk:TimePicker}">
					<Border>
						<Grid>
							<Grid>
								<Grid.ColumnDefinitions>
									<ColumnDefinition Width="*"/>
									<ColumnDefinition Width="Auto"/>
								</Grid.ColumnDefinitions>
								<Grid>
									<xctk:DateTimeUpDown x:Name="PART_TimeUpDown" 
															AllowSpin="{TemplateBinding AllowSpin}"
															BorderThickness="1,1,0,1"
															FormatString="{TemplateBinding FormatString}" 
															ShowButtonSpinner="{TemplateBinding ShowButtonSpinner}" 
															Value="{Binding Value, RelativeSource={RelativeSource TemplatedParent}}" 
															WatermarkTemplate="{TemplateBinding WatermarkTemplate}" 
															Watermark="{TemplateBinding Watermark}" 
															Background="{StaticResource PulseBackBorder1Color}"
															Foreground="{StaticResource PulseFontColor}" 
															BorderBrush="Black">
										<xctk:DateTimeUpDown.Format>
											<TemplateBinding Property="Format">
												<TemplateBinding.Converter>
													<rti:TimeFormatToDateTimeFormatConverter/>
												</TemplateBinding.Converter>
											</TemplateBinding>
										</xctk:DateTimeUpDown.Format>
									</xctk:DateTimeUpDown>
								</Grid>
								<ToggleButton x:Name="_timePickerToggleButton" Grid.Column="1" IsChecked="{Binding IsOpen, RelativeSource={RelativeSource TemplatedParent}}" >
									<ToggleButton.IsHitTestVisible>
										<Binding Path="IsOpen" RelativeSource="{RelativeSource TemplatedParent}">
											<Binding.Converter>
												<rti:InverseBoolConverter/>
											</Binding.Converter>
										</Binding>
									</ToggleButton.IsHitTestVisible>
									<ToggleButton.Style>
										<Style TargetType="{x:Type ToggleButton}">
											<Setter Property="Template">
												<Setter.Value>
													<ControlTemplate TargetType="{x:Type ToggleButton}">
														<Grid SnapsToDevicePixels="True">
															<theme:ButtonChrome x:Name="ToggleButtonChrome" RenderMouseOver="{TemplateBinding IsMouseOver}" RenderPressed="{TemplateBinding IsPressed}"/>
															<Grid>
																<Grid.ColumnDefinitions>
																	<ColumnDefinition Width="*"/>
																	<ColumnDefinition Width="Auto"/>
																</Grid.ColumnDefinitions>
																<ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="Stretch" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Stretch"/>
																<Grid x:Name="arrowGlyph" Grid.Column="1" IsHitTestVisible="False" Margin="5">
																	<Path Data="M0,1C0,1 0,0 0,0 0,0 3,0 3,0 3,0 3,1 3,1 3,1 4,1 4,1 4,1 4,0 4,0 4,0 7,0 7,0 7,0 7,1 7,1 7,1 6,1 6,1 6,1 6,2 6,2 6,2 5,2 5,2 5,2 5,3 5,3 5,3 4,3 4,3 4,3 4,4 4,4 4,4 3,4 3,4 3,4 3,3 3,3 3,3 2,3 2,3 2,3 2,2 2,2 2,2 1,2 1,2 1,2 1,1 1,1 1,1 0,1 0,1z" Fill="Black" Height="4" Width="7"/>
																</Grid>
															</Grid>
														</Grid>
													</ControlTemplate>
												</Setter.Value>
											</Setter>
										</Style>
									</ToggleButton.Style>
								</ToggleButton>
							</Grid>

							<Popup IsOpen="{Binding IsChecked, ElementName=_timePickerToggleButton}" StaysOpen="False">
								<Border BorderThickness="1" Background="{StaticResource PulseBackBorder1Color}" BorderBrush="Black">
									<Grid>
										<ListBox x:Name="PART_TimeListItems"
														BorderThickness="0"
														DisplayMemberPath="Display"
														Height="130" 
														Width="150" 
														Foreground="{StaticResource PulseFontColor}">
											<ListBox.ItemContainerStyle>
												<Style TargetType="{x:Type ListBoxItem}">
													<Setter Property="Template">
														<Setter.Value>
															<ControlTemplate TargetType="ListBoxItem">
																<Border Name="Border" SnapsToDevicePixels="true">
																	<ContentPresenter Margin="4" />
																</Border>
																<ControlTemplate.Triggers>
																	<Trigger Property="IsMouseOver" Value="True">
																		<Setter TargetName="Border" Property="Background" Value="Gray" />
																	</Trigger>
																	<Trigger Property="IsSelected" Value="True">
																		<Setter TargetName="Border" Property="Background" Value="{DynamicResource {x:Static SystemColors.HighlightBrushKey}}" />
																		<Setter Property="Foreground" Value="{StaticResource PulseFontColor}" />
																	</Trigger>
																</ControlTemplate.Triggers>
															</ControlTemplate>
														</Setter.Value>
													</Setter>
												</Style>
											</ListBox.ItemContainerStyle>
										</ListBox>
									</Grid>
								</Border>
							</Popup>
						</Grid>
					</Border>
				</ControlTemplate>
			</Setter.Value>
		</Setter>
	</Style>
</ResourceDictionary>