如何自定义WPF日历?

时间:2013-12-07 04:50:34

标签: c# wpf calendar

我想自定义我自己的日历样式。我在网上搜索过,我得到了以下例子:

<Style x:Key="PlaybackCalendarItemStyle" TargetType="primitives:CalendarItem">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="primitives:CalendarItem">
                <ControlTemplate.Resources>
                    <!-- Start: Data template for header button -->
                    <DataTemplate x:Key="DayTitleTemplate">
                        <TextBlock
                                            FontWeight="Bold" 
                                            FontFamily="Verdana" 
                                            FontSize="9.5" 
                                            Foreground="#FF333333" 
                                            HorizontalAlignment="Center"
                                            Text="{Binding}"
                                            Margin="0,6,0,6"
                                            VerticalAlignment="Center"/>
                    </DataTemplate>
                    <!-- End: Data template for header button -->
                </ControlTemplate.Resources>
                <Grid Name="PART_Root" >
                    <Grid.Resources>
                        <SolidColorBrush x:Key="DisabledColor" Color="#A5FFFFFF" />
                    </Grid.Resources>
                    <vsm:VisualStateManager.VisualStateGroups>
                        <vsm:VisualStateGroup x:Name="CommonStates">
                            <vsm:VisualState x:Name="Normal" />
                            <vsm:VisualState x:Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="PART_DisabledVisual" Storyboard.TargetProperty="Opacity" To="1" Duration="0" />
                                </Storyboard>
                            </vsm:VisualState>
                        </vsm:VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>

                    <Border 
                            BorderBrush="{TemplateBinding BorderBrush}" 
                            BorderThickness="{TemplateBinding BorderThickness}" 
                            CornerRadius="1">

                        <!-- This Brush is new -->
                        <Border.Background>
                            <LinearGradientBrush StartPoint="0 0" EndPoint="0 1">
                                <GradientStop Offset="0"   Color="#FFFFC0" />
                                <GradientStop Offset="0.5" Color="#FFE0B0" />
                                <GradientStop Offset="1"   Color="#FFD0A8" />
                            </LinearGradientBrush>
                        </Border.Background>

                        <Border CornerRadius="1" BorderBrush="#FFFFFFFF" BorderThickness="2">
                            <Grid>
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="Auto"/>
                                    <RowDefinition Height="*"/>
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="Auto"/>
                                    <ColumnDefinition Width="Auto"/>
                                </Grid.ColumnDefinitions>

                                <Grid.Resources>
                                    <!-- Start: Previous button template -->
                                    <ControlTemplate x:Key="PreviousButtonTemplate" TargetType="Button">
                                        <Grid Cursor="Hand">
                                            <vsm:VisualStateManager.VisualStateGroups>
                                                <vsm:VisualStateGroup x:Name="CommonStates">
                                                    <vsm:VisualState x:Name="Normal" />
                                                    <vsm:VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <ColorAnimation Storyboard.TargetName="TextColor" Storyboard.TargetProperty="Color" To="#FF73A9D8" Duration="0" />
                                                        </Storyboard>
                                                    </vsm:VisualState>
                                                    <vsm:VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Storyboard.TargetName="TextColor" Storyboard.TargetProperty="Opacity" To=".5" Duration="0" />
                                                        </Storyboard>
                                                    </vsm:VisualState>
                                                </vsm:VisualStateGroup>
                                            </vsm:VisualStateManager.VisualStateGroups>
                                            <Rectangle Fill="#11E5EBF1" Stretch="Fill" Opacity="1"/>
                                            <Grid>
                                                <Path Margin="14,-6,0,0" Height="10" Width="6" VerticalAlignment="Center" HorizontalAlignment="Left" Stretch="Fill" Data="M288.75,232.25 L288.75,240.625 L283,236.625 z">
                                                    <Path.Fill>
                                                        <SolidColorBrush x:Name="TextColor" Color="#FF333333" />
                                                    </Path.Fill>
                                                </Path>
                                            </Grid>
                                        </Grid>
                                    </ControlTemplate>

                                    <!-- End: Previous button template -->

                                    <!-- Start: Next button template -->
                                    <ControlTemplate x:Key="NextButtonTemplate" TargetType="Button">
                                        <Grid Cursor="Hand">
                                            <vsm:VisualStateManager.VisualStateGroups>
                                                <vsm:VisualStateGroup x:Name="CommonStates">
                                                    <vsm:VisualState x:Name="Normal" />
                                                    <vsm:VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <ColorAnimation Storyboard.TargetName="TextColor" Storyboard.TargetProperty="Color" To="#FF73A9D8" Duration="0" />
                                                        </Storyboard>
                                                    </vsm:VisualState>
                                                    <vsm:VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Storyboard.TargetName="TextColor" Storyboard.TargetProperty="Opacity" To=".5" Duration="0" />
                                                        </Storyboard>
                                                    </vsm:VisualState>
                                                </vsm:VisualStateGroup>
                                            </vsm:VisualStateManager.VisualStateGroups>
                                            <Rectangle Fill="#11E5EBF1" Stretch="Fill" Opacity="1"/>
                                            <Grid>
                                                <Path Margin="0,-6,14,0" Height="10" Width="6" VerticalAlignment="Center" HorizontalAlignment="Right" Stretch="Fill" Data="M282.875,231.875 L282.875,240.375 L288.625,236 z">
                                                    <Path.Fill>
                                                        <SolidColorBrush x:Name="TextColor" Color="#FF333333" />
                                                    </Path.Fill>
                                                </Path>
                                            </Grid>
                                        </Grid>
                                    </ControlTemplate>

                                    <!-- End: Next button template -->

                                    <!-- Start: Header button template -->
                                    <ControlTemplate x:Key="HeaderButtonTemplate" TargetType="Button">
                                        <Grid Cursor="Hand">
                                            <vsm:VisualStateManager.VisualStateGroups>
                                                <vsm:VisualStateGroup x:Name="CommonStates">
                                                    <vsm:VisualState x:Name="Normal" />
                                                    <vsm:VisualState x:Name="MouseOver">
                                                        <Storyboard>
                                                            <ColorAnimation Storyboard.TargetName="TextColor" Storyboard.TargetProperty="Color" To="#FF73A9D8" Duration="0" />
                                                        </Storyboard>
                                                    </vsm:VisualState>
                                                    <vsm:VisualState x:Name="Disabled">
                                                        <Storyboard>
                                                            <DoubleAnimation Storyboard.TargetName="buttonContent" Storyboard.TargetProperty="Opacity" To=".5" Duration="0" />
                                                        </Storyboard>
                                                    </vsm:VisualState>
                                                </vsm:VisualStateGroup>
                                            </vsm:VisualStateManager.VisualStateGroups>

                                            <!-- This Border is new -->
                                            <Border Padding="12 0"
                                                        CornerRadius="6">
                                                <Border.Background>
                                                    <LinearGradientBrush StartPoint="0 0" EndPoint="0 1">
                                                        <GradientStop Offset="0" Color="#FFC4A0" />
                                                        <GradientStop Offset="1" Color="#FF9450" />
                                                    </LinearGradientBrush>
                                                </Border.Background>

                                                <ContentPresenter
                                                    x:Name="buttonContent"
                                                    Content="{TemplateBinding Content}"
                                                    ContentTemplate="{TemplateBinding ContentTemplate}"
                                                    Margin="1,4,1,9"
                                                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                                                    <TextElement.Foreground>
                                                        <SolidColorBrush x:Name="TextColor" Color="#FF333333"/>
                                                    </TextElement.Foreground>
                                                </ContentPresenter>
                                            </Border>
                                        </Grid>
                                    </ControlTemplate>
                                    <!-- End: Header button template -->

                                </Grid.Resources>

                                <!-- Start: Previous button content -->
                                <Button x:Name="PART_PreviousButton" 
                                        Grid.Row="0" Grid.Column="0"
                                        Template="{StaticResource PreviousButtonTemplate}" 
                                        Height="20" Width="28" 
                                        HorizontalAlignment="Left" 
                                        Focusable="False"
                                        />
                                <!-- End: Previous button content -->

                                <!-- Start: Header button content -->
                                <Button x:Name="PART_HeaderButton"                                             
                                        Grid.Row="0" Grid.Column="1" 
                                        Template="{StaticResource HeaderButtonTemplate}" 
                                        HorizontalAlignment="Center" VerticalAlignment="Center" 
                                        FontWeight="Bold" FontSize="10.5" 
                                        Focusable="False"
                                        />
                                <!-- End: Header button content -->

                                <!-- Start: Next button content -->
                                <Button x:Name="PART_NextButton" 
                                        Grid.Row="0" Grid.Column="2" 
                                        Height="20" Width="28" 
                                        HorizontalAlignment="Right" 
                                        Template="{StaticResource NextButtonTemplate}" 
                                        Focusable="False"
                                        />
                                <!-- End: Next button content -->

                                <!-- Start: Month Content Grid -->
                                <Grid x:Name="PART_MonthView" Grid.Row="1" Grid.ColumnSpan="3" Visibility="Visible" Margin="6,-1,6,6">
                                    <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>
                                <!-- End: Month Content Grid -->

                                <!-- End: Year Content Grid -->
                                <Grid x:Name="PART_YearView" Grid.Row="1" Grid.ColumnSpan="3" Visibility="Hidden" Margin="6,-3,7,6">
                                    <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>
                                <!-- End: Year Content Grid -->
                            </Grid>
                        </Border>
                    </Border>
                    <Rectangle x:Name="PART_DisabledVisual" Opacity="0" Visibility="Collapsed" Stretch="Fill" StrokeThickness="1" RadiusX="2" RadiusY="2" Stroke="{StaticResource DisabledColor}" Fill="{StaticResource DisabledColor}"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsEnabled" Value="False">
                        <Setter TargetName="PART_DisabledVisual" Property="Visibility" Value="Visible" />
                    </Trigger>
                    <DataTrigger Value="Year">
                        <DataTrigger.Binding>
                            <Binding Path="DisplayMode">
                                <Binding.RelativeSource>
                                    <RelativeSource Mode="FindAncestor" AncestorType="{x:Type toolkit:Calendar}" />
                                </Binding.RelativeSource>
                            </Binding>
                        </DataTrigger.Binding>
                        <Setter TargetName="PART_MonthView" Property="Visibility" Value="Hidden" />
                        <Setter TargetName="PART_YearView" Property="Visibility" Value="Visible" />
                    </DataTrigger>
                    <DataTrigger Value="Decade">
                        <DataTrigger.Binding>
                            <Binding Path="DisplayMode">
                                <Binding.RelativeSource>
                                    <RelativeSource Mode="FindAncestor" AncestorType="{x:Type toolkit:Calendar}" />
                                </Binding.RelativeSource>
                            </Binding>
                        </DataTrigger.Binding>
                        <Setter TargetName="PART_MonthView" Property="Visibility" Value="Hidden" />
                        <Setter TargetName="PART_YearView" Property="Visibility" Value="Visible" />
                    </DataTrigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

