ControlTemplate:外观定制

<Window.Resources>
<ControlTemplate x:Key="CheckBoxControlTemplate" TargetType="CheckBox">
<StackPanel>
<Rectangle Name="breakRectangle" Stroke="Red" StrokeThickness="2" Width="20" Height="20">
<Rectangle.Fill>
<!--默认Rectangle填充色为White-->
<SolidColorBrush Color="White"></SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<!--ContentPresenter 保留原控件属性-->
<ContentPresenter Margin="{TemplateBinding Padding}"></ContentPresenter>
</StackPanel>
</ControlTemplate>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<CheckBox Content="我是普通CheckBox"></CheckBox>
<CheckBox Grid.Row="1" Template="{StaticResource CheckBoxControlTemplate}" Content="我是模板CheckBox"></CheckBox>
<CheckBox Grid.Row="2" Template="{StaticResource CheckBoxControlTemplate}" Content="我是模板CheckBox,我跟上一个模板的区别在于Padding" Padding="15"></CheckBox>
</Grid>

Tips

<ContentPresenter Margin="{TemplateBinding Padding}"/>

ContentPresenter 保留原控件属性
TemplateBinding Padding,即绑定每个CheckBox自己的Margin,更灵活

效果

 

此时,点击Rectangle是没有效果的

ControlTemplate中使用触发器

<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="breakRectangle" Property="Fill" Value="Coral"></Setter>
</Trigger>
</ControlTemplate.Triggers>

Setter可以选择TargetName,即一个控件的触发器可以修改另一个控件的属性

效果

 
 

使用Brush

Brush一类画笔,需定义为对象才能使用
可以使用颜色、图片等等

<Window.Resources>
<ControlTemplate x:Key="CheckBoxControlTemplate" TargetType="CheckBox">
<ControlTemplate.Resources>
<!--颜色-->
<SolidColorBrush x:Key="ColorBrush" Color="Pink"></SolidColorBrush>
<!--图片-->
<ImageBrush x:Key="ImageBrush" ImageSource="Images/cat.jpg"></ImageBrush>
</ControlTemplate.Resources>
<StackPanel>
<Rectangle Name="breakRectangle" Stroke="OrangeRed" StrokeThickness="2" Width="100" Height="100">
<Rectangle.Fill>
<!--默认Rectangle填充色为White-->
<SolidColorBrush Color="White"></SolidColorBrush>
</Rectangle.Fill>
</Rectangle>
<!--ContentPresenter 保留原控件属性-->
<ContentPresenter Margin="{TemplateBinding Padding}"></ContentPresenter>
</StackPanel>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="breakRectangle" Property="Fill" Value="{StaticResource ImageBrush}"></Setter>
</Trigger>
<Trigger Property="IsChecked" Value="False">
<Setter TargetName="breakRectangle" Property="Fill" Value="{StaticResource ColorBrush}"></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Window.Resources>
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="0.5*"></RowDefinition>
<RowDefinition Height="0.5*"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<Label Grid.Row="0" Content="没有选中时,CheckBox填充色为Pink"></Label>
<Label Grid.Row="1" Content="选中时,CheckBox填充为猫猫的图片"></Label>
<CheckBox Grid.Row="2" Template="{StaticResource CheckBoxControlTemplate}" Content="我是模板CheckBox"></CheckBox>
</Grid>

效果

 
 
 

可以对比在Style中嵌套Template的写法

https://github.com/zLulus/NotePractice/tree/dev3/WPF/WpfDemo/Template/StyleUseTemplate

其他例子

<Window.Resources>
<ControlTemplate x:Key="CheckBoxControlTemplate" TargetType="{x:Type CheckBox}">
<Grid>
<TextBlock x:Name="textBlock1" HorizontalAlignment="Left" Margin="116,39,0,0" TextWrapping="Wrap" Text="TextBlock" VerticalAlignment="Top"/>
<ContentPresenter/>
</Grid>
<ControlTemplate.Triggers>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="textBlock1" Property="Text" Value="CheckBox is checked."></Setter>
</Trigger>
<Trigger Property="IsChecked" Value="False">
<Setter TargetName="textBlock1" Property="Text" Value="CheckBox is not checked."></Setter>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Window.Resources>
<Grid>
<CheckBox Template="{StaticResource CheckBoxControlTemplate}" x:Name="checkBox1" Content="CheckBox" HorizontalAlignment="Left" Margin="137,59,0,0" VerticalAlignment="Top"></CheckBox>
</Grid>

对非内置属性的修改,用模板
用style识别不了textBlock1
直接写CheckBox 的Triggers识别不了IsChecked

示例代码

https://github.com/zLulus/NotePractice/tree/dev3/WPF/WpfDemo/Template/ControlTemplate

