你知道WPF这三大模板实例运用吗?

508 阅读2分钟

1、介绍

对于Windows桌面端应用开发来讲,WPF以其界面渲染的特殊性,灵活的界面布局而让人津津乐道,因为它能为用户提供更好的交互体验。如何利用WPF开发出让人赏心悦目的界面与功能呢?这里不仅仅只是布局的功劳,很大一部分都在WPF模板的灵活使用,那么这里就来聊一聊WPF的三大模板。

image-20210327004910040.png

2、控件模板ControlTemplate

WPF所有控件都是基于呈现与行为分离的模式,开发人员可以在自己应用场景中根据需要进行不同呈现状态的更改,而不会影响到控件的原始功能行为,能让我们在任意改变控件外观的同时还能保留控件的操作动作,这里其实除了模板的分离还得益于WPF的路由事件(后面有机会再聊,今天就先说模板)。下面以一个控件为例,可以进行不同的模板修改。

这里我们可以直接使用窗口资源,创建一个ControlTemplate对象,呈现结果与代码如下:

image-20210327011336897.png

微信图片_20210331144208.png

微信图片_20210331144208.png

三个按钮根据不同的模板进行不了同的呈现,但是原始功能依然保留,不受任何影响

3、数据模板DataTemplate

数据模板其实是为了解决数据集绑定中数据呈现的问题,它规定了数据集中数据如何布局,一般在数据集控件中使用,比如ItemsControl、ListView、ListBox、DataGrid等,下面还是以一个简单的例子来介绍:

image-20210327012400674.png

微信图片_20210331144208.png

微信图片_20210331144208.png

这里的DataTemplate就规定了绑定到ItemsControl的数据集中的数据如何显示,而且被绑定的值才能显示,没有被绑定的值无法显示

4、容器模板ItemsPanelTemplate

窗口模板也是伴随送数据集合控件一起了,它规定了数据呈现的排列方式,可以通过指定不同的布局控件进行不同的布局显示,比如下面的例子介绍了以UniformGrid方式进行布局的例子

image-20210327012928077.png

微信图片_20210331144208.png

微信图片_20210331144208.png 有时候有人为问我:如何让一个布局控件通过绑定的方式进行子项的动态增删?那么这个问题的奥秘就在上面这个例子中,借助一个数据集合控件,将此控件的容器模板改变成所要动态增删子项的容器就可以,不仅仅是Grid、StackPanel还包括UniformGrid、WrapPanel、DockPanel、Canvas都可以,灵活运用能得到意想不到的效果。

最后展示一个利用自定义容器的方式,进行了一个瀑布流式布局的动态数据呈现:

image-20210327013351341.png

持续关注,后续更新更多免费资源!