原文:WPF 日历模板改写

版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/BYH371256/article/details/83346221

 本章讲述：日历模板改写

先来看看效果图：

1、头部按钮模板改写：按钮背景颜色透明，移动到按钮上，前景色改变

<Style TargetType="{x:Type Button}" x:Key="CalendarButton">

    <Setter Property="Margin" Value="2"/>

    <Setter Property="Foreground" Value="#FF333333" />

    <Setter Property="Template">

        <Setter.Value>

            <ControlTemplate TargetType="{x:Type Button}">

                <Grid>

                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"

                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}" RecognizesAccessKey="True" />

                </Grid>

                <ControlTemplate.Triggers>

                    <Trigger Property="IsMouseOver" Value="True">

                        <Setter Property="Background" Value="#FF0E8BD2" />

                        <Setter  Property="Foreground" Value="White" />

                    </Trigger>

                </ControlTemplate.Triggers>

            </ControlTemplate>

        </Setter.Value>

    </Setter>

</Style>

2、日历模板改写

<Style x:Key="CalendarButtonStyle" TargetType="{x:Type CalendarButton}">

    <Setter Property="MinWidth" Value="10"/>

    <Setter Property="MinHeight" Value="10"/>

    <Setter Property="FontSize" Value="12"/>

    <Setter Property="Width" Value="40"/>

    <Setter Property="Height" Value="32"/>

    <Setter Property="HorizontalContentAlignment" Value="Center"/>

    <Setter Property="VerticalContentAlignment" Value="Center"/>

    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>

    <Setter Property="Template">

        <Setter.Value>

            <ControlTemplate TargetType="{x:Type CalendarButton}">

                <Grid>

                    <VisualStateManager.VisualStateGroups>

                        <VisualStateGroup x:Name="SelectionStates">

                            <VisualStateGroup.Transitions>

                                <VisualTransition GeneratedDuration="0"/>

                            </VisualStateGroup.Transitions>

                            <VisualState x:Name="Unselected"/>

                            <VisualState x:Name="Selected">

                                <Storyboard>

                                    <DoubleAnimation Duration="0:0:.2" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="SelectedBackground"/>

                                    <ColorAnimation Duration="0" To="#FFFFFFFF" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="NormalText"/>

                                </Storyboard>

                            </VisualState>

                        </VisualStateGroup>

                        <VisualStateGroup x:Name="ActiveStates">

                            <VisualStateGroup.Transitions>

                                <VisualTransition GeneratedDuration="0"/>

                            </VisualStateGroup.Transitions>

                            <VisualState x:Name="Active"/>

                            <VisualState x:Name="Inactive">

                                <Storyboard>

                                    <ColorAnimation Duration="0" To="#bdbdbd" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="NormalText"/>

                                </Storyboard>

                            </VisualState>

                        </VisualStateGroup>

                    </VisualStateManager.VisualStateGroups>

                    <Rectangle x:Name="SelectedBackground" Fill="{DynamicResource DangerBrush}" Opacity="0" RadiusY="16" RadiusX="16"/>

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

                    <ContentPresenter x:Name="NormalText" TextElement.Foreground="#212121" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

                    <Rectangle x:Name="CalendarButtonFocusVisual" IsHitTestVisible="false" RadiusY="16" RadiusX="16" Stroke="{DynamicResource PrimaryBrush}" Visibility="Collapsed"/>

                </Grid>

                <ControlTemplate.Triggers>

                    <Trigger Property="IsFocused" Value="True">

                        <Setter Property="Visibility" TargetName="CalendarButtonFocusVisual" Value="Visible"/>

                    </Trigger>

                </ControlTemplate.Triggers>

            </ControlTemplate>

        </Setter.Value>

    </Setter>

</Style>