ControlTemplate的更多相关文章

  1. 背水一战 Windows 10 (6) - 控件 UI: 字体的自动继承的特性, Style, ControlTemplate

    [源码下载] 背水一战 Windows 10 (6) - 控件 UI: 字体的自动继承的特性, Style, ControlTemplate 作者:webabcd 介绍背水一战 Windows 10 ...

  2. 控件 UI: 字体的自动继承的特性, Style, ControlTemplate

    字体的自动继承的特性 Style 样式 ControlTemplate 控件模板 示例1.演示字体的自动继承的特性Controls/UI/FontInherit.xaml <Page x:Cla ...

  3. WPF:在ControlTemplate中使用TemplateBinding

    A bit on TemplateBinding and how to use it inside a ControlTemplate. Introductio Today I'll try to w ...

  4. WPF中ControlTemplate和DataTemplate的区别

    下面代码很好的解释了它们之间的区别: <Window x:Class="WPFTestMe.Window12" xmlns="http://schemas.micr ...

  5. 从0 开始 WPF MVVM 企业级框架实现与说明 ---- 第四讲 WPF中 ControlTemplate

    上讲我们介绍了DataTemplate,现在我们就介绍下ControlTemplate,可能后面大多在编码时候会出现一些英文,工作习惯,请见谅. ControlTemplate: 控件的外观,也就是控 ...

  6. Controltemplate datatemplate

    DataTemplate ControlTemplate we can search many posts about this topic. some valuable link: DataTemp ...

  7. DataTemplate和ControlTemplate联系与区别

    ---恢复内容开始--- 正如标题中的两个拼接的单词所说,DataTemplate就是数据显示的模板,而ControlTemplate是控件自身的模板.(个人理解,错误请指出,谢谢) 我们看这二者在两 ...

  8. DataTemplate和ControlTemplate的关系

    DataTemplate和ControlTemplate的关系(转载自haiziguo) 一.ContentControl中的DataTemplate 在开始之前,我们先去看一下ContentCont ...

  9. 访问ControlTemplate内部的元素

    需要用到code behind 注意要给需要访问的元素命名x:Name="PART_TextBlock" <ResourceDictionary xmlns="ht ...

  10. WPF中的ControlTemplate(控件模板)(转)

    原文地址 http://www.cnblogs.com/zhouyinhui/archive/2007/03/28/690993.html WPF中的ControlTemplate(控件模板)     ...

随机推荐

  1. 驱动程序调试方法之printk——printk的原理与直接使用

    1.基本原理 (1)在UBOOT里设置console=ttySAC0或者console=tty1 这里是设置控制终端,tySAC0 表示串口, tty1 表示lcd(2)内核用printk打印 内核就 ...

  2. XML输出到浏览器报错

    在使用Firefox浏览器测试我编写的xml文件时,遇到如下错误:我的xml源代码如下: <?xml version="1.0" encoding="UTF-8&q ...

  3. Java工具类:给程序增加版权信息

       我们九天鸟的p2p网贷系统,基本算是开发完成了.   现在,想给后端的Java代码,增加版权信息.   手动去copy-paste,太没有技术含量. 于是,写了个Java工具类,给Java源文件 ...

  4. Android自己定义控件2-简单的写字板控件

    概述 上一篇文章我们对自己定义控件进行了一个大体的知识介绍. 今天就来学习自己定义一个简单的写字板控件. 先来看看效果图 就是简单的依据手指写下的轨迹去画出内容 实现 在上一篇文章里提到了androi ...

  5. [Grid Layout] Specify a grid gutter size with grid-gap

    It’s beautifully straightforward to add a gutter to our grid layout. Let’s apply one with grid-gap.

  6. js进阶 11-8 jquery如何获取元素相对于父元素的位置

    js进阶 11-8  jquery如何获取元素相对于父元素的位置 一.总结 一句话总结:用jquery的position方法,但是使用这个方法的前提是父元素相对定位,子元素绝对定位,否则和offset ...

  7. vs 错误提示及解决方案

    错误: 应输入";" 错误原因,宏展开出现错误:

  8. 网络异常与SQL Server事务

    SQL Server事务遭遇网络异常时的处理机制浅析 SQL Server数据库中,如果应用程序正在执行一个事务的时候突然遭遇了网络异常,例如网络掉包,网络中断等,那么这个事务会怎么样? SQL Se ...

  9. 使用搜狐Sendcloud的Webapi发送邮件:Jodd和Apache Httpclient

    最近,在使用搜狐Sendcloud发邮件.    Sendcloud提供http格式的webapi,方便地发送邮件,当然是要付费的. 很早之前,http工具一直用Httpclient,后来觉得jodd ...

  10. mui常用功能链接地址

    1.下拉刷新mui.pullToRefresh插件http://ask.dcloud.net.cn/article/12152.打包app权限列表http://ask.dcloud.net.cn/ar ...