system.windows.datepicker更改标题背景颜色

时间:2012-02-02 11:02:50

标签: wpf datepicker styles

我一直在尝试更改wpf默认日期选择器的背景颜色。现在它是深蓝色的黑色文本,客户希望它变成白色。我编码很多,似乎没什么用。

请帮助。感谢

 <Style x:Key="DateStyle" TargetType="{x:Type DatePcker}" BasedOn="{x:Null}">
    <Style.Triggers>
        <Trigger Property="IsFocused" Value="True">
            <Setter Property="Background" Value="Yellow" />
        </Trigger>
        <Trigger Property="IsReadOnly" Value="True">
            <Setter Property="Background" Value="White" />
        </Trigger>
    </Style.Triggers>
    <Setter Property="Background" Value="Transparent" />
    <Setter Property="CharacterCasing" Value="Upper"/>
    <Setter Property="FontFamily" Value="Segoe UI" />
    <Setter Property="FontSize" Value="11" />
</Style>

这是我的日期选择器

 <DatePicker Grid.Column="2" Grid.ColumnSpan="2" Grid.Row="4" Height="25" HorizontalAlignment="Left" TabIndex="3" 
                                                        Name="dpFillingDateFrom" VerticalAlignment="Center" Width="97" Text="12/12/2011" SelectedDateFormat="Short"/>

1 个答案:

答案 0 :(得分:0)

只需浏览http://msdn.microsoft.com/en-us/magazine/dd882520.aspx即可。 它不是直接改变wpf的默认日期选择器的背景颜色,但你可以按照以下步骤

1)日期选择器具有CalenderStye属性,因此覆盖日历默认ControlTemplate

2)在Calender控件模板中,有CalenderItemStyle,您可以在其中覆盖CalenderItemStyle defaulttemplate。在此,您可以自定义背景颜色和标题按钮。

<Style x:Key="ItemStyle" TargetType="primitives:CalendarItem">
                <Setter Property="Template">
                    <Setter.Value>

            <ControlTemplate TargetType="primitives:CalendarItem">
                <ControlTemplate.Resources>
                    <DataTemplate x:Key="DayTitleTemplate">
                        <TextBlock Text="{Binding}"
                                           HorizontalAlignment="Center" />
                    </DataTemplate>
                </ControlTemplate.Resources>

                <DockPanel Name="PART_Root" 
                                   LastChildFill="True">
                    <Button x:Name="PART_PreviousButton" 
                                    DockPanel.Dock="Left"
                                    Content="&lt;"
                                    Focusable="False" />

                    <Button x:Name="PART_NextButton" 
                                    DockPanel.Dock="Right"
                                    Content="&gt;" 
                                    Focusable="False" />

                    <Button x:Name="PART_HeaderButton"                                             
                                    DockPanel.Dock="Top"
                                    FontWeight="Bold"
                                    Focusable="False" />

                    <Grid>
                        <Grid x:Name="PART_MonthView" 
                                      Visibility="Visible">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                            </Grid.ColumnDefinitions>
                        </Grid>

                        <Grid x:Name="PART_YearView" 
                                      Visibility="Hidden">
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="Auto"/>
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/>
                                <ColumnDefinition Width="Auto"/> 
                            </Grid.ColumnDefinitions>
                        </Grid>
                    </Grid>
                    <Rectangle x:Name="PART_DisabledVisual" Opacity="0" Visibility="Collapsed" Fill="#A5FFFFFF"/>
                </DockPanel>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter TargetName="PART_DisabledVisual" Property="Visibility" Value="Visible" />
                    </Trigger>
                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type toolkit:Calendar}}, Path=DisplayMode}" Value="Year">
                        <Setter TargetName="PART_MonthView" Property="Visibility" Value="Hidden" />
                        <Setter TargetName="PART_YearView" Property="Visibility" Value="Visible" />
                    </DataTrigger>
                    <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType={x:Type toolkit:Calendar}}, Path=DisplayMode}" Value="Decade">
                        <Setter TargetName="PART_MonthView" Property="Visibility" Value="Hidden" />
                        <Setter TargetName="PART_YearView" Property="Visibility" Value="Visible" />
                    </DataTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
            </Setter.Value>
            </Setter>
            </Style>
            <Style x:Key="pp" TargetType="toolkit:Calendar">
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="toolkit:Calendar">
                            <StackPanel Name="PART_Root" 
                Orientation="Horizontal">
                                <primitives:CalendarItem 
            Name="PART_CalendarItem" 
            Style="{StaticResource ItemStyle}"
            Background="{TemplateBinding Background}" 
            BorderBrush="{TemplateBinding BorderBrush}" 
            BorderThickness="{TemplateBinding BorderThickness}"
            VerticalAlignment="Center" />
                                <Border BorderBrush="{TemplateBinding BorderBrush}"
                BorderThickness="{TemplateBinding BorderThickness}"
                Margin="4 4 0 4">
                                    <ScrollViewer 
                    VerticalScrollBarVisibility="Auto"
                    Height="{Binding ElementName=PART_CalendarItem,
                                     Path=ActualHeight}"
                    Width="100">
                                        <ItemsControl 
                    ItemsSource=
                        "{Binding RelativeSource={RelativeSource 
                                      AncestorType=toolkit:Calendar}, 
                                  Path=SelectedDates}" />
                                    </ScrollViewer>
                                </Border>
                            </StackPanel>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
            </Style>
        </Grid.Resources>
        <toolkit:DatePicker CalendarStyle="{StaticResource pp}" Margin="0,0,0,242"></toolkit:DatePicker>