Is there a way on how to open the Calendar Window when clicking DatePickerTextBox ? Currently, It will open when clicking the "PART_Button" button. So I want to also open at DatePickerTextBox "PART_TextBox"
Below is my code.
<Style TargetType="{x:Type DatePicker}">
<Setter Property="CalendarStyle" Value="{StaticResource Calendar_Style}" />
<Setter Property="FontFamily" Value="/Fonts/#Poppins"/>
<Setter Property="FontSize" Value="15" />
<Setter Property="FontWeight" Value="Regular"/>
<Setter Property="BorderThickness" Value="1" />
<Setter Property="SelectedDateFormat" Value="Short"/>
<Setter Property="Padding" Value="2"/>
<Setter Property="Focusable" Value="True" />
<Setter Property="IsHitTestVisible" Value="True" />
<Setter Property="HorizontalContentAlignment" Value="Stretch"/>
<Setter Property="Background" Value="{DynamicResource Background}"/>
<Setter Property="BorderBrush" Value="White"/>
<Setter Property="Foreground" Value="{DynamicResource Text}" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type DatePicker}">
<Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" CornerRadius="4">
<Grid x:Name="PART_Root" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
<Grid.RowDefinitions>
<RowDefinition Height="*" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto"/>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<DatePickerTextBox x:Name="PART_TextBox" Grid.Column="0" Grid.Row="0" Focusable="True" HorizontalAlignment="Left" Padding="5,0,0,0" VerticalAlignment="Center" HorizontalContentAlignment="Stretch" VerticalContentAlignment="Stretch"
IsReadOnly="True" Background="{DynamicResource Background}" Foreground="White"
Style="{StaticResource DatePickerTextBoxStyle}" Grid.ColumnSpan="2" />
<Button x:Name="PART_Button" Grid.Column="1" Grid.Row="0" HorizontalAlignment="Right" VerticalAlignment="Center" Width="40" Height="40" BorderBrush="{x:Null}">
<iconPacks:Octicons Kind="Calendar"/>
</Button>
<Grid x:Name="PART_DisabledVisual" Grid.ColumnSpan="2" Grid.Column="0" IsHitTestVisible="False" Opacity="0" Grid.Row="0">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/>
</Grid.ColumnDefinitions>
<Rectangle Grid.Column="1" Fill="Black" RadiusY="1" Grid.Row="0" RadiusX="1"/>
<Rectangle Grid.Column="0" Fill="Black" Height="18" Margin="3,0,3,0" RadiusY="1" Grid.Row="0" RadiusX="1" Width="19"/>
<Popup x:Name="PART_Popup" AllowsTransparency="True" Placement="Bottom" PlacementTarget="{Binding ElementName=PART_TextBox}" StaysOpen="False"/>
</Grid>
</Grid>
</Border>
<ControlTemplate.Triggers>
<DataTrigger Binding="{Binding Source={x:Static SystemParameters.HighContrast}}" Value="false">
<Setter Property="Foreground" TargetName="PART_TextBox" Value="{Binding Foreground, RelativeSource={RelativeSource TemplatedParent}}"/>
</DataTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
<Style.Triggers>
<Trigger Property="IsMouseOver" Value="True">
<Setter Property="BorderBrush" Value="{DynamicResource MainBrush}"/>
</Trigger>
</Style.Triggers>
</Style>
Thank you very much.
CodePudding user response:
You should be able to add a mouse event where you're using the DatePicker
to open the dropdown for the calendar using:
private void OnClick(object sender, RoutedEventArgs e)
{
datePicker.IsDropDownOpen = true;
}
Alternatively, you could implement a custom control over the top of the DatePicker to handle this from the control itself.