<Style x:Key="CalendarDayButtonStyle" TargetType="{x:Type CalendarDayButton}">

    <Setter Property="MinWidth" Value="10"/>

    <Setter Property="MinHeight" Value="10"/>

    <Setter Property="FontSize" Value="12"/>

    <Setter Property="Width" Value="32"/>

    <Setter Property="Height" Value="32"/>

    <Setter Property="HorizontalContentAlignment" Value="Center"/>

    <Setter Property="VerticalContentAlignment" Value="Center"/>

    <Setter Property="FocusVisualStyle" Value="{x:Null}"/>

    <Setter Property="Template">

        <Setter.Value>

            <ControlTemplate TargetType="{x:Type CalendarDayButton}">

                <Grid>

                    <VisualStateManager.VisualStateGroups>

                        <VisualStateGroup x:Name="CommonStates">

                            <VisualStateGroup.Transitions>

                                <VisualTransition GeneratedDuration="0:0:0.1"/>

                            </VisualStateGroup.Transitions>

                            <VisualState x:Name="Normal"/>

                            <VisualState x:Name="Disabled">

                                <Storyboard>

                                    <DoubleAnimation Duration="0" To=".35" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="NormalText"/>

                                </Storyboard>

                            </VisualState>

                        </VisualStateGroup>

                        <VisualStateGroup x:Name="SelectionStates">

                            <VisualStateGroup.Transitions>

                                <VisualTransition GeneratedDuration="0"/>

                            </VisualStateGroup.Transitions>

                            <VisualState x:Name="Unselected"/>

                            <VisualState x:Name="Selected">

                                <Storyboard>

                                    <DoubleAnimation Duration="0:0:.2" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="SelectedBackground"/>

                                    <ColorAnimation Duration="0" To="#FFFFFFFF" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="NormalText"/>

                                </Storyboard>

                            </VisualState>

                        </VisualStateGroup>

                        <VisualStateGroup x:Name="ActiveStates">

                            <VisualStateGroup.Transitions>

                                <VisualTransition GeneratedDuration="0"/>

                            </VisualStateGroup.Transitions>

                            <VisualState x:Name="Active"/>

                            <VisualState x:Name="Inactive">

                                <Storyboard>

                                    <ColorAnimation Duration="0" To="#bdbdbd" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="NormalText"/>

                                </Storyboard>

                            </VisualState>

                        </VisualStateGroup>

                        <VisualStateGroup x:Name="DayStates">

                            <VisualStateGroup.Transitions>

                                <VisualTransition GeneratedDuration="0"/>

                            </VisualStateGroup.Transitions>

                            <VisualState x:Name="RegularDay"/>

                            <VisualState x:Name="Today">

                                <Storyboard>

                                    <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="TodayBackground"/>

                                    <ColorAnimation Duration="0" To="#FFFFFFFF" Storyboard.TargetProperty="(TextElement.Foreground).(SolidColorBrush.Color)" Storyboard.TargetName="NormalText"/>

                                </Storyboard>

                            </VisualState>

                        </VisualStateGroup>

                    </VisualStateManager.VisualStateGroups>

                    <Rectangle RadiusX="16" RadiusY="16" x:Name="TodayBackground" Fill="{DynamicResource DangerBrush}" Opacity="0"/>

                    <Rectangle x:Name="SelectedBackground" Fill="{DynamicResource PrimaryBrush}" Opacity="0" RadiusY="16" RadiusX="16"/>

                    <ContentPresenter x:Name="NormalText" TextElement.Foreground="#212121" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>

                </Grid>

            </ControlTemplate>

        </Setter.Value>

    </Setter>

</Style>

