引言:在进行WPF项目开发过程中,由于项目的需要,经常要对某个控件进行特殊的设定,其中就牵涉到模板的相关方面的内容。本文也是在自己进行项目开发过程中遇到控件模板设定时集中搜集资料后整理出来的,以供在以后的项目开发过程中查阅。WPF有控件模板和数据模板,从字面上来看,控件模板主要是用来改变控件的外观,数据模板则定义控件中数据的表现方式。下面让逐一进行介绍。

控件模板ControlTemplate,有两部分:VistualTree视觉树,即是能看到的外观;Trigger触发器,里面包括外部条件达到某一条件下会引起的响应。

参考代码:

<Button Content="Button" Grid.Row="" Height="" HorizontalAlignment="Left" Margin="114,80,0,0" Name="button1" VerticalAlignment="Top" Width="" >
<Button.Template >
<ControlTemplate >
<Grid >
<Ellipse Name="faceEllipse" Height="" Width="" Fill="{TemplateBinding Button.Background}"/>
<TextBlock Name="txtBlock" />
</Grid >
<ControlTemplate.Triggers >
<Trigger Property="Button.IsMouseOver" Value="True">
<Setter Property="Button.Background" Value="blue"/>
</Trigger >
</ControlTemplate.Triggers >
</ControlTemplate >
</Button.Template >
</Button >

  在上面的前台代码中,包含button控件的视觉树和触发器。Grid部分是改变button控件的视觉树部分,意思是将button控件显示部分椭圆,而背景色是控件的原本色调;Triggers部分是当有鼠标在button控件上面是控件的背景色变为蓝色。

为了便于多次利用,可以将其写入模板中,如下:

<Window.Resources >
<ControlTemplate x:Key="buttonTemplate" TargetType="Button" >
<Grid >
<Ellipse Name="faceEllipse" Height="" Width="" Fill="{TemplateBinding Button.Background}"/>
<TextBlock Name="txtBlock" />
</Grid >
<ControlTemplate.Triggers >
<Trigger Property="Button.IsMouseOver" Value="True">
<Setter Property="Button.Background" Value="blue"/>
</Trigger >
</ControlTemplate.Triggers >
</ControlTemplate >
</Window.Resources >

调用时:<Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="216,224,0,0" Name="button3"  Width="75" Template="{StaticResource buttonTemplate}"/>

DataTemplate模板:

参考代码:

<ListBox Height="" HorizontalAlignment="Left" Margin="21,12,0,0" Name="listBox1" VerticalAlignment="Top" Width="" >
<ListBox.ItemTemplate >
<DataTemplate >
<StackPanel Orientation="Horizontal" >
<TextBox Width="" Text="{Binding Path=Name}"/>
<TextBox Width="" Text="{Binding Path=ID}"/>
<TextBox Width="" Text="{Binding Path=Age}"/>
</StackPanel >
</DataTemplate >
</ListBox.ItemTemplate >
</ListBox >

上例是将listbox作为实例来做展示,在一个listbox控件中为了显示多行和多列数据,使用ItemTemplate进行构造。

WPF中的style:style,样式风格的意思,简单来说就是对属性值的批处理,在实际使用过程中帮助非常大。

参考代码:

<Window.Resources >
<ResourceDictionary >
<Style x:Key="dgButton" TargetType="Button" >
<Setter Property="Background" Value="Blue" />
<Setter Property="FontSize" Value=""/>
</Style >
<Style x:Key="cb" TargetType="CheckBox" >
<Style.Triggers >
<Trigger Property="IsChecked" Value="True">
<Setter Property="FontSize" Value=""/>
<Setter Property="Foreground" Value="Red" />
</Trigger >
</Style.Triggers >
</Style >
</ResourceDictionary >
</Window.Resources >

调用方式:

<Button Content="Button" Height="23" HorizontalAlignment="Left" Margin="216,224,0,0" Name="button3" VerticalAlignment="Top" Width="75" Style ="{StaticResource dgbutton}"/>

<CheckBox Content="CheckBox" Height="58" HorizontalAlignment="Left" Margin="654,16,0,0" Name="checkBox1" VerticalAlignment="Top" Width="175" Style="{StaticResource cb}" Grid.Row="1" />

上述代码有两个组成部分:

1 设置button的的背景色和字体大小,说到底也是对button的属性进行批量处理。当然在实际使用button控件时也可单独使用,此处只是便于处理。

2 设置checkbox的触发器,当对check进行选择是,字体和背景色都会做出改变。

总结:在项目开发过程中,经常使用的也就是这些了,如果有更为特殊需求,那就需要另外寻求方案处理了。

add in 2014\9\10

做WPF项目,在界面排版时,往往因为分辨率的不同而导致这样那样的问题,此处添加一个框架,适应于不同的分辨率的开发机。

<DockPanel Name="DockPanel1" LastChildFill="True">
<Viewbox Name="Viewbox1" Stretch="Fill">
<Canvas Height="1080" Name="Canvas1" Width="1920">
<Grid Canvas.Left="0" Canvas.Top="0" Height="1080" Width="1920">

</Grid>
</Canvas>
</Viewbox>
</DockPanel>

虽然简单却非常实用。