此示例的结果是以下图像

enter image description here

但我想自定义日历成为我自己的风格,如下图所示

enter image description here

我已经尝试但我不知道该怎么做,所以有人可以告诉我通往它的方法吗?

非常感谢!

T&amp; T公司

2 个答案:

答案 0 :(得分:0)

上面的例子有更多以下样式:

<Style x:Key="PlaybackCalendarDayButton" TargetType="primitives:CalendarDayButton">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="primitives:CalendarDayButton">

                <!-- This is new -->
                <ControlTemplate.Resources>
                    <src:PlaybackCalendarConverter x:Key="conv" />
                    <src:PlaybackCalendarIsNotNullConverter x:Key="isNotNullConverter" />
                </ControlTemplate.Resources>

                <Grid ToolTip="{Binding Converter={StaticResource conv}, 
                                                Mode=OneWay}">

                    <!-- Resume the copy -->

                    <vsm:VisualStateManager.VisualStateGroups>
                        <vsm:VisualStateGroup x:Name="CommonStates">
                            <vsm:VisualStateGroup.Transitions>
                                <vsm:VisualTransition GeneratedDuration="0:0:0.1" />
                            </vsm:VisualStateGroup.Transitions>
                            <vsm:VisualState x:Name="Normal" />
                            <vsm:VisualState x:Name="MouseOver">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="Background" Storyboard.TargetProperty="Opacity" To=".5" Duration="0" />
                                </Storyboard>
                            </vsm:VisualState>
                            <vsm:VisualState x:Name="Pressed">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="Background" Storyboard.TargetProperty="Opacity" To=".5" Duration="0" />
                                </Storyboard>
                            </vsm:VisualState>
                            <vsm:VisualState x:Name="Disabled">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="Background" Storyboard.TargetProperty="Opacity" To="0" Duration="0" />
                                    <DoubleAnimation Storyboard.TargetName="NormalText" Storyboard.TargetProperty="Opacity" To=".35" Duration="0" />
                                </Storyboard>
                            </vsm:VisualState>
                        </vsm:VisualStateGroup>
                        <vsm:VisualStateGroup x:Name="SelectionStates">
                            <vsm:VisualStateGroup.Transitions>
                                <vsm:VisualTransition GeneratedDuration="0" />
                            </vsm:VisualStateGroup.Transitions>
                            <vsm:VisualState x:Name="Unselected" />
                            <vsm:VisualState x:Name="Selected">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="SelectedBackground" Storyboard.TargetProperty="Opacity" To=".75" Duration="0" />
                                </Storyboard>
                            </vsm:VisualState>
                        </vsm:VisualStateGroup>
                        <vsm:VisualStateGroup x:Name="CalendarButtonFocusStates">
                            <vsm:VisualStateGroup.Transitions>
                                <vsm:VisualTransition GeneratedDuration="0" />
                            </vsm:VisualStateGroup.Transitions>
                            <vsm:VisualState x:Name="CalendarButtonFocused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DayButtonFocusVisual" Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </vsm:VisualState>
                            <vsm:VisualState x:Name="CalendarButtonUnfocused">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DayButtonFocusVisual" Storyboard.TargetProperty="Visibility" Duration="0">
                                        <DiscreteObjectKeyFrame KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Collapsed</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </vsm:VisualState>
                        </vsm:VisualStateGroup>
                        <vsm:VisualStateGroup x:Name="ActiveStates">
                            <vsm:VisualStateGroup.Transitions>
                                <vsm:VisualTransition GeneratedDuration="0" />
                            </vsm:VisualStateGroup.Transitions>
                            <vsm:VisualState x:Name="Active" />
                            <vsm:VisualState x:Name="Inactive">
                                <Storyboard>
                                    <ColorAnimation Duration="0" Storyboard.TargetName="selectedText" Storyboard.TargetProperty="Color" To="#FF777777"></ColorAnimation>
                                </Storyboard>
                            </vsm:VisualState>
                        </vsm:VisualStateGroup>
                        <vsm:VisualStateGroup x:Name="DayStates">
                            <vsm:VisualStateGroup.Transitions>
                                <vsm:VisualTransition GeneratedDuration="0" />
                            </vsm:VisualStateGroup.Transitions>
                            <vsm:VisualState x:Name="RegularDay" />
                            <vsm:VisualState x:Name="Today">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="TodayBackground" Storyboard.TargetProperty="Opacity" To="1" Duration="0" />
                                    <ColorAnimation Duration="0" Storyboard.TargetName="selectedText" Storyboard.TargetProperty="Color" To="#FFFFFFFF"></ColorAnimation>
                                </Storyboard>
                            </vsm:VisualState>
                        </vsm:VisualStateGroup>
                        <vsm:VisualStateGroup x:Name="BlackoutDayStates">
                            <vsm:VisualStateGroup.Transitions>
                                <vsm:VisualTransition GeneratedDuration="0" />
                            </vsm:VisualStateGroup.Transitions>
                            <vsm:VisualState x:Name="NormalDay" />
                            <vsm:VisualState x:Name="BlackoutDay">
                                <Storyboard>
                                    <DoubleAnimation Duration="0" Storyboard.TargetName="Blackout" Storyboard.TargetProperty="Opacity" To=".2"/>
                                </Storyboard>
                            </vsm:VisualState>
                        </vsm:VisualStateGroup>
                    </vsm:VisualStateManager.VisualStateGroups>
                    <Rectangle x:Name="TodayBackground" RadiusX="1" RadiusY="1" Opacity="0" Fill="#FFAAAAAA"/>

                    <Rectangle x:Name="SelectedBackground" RadiusX="1" RadiusY="1" Opacity="0" Fill="{TemplateBinding Background}"/>
                    <Rectangle x:Name="Background" RadiusX="1" RadiusY="1" Opacity="0" Fill="{TemplateBinding Background}"/>

                    <ContentPresenter
                                x:Name="NormalText"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                Margin="5,1,5,1"
                                >
                        <TextElement.Foreground>
                            <SolidColorBrush x:Name="selectedText" Color="#FF333333"/>
                        </TextElement.Foreground>
                    </ContentPresenter>
                    <Path x:Name="Blackout" Opacity="0" Margin="3" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" RenderTransformOrigin="0.5,0.5" Fill="#FF000000" Stretch="Fill" Data="M8.1772461,11.029181 L10.433105,11.029181 L11.700684,12.801641 L12.973633,11.029181 L15.191895,11.029181 L12.844727,13.999395 L15.21875,17.060919 L12.962891,17.060919 L11.673828,15.256231 L10.352539,17.060919 L8.1396484,17.060919 L10.519043,14.042364 z"/>
                    <Rectangle x:Name="DayButtonFocusVisual" Visibility="Collapsed" IsHitTestVisible="false" RadiusX="1" RadiusY="1" Stroke="#FF45D6FA"/>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsFocused" Value="True">
                        <Setter TargetName="DayButtonFocusVisual" Property="Visibility" Value="Visible" />
                    </Trigger>

                    <DataTrigger Binding="{Binding Converter={StaticResource isNotNullConverter}}" Value="{x:Null}">
                        <Setter TargetName="NormalText" Property="TextElement.Foreground" Value="Red"/>
                    </DataTrigger>

                </ControlTemplate.Triggers>

            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我必须在这里发帖,因为这个问题受到30,000个字符的限制。 谢谢!

答案 1 :(得分:0)

你看过:http://www.functionx.com/vcsharp/controls/monthcalendar.htm

主要是:

  

在行分隔符下,列出了月份的数字日期。默认情况下,控件的数字天数显示在白色背景上方,即Window系统颜色。此颜色由重写的BackColor属性控制。

  

当月的日期字体颜色   月份的天数以两种颜色显示。默认情况下,所选月份的实际日期显示为WindowText系统颜色的黑色。这些天的颜色由重写的ForeColor属性控制。