<Style TargetType="{x:Type CalendarItem}">

    <Setter Property="Margin" Value="0"/>

    <Setter Property="Template">

        <Setter.Value>

            <ControlTemplate TargetType="{x:Type CalendarItem}">

                <ControlTemplate.Resources>

                    <DataTemplate x:Key="{x:Static CalendarItem.DayTitleTemplateResourceKey}">

                        <TextBlock Foreground="#FF333333" FontWeight="Bold" FontSize="12" HorizontalAlignment="Center" Margin="0,6,0,6" Text="{Binding}" VerticalAlignment="Center"/>

                    </DataTemplate>

                </ControlTemplate.Resources>

                <Grid x:Name="PART_Root">

                    <VisualStateManager.VisualStateGroups>

                        <VisualStateGroup x:Name="CommonStates">

                            <VisualState x:Name="Normal"/>

                            <VisualState x:Name="Disabled">

                                <Storyboard>

                                    <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="Opacity" Storyboard.TargetName="PART_DisabledVisual"/>

                                </Storyboard>

                            </VisualState>

                        </VisualStateGroup>

                    </VisualStateManager.VisualStateGroups>

                    <Border BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}">

                        <Border BorderBrush="#FFFFFFFF">

                            <Grid>

                                <Grid.ColumnDefinitions>

                                    <ColumnDefinition Width="*"/>

                                    <ColumnDefinition Width="3*"/>

                                    <ColumnDefinition Width="*"/>

                                </Grid.ColumnDefinitions>

                                <Grid.RowDefinitions>

                                    <RowDefinition Height="Auto"/>

                                    <RowDefinition Height="*"/>

                                </Grid.RowDefinitions>

                                <Border Background="{DynamicResource PrimaryBrush}" Grid.ColumnSpan="3"/>

                                <!-- 日历头部按钮 颜色等 -->

                                <Button x:Name="PART_PreviousButton" Grid.Row="0" Grid.Column="0" Width="50" Height="50" Focusable="False" Content="&lt;"

                                        FontSize="30" Style="{StaticResource  CalendarButton}" HorizontalAlignment="Left" />

                                <Button x:Name="PART_HeaderButton" Foreground="White" Grid.Column="1" FontWeight="Bold" FontSize="16" HorizontalAlignment="Center" Grid.Row="0"

                                        Style="{StaticResource CalendarButton}"/>

                                <Button x:Name="PART_NextButton" Width="50" Height="50" Padding="16" Grid.Row="0" Grid.Column="2" Focusable="False" Content="&gt;"

                                        FontSize="30" Style="{StaticResource CalendarButton}"  HorizontalAlignment="Right"/>

                                <Grid Width="240" Height="240" x:Name="PART_MonthView" Margin="10" Grid.ColumnSpan="3" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Row="1" Visibility="Visible">

                                    <Grid.ColumnDefinitions>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                    </Grid.ColumnDefinitions>

                                    <Grid.RowDefinitions>

                                        <RowDefinition/>

                                        <RowDefinition/>

                                        <RowDefinition/>

                                        <RowDefinition/>

                                        <RowDefinition/>

                                        <RowDefinition/>

                                        <RowDefinition/>

                                    </Grid.RowDefinitions>

                                </Grid>

                                <Grid Width="240" Height="240" x:Name="PART_YearView" Margin="10" Grid.ColumnSpan="3" Grid.Column="0" HorizontalAlignment="Center" VerticalAlignment="Center" Grid.Row="1" Visibility="Hidden">

                                    <Grid.ColumnDefinitions>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                        <ColumnDefinition/>

                                    </Grid.ColumnDefinitions>

                                    <Grid.RowDefinitions>

                                        <RowDefinition/>

                                        <RowDefinition/>

                                        <RowDefinition/>

                                    </Grid.RowDefinitions>

                                </Grid>

                            </Grid>

                        </Border>

                    </Border>

                </Grid>

                <ControlTemplate.Triggers>

                    <DataTrigger Binding="{Binding DisplayMode, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Calendar}}}" Value="Year">

                        <Setter Property="Visibility" TargetName="PART_MonthView" Value="Hidden"/>

                        <Setter Property="Visibility" TargetName="PART_YearView" Value="Visible"/>

                    </DataTrigger>

                    <DataTrigger Binding="{Binding DisplayMode, RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type Calendar}}}" Value="Decade">

                        <Setter Property="Visibility" TargetName="PART_MonthView" Value="Hidden"/>

                        <Setter Property="Visibility" TargetName="PART_YearView" Value="Visible"/>

                    </DataTrigger>

                </ControlTemplate.Triggers>

            </ControlTemplate>

        </Setter.Value>

    </Setter>

</Style>

<Style x:Key="CalendarBaseStyle" TargetType="{x:Type Calendar}">

    <Setter Property="Foreground" Value="White"/>

    <Setter Property="Background" Value="White"/>

    <Setter Property="BorderBrush" Value="{DynamicResource BorderBrush}"/>

    <Setter Property="BorderThickness" Value="1"/>

    <Setter Property="CalendarDayButtonStyle" Value="{StaticResource CalendarDayButtonStyle}"/>

    <Setter Property="CalendarButtonStyle" Value="{StaticResource CalendarButtonStyle}"/>

    <Setter Property="Template">

        <Setter.Value>

            <ControlTemplate TargetType="{x:Type Calendar}">

                <StackPanel x:Name="PART_Root" HorizontalAlignment="Center">

                    <CalendarItem x:Name="PART_CalendarItem" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}"/>

                </StackPanel>

            </ControlTemplate>

        </Setter.Value>

    </Setter>

</Style>

<Style TargetType="{x:Type Calendar}" BasedOn="{StaticResource CalendarBaseStyle}"/>

<LinearGradientBrush x:Key="PrimaryBrush" EndPoint="1,0" StartPoint="0,0">

    <GradientStop Color="#73a5ff" Offset="0"/>

    <GradientStop Color="#5477f5" Offset="1"/>

</LinearGradientBrush>

<LinearGradientBrush x:Key="DangerBrush" EndPoint="1,0" StartPoint="0,0">

    <GradientStop Color="#ff8792" Offset="0"/>

    <GradientStop Color="#ff4c9f" Offset="1"/>

</LinearGradientBrush>

3、键值生成，设置日历控件为全局引用

<Style TargetType="{x:Type Calendar}" BasedOn="{StaticResource CalendarBaseStyle}"/>

4、外部引用

<Calendar Margin="32" SelectionMode="MultipleRange" SelectedDate="{ Binding CalendarTime}"/>

5、获取日历时间属性

private DateTime calendarTime;

public DateTime CalendarTime

{

      get { return calendarTime; }

      set

      {

              calendarTime = value;

              NotifyOfPropertyChange(() => CalendarTime);

      }

}

 