add in 2014\11\11

wpf控件引用UI设计好的样式:

<Button Content="Button" Margin="0,8,8,0" VerticalAlignment="Top" Style="{DynamicResource closeButtonStyle}" Height="17.598"  Width="17.598" Click="Button_Click" />

在界面中必需添加引用:

<Window.Resources>
<ResourceDictionary>
<ResourceDictionary.MergedDictionaries>
<ResourceDictionary Source="/StyleLibrary;component/ResourceDictionary.xaml"/>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Window.Resources>

因为界面是window界面,所以是Window.Resource,如果是page则Page.Resources。

如何使引用的其他项目中的控件资源,则应该在App.xaml中添加例如:

<Application.Resources>
<ResourceDictionary >
<ResourceDictionary.MergedDictionaries >
<ResourceDictionary Source="/MonitorStyleLibrary;component/ResourceDictionary1.xaml"></ResourceDictionary>
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>
</Application.Resources>

项目中的控件直接引用资源名称即可:

<Button Content="登录" Height="" Style="{StaticResource logobtn}" HorizontalAlignment="Left" Margin="771,445,0,0" Name="btnLogin" Width="" FontSize="" Click="btnLogin_Click" />

WPF控件模板的更多相关文章

  1. c#字符串加载wpf控件模板代码 - 简书

    原文:c#字符串加载wpf控件模板代码 - 简书 ResourceManager resManagerA = new ResourceManager("cn.qssq666.Properti ...

  2. WPF控件模板(6)

    什么是ControlTemplate? ControlTemplate(控件模板)不仅是用于来定义控件的外观.样式, 还可通过控件模板的触发器(ControlTemplate.Triggers)修改控 ...

  3. 转载 WPF -- 控件模板 (ControlTemplate)(一) https://blog.csdn.net/qq_23018459/article/details/79899838

    ControlTemplate(控件模板)   https://blog.csdn.net/qq_23018459/article/details/79899838 WPF包含数据模板和控件模板,其中 ...

  4. WPF控件模板和数据模板

    来自:http://www.th7.cn/Program/WPF/2011/12/21/51676.shtml ControlTemplate用于描述控件本身. 使用TemplateBinding来绑 ...

  5. WPF控件模板和数据模板 - 醉意人间

    来自:http://www.th7.cn/Program/WPF/2011/12/21/51676.shtml ControlTemplate用于描述控件本身. 使用TemplateBinding来绑 ...

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

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

  7. 《Programming WPF》翻译 第5章 7.控件模板

    原文:<Programming WPF>翻译 第5章 7.控件模板 如果仔细的看我们当前的TTT游戏,会发现Button对象并没有完全为我们工作.哪些TTT面板有内圆角? 图5-14 这里 ...

  8. WPF笔记(1.9 样式和控件模板)——Hello,WPF!

    原文:WPF笔记(1.9 样式和控件模板)--Hello,WPF! 资源的另一个用途是样式设置: <Window >  <Window.Resources>    <St ...

  9. WPF基础篇之控件模板(ControlTemplate)

    WPF中每一个控件都有一个默认的模板,该模板描述了控件的外观以及外观对外界刺激所做出的反应.我们可以自定义一个模板来替换掉控件的默认模板以便打造个性化的控件. 与Style不同,Style只能改变控件 ...

随机推荐

  1. java数组排序问题:array.sort()是从小到大排序,那么如何从大到小排序?

    别告诉我从i=a.length开始打印然后i--!因为数组没变啊,只是打印顺序变了.有木有啥别的方法,除了冒泡插入选择.. nteger [] array=new Integer[]{1,2,3,4, ...

  2. apache日志文件太大的问题

    apache日志文件太大的问题 处理Apache日志的两种方法 rotatelogs 是 Apache 2.2 中自带的管道日志程序 rotatelogs [ -l ] logfile [ rotat ...

  3. js判断时间差

    //var startDate = "2015-09-09"; //var endDate = "2015-09-08"; var startDate = &q ...

  4. linux下搭建SVN服务器完全手册【摘抄】

    系统环境        RHEL5.4最小化安装(关iptables,关selinux) + ssh + yum 一,安装必须的软件包.        yum install subversion ( ...

  5. push to deploy

    1.server端 建立裸仓 $ mkdir ~/repo.git $ cd ~/repo.git $ git init --bare 脚本 $ vim ~/repo.git/hooks/post-r ...

  6. Segmentation

    COMPUTER ORGANIZATION AND ARCHITECTURE DESIGNING FOR PERFORMANCE NINTH EDITION There is another way ...

  7. but this usually doesn’t gain you anything.

    High Performance My SQL, Third Edition Date and Time Types My SQL has many types for various kinds o ...

  8. Byte History

    https://en.wikipedia.org/wiki/Byte The term byte was coined by Werner Buchholz in July 1956, during ...

  9. Off-heap Memory in Apache Flink and the curious JIT compiler

    https://flink.apache.org/news/2015/09/16/off-heap-memory.html   Running data-intensive code in the J ...

  10. spark之combineByKey

    combineByKey def combineByKey[C](createCombiner: (V) => C, mergeValue: (C, V) => C, mergeCombi ...