WPF 日历模板改写的更多相关文章

  1. WPF三大模板简介（Z）

    WPF三大模板简介   WPF支持以下类型的模板: (1) 控件模板.控件模板可以将自定义模板应用到某一特定类型的所有控件,或是控件的某一实例.决定控件外观的是ControlTemplate,它决定了 ...

  2. 使用 DotNet CLI 创建自定义的 WPF 项目模板

    描述 当我们安装完 DotNetCore 3.0 版本的 SDK 后,我们就可以创建基于 DotNetCore 的 WPF 项目模板,通过如下 CLI 可以方便快捷的创建并运行我们的项目: dotne ...

  3. WPF ListBoxItem模板中添加CheckBox选中问题

    原文:WPF ListBoxItem模板中添加CheckBox选中问题 是这样的,需要一个ListBox来展示照片,并添加一个选中的CheckBox.这就需要对ListBox的ItemTemplate ...

  4. WPF － 模板查看工具：Show Me The Template及如何查看第三方主题

    原文:WPF - 模板查看工具:Show Me The Template及如何查看第三方主题 在学习WPF的模板(DataTemplate.ItemsPanelTemplate.ControlTemp ...

  5. 总结：WPF中模板需要绑定父级别的ViewModel该如何处理

    原文:总结:WPF中模板需要绑定父级别的ViewModel该如何处理 <ListBox ItemsSource="{Binding ClassCollection}"> ...

  6. WPF三大模板简介

    WPF支持以下类型的模板: (1) 控件模板.控件模板可以将自定义模板应用到某一特定类型的所有控件,或是控件的某一实例.决定控件外观的是ControlTemplate,它决定了控件“长成什么样子”,因 ...

  7. 【笔记】WPF之模板控件应用

    最近在捣鼓WPF的动画,想自定义一个控件模型来实现动画. 目标功能是这样:在WPF项目文件中创建一个自定义用户控件模型,该模型最外层是一个Grid,Grid布局为3行1列,第一列是一个图片按钮,第二列 ...

  8. WPF动态模板选择的两种实现

    前言 .net开发工作了六年,看了大量的博客,现在想开始自己写博客,这是我的第一篇博客,试试水,就从自己最常使用的WPF开始. 今天我来给大家分享可用户动态选择控件模板的两种实现方式:DataTrig ...

  9. WPF Demo20 模板

    <Window x:Class="控件模板.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/x ...

随机推荐

  1. 远程登录与文件传输指令——ssh与scp

    远程登录指令 ssh ssh 是一个用于登录远程主机并在远程主机上执行命令的程序.ssh 设计的本意在于在一个不确定的网络环境下为两个互不信任的主机提供加密通信功能.在 Linux 桌面版本上,一般内 ...

  2. int vs Integer

    在项目开发过程中,有时候在选择int还是Integer会有些纠结.今天就来聊一下这个问题.当然,下面所说的基本也适用于java中其他基本类型和其包装类型. Definitions: int是原始类型, ...

  3. Django中模型（三）

    Django中模型(三) 四.模型成员 1.类属性 objects:是Manager类的一个对象,作用是与数据库进行交互. 定义模型类时,没有定义管理器,则默认创建名为objects的管理器. 2.自 ...

  4. Odoo权限控制

    转载请注明原文地址:https://www.cnblogs.com/cnodoo/p/9278734.html 一:Odoo中的权限设置主要有以下5种 1)菜单.报表的访问权限 Odoo可以设置菜单项 ...

  5. Vue系列——在vue项目中使用echarts

    该示例使用 vue-cli 脚手架搭建 安装echarts依赖 npm install echarts -S 或者使用国内的淘宝镜像安装 npm install -g cnpm --registry= ...

  6. android之View组件的XML属性集合

    XML属性 相关方法 说明 android:alpha setAlpha(float) 设置该组件的透明度 android:background setBackgroundResource(int) ...

  7. POJ 1050 To the Max 最大子矩阵和（二维的最大字段和）

    传送门: http://poj.org/problem?id=1050 To the Max Time Limit: 1000MS   Memory Limit: 10000K Total Submi ...

  8. 【.net开发者自学java系列】使用Eclipse开发SpringMVC（1）

    第一篇随笔,有点紧张.有错别字是正常的.... 好了,自我描述下.我是一个有几年.net开发经验的老菜鸟.是的,老菜鸟.别跟我讨论底层,别跟我讨论协议.TMD啥都不会. 为什么要学JAVA,我也不想, ...

  9. Objective-C 之深拷贝和浅拷贝

    3月箴言 人的思想是了不起的,只要专注于某一项事业,就一定会做出使自己感到吃惊的成绩来.—— 马克·吐温 1.iOS中关于深拷贝和浅拷贝的概念 浅拷贝:浅拷贝并不拷贝对象本身,只是对指向对象的指针进行 ...

  10. ionic3 监听软键盘的高度

    ionic1 和普通cordova的大家都知道 就是看ionic3 和4 https://blog.csdn.net/sean_css/article/details/70243893 ionic c ...