WPF之DataTemplateSelector的运用
本文主要记录WPF中DataTemplateSelector的运用,数据模板选择器主要运用在一些项容器中用于根据不同的数据类型选择不同的DataTemplate,以便展示不同的数据。在此以在listbox显示字符串和一个颜色块来说明DataTemplateSelector的运用。
DataTemplateSelector运用的核心是需继承DataTemplateSelector类并重写其DataTemplateSelector方法,在UI上实现不同类型的DataTemplate,并将这不同的DataTemplate赋值给listbox的ItemTemlateSelector。
在一个listbox中显示文本还有颜色块,显示文本和颜色是两种不同的数据类型,实际项目中可以根据需要用不同的class类型设置不同的样式和模板,效果图如下:

以下为代码:
public class DataModel1
{
public string Name { get; set; }
public DataModel1(string name)
{
Name = name;
}
} public class DataModel2
{
public Brush Color { get; set; }
public DataModel2(Brush color)
{
Color = color;
}
} public class DataModel
{
public Object Ob { get; set; }
public string TypeName { get; set; }
} public class ListBoxDataTemplateSelector : DataTemplateSelector
{
public DataTemplate Template1 { get; set; }
public DataTemplate Template2 { get; set; }
public override DataTemplate SelectTemplate(object item, DependencyObject container)
{
Type t = item.GetType();
string typeName = null;
PropertyInfo[] properties = t.GetProperties();
foreach (PropertyInfo pi in properties)
{
if (pi.Name == "TypeName")
{
typeName = pi.GetValue(item, null).ToString();
break;
}
}
switch (typeName)
{
case "txt":
return Template1;
case "color":
return Template2;
default:
return null; }
}
}
Xaml:
Window x:Class="ListBoxExample.MainWindow"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:local="clr-namespace:ListBoxExample"
mc:Ignorable="d" Name="MainWindow1"
Title="MainWindow" Height="350" Width="525">
<Window.Resources>
<ControlTemplate x:Key="Template1">
<TextBlock Text="{Binding Ob.Name}"/>
</ControlTemplate>
<ControlTemplate x:Key="Template2">
<Border Height="30" Width="90" Background="{Binding Ob.Color}"></Border>
</ControlTemplate>
<local:ListBoxDataTemplateSelector x:Key="ListBoxDataTemplateSelector">
<local:ListBoxDataTemplateSelector.Template1>
<DataTemplate>
<ContentControl Template="{StaticResource Template1}"></ContentControl>
</DataTemplate>
</local:ListBoxDataTemplateSelector.Template1>
<local:ListBoxDataTemplateSelector.Template2>
<DataTemplate>
<ContentControl Template="{StaticResource Template2}"></ContentControl>
</DataTemplate>
</local:ListBoxDataTemplateSelector.Template2>
</local:ListBoxDataTemplateSelector>
</Window.Resources>
<Grid Name="grid0" Width="100" Height="200">
<ListBox Name="list0" ItemTemplateSelector="{StaticResource ListBoxDataTemplateSelector}" ItemsSource="{Binding Datas}" > </ListBox>
</Grid>
</Window>
数据的初始化和绑定:
/// <summary>
/// MainWindow.xaml 的交互逻辑
/// </summary>
public partial class MainWindow : Window
{
public MainWindow()
{
InitializeComponent();
var vm = new Vm();
this.DataContext = vm; }
} public class Vm
{
private ObservableCollection<DataModel> _Datas = new ObservableCollection<DataModel>();
public ObservableCollection<DataModel> Datas
{
get { return _Datas; }
set { _Datas = value; }
} public Vm()
{
DataModel a1 = new DataModel { Ob = new DataModel1("This is name1"), TypeName = "txt" };
DataModel a2 = new DataModel { Ob = new DataModel2(Brushes.Red), TypeName = "color" };
DataModel a3 = new DataModel { Ob = new DataModel2(Brushes.Green), TypeName = "color" };
DataModel a4 = new DataModel { Ob = new DataModel1("This is name2"), TypeName = "txt" };
DataModel a5 = new DataModel { Ob = new DataModel2(Brushes.GreenYellow), TypeName = "color" };
_Datas.Add(a1);
_Datas.Add(a2);
_Datas.Add(a3);
_Datas.Add(a4);
_Datas.Add(a5);
}
}
以上是DataTemplateSelector的用法,下一小节将在此基础上增加左键单击,左键双击,右键单击及选中的交互用法。
WPF之DataTemplateSelector的运用的更多相关文章
- WPF:DataTemplateSelector设置控件不同的样式
原文 WPF:DataTemplateSelector设置控件不同的样式 最近想实现这么个东西,一个ListBox, 里面的ListBoxItem可能是文本框.下拉框.日期选择控件等等. 很自然的想到 ...
- WPF中DataTemplateSelector的简单应用
WPF中DataTemplateSelector的简单应用 DataTemplateSelector中文叫数据模板选择器,根据数据模型内的属性值选择不同的数据模板,多用于容器如listbox中,达到同 ...
- WPF之DataTemplateSelector技巧
WPF中如何通过一个属性来控制对象的模板,属性值改变时对象的模板会跟随改变? 两个关键点 1 属性/对象更改通知 方法一:继承INotifyPropertyChanged接口,当属性值更改时需要让 ...
- wpf 模板选择器DataTemplateSelector及动态绑定使用教程
其实也说不上算是教程了,只是把自己学习的代码拿出来分享一下,同时方便以后遇到类似问题的时候翻一下.MSDN里如是说:通常,如果有多个 DataTemplate 可用于同一类型的对象,并且您希望根据每个 ...
- 【转】wpf 模板选择器DataTemplateSelector及动态绑定,DataTemplate.Triggers触发器的使用
通常,如果有多个 DataTemplate 可用于同一类型的对象,并且您希望根据每个数据对象的属性提供自己的逻辑来选择要应用的 DataTemplate,则应创建 DataTemplateSelect ...
- wpf 模板选择器DataTemplateSelector及动态绑定,DataTemplate.Triggers触发器的使用
通常,如果有多个 DataTemplate 可用于同一类型的对象,并且您希望根据每个数据对象的属性提供自己的逻辑来选择要应用的 DataTemplate,则应创建 DataTemplateSelect ...
- WPF 中关于 DataTemplateSelector 类的应用
MSDN的解释: 提供一种根据数据对象和与该数据绑定的元素来选择数据模板 DataTemplate 的方法. 示例代码: <Window x:Class="WpfApplication ...
- WPF DataTemplateSelector的使用
<Window x:Class="CollectionBinding.MainWindow" xmlns="http://schemas.micros ...
- WPF/UWP 模板选择器 DataTemplateSelector
using System; using System.Collections.Generic; using System.Linq; using System.Text; using System.T ...
随机推荐
- 第三章 学习Shader所需的数学基础(1)
1. 笛卡尔坐标系 在游戏中,我们使用的数学大部分都是为了计算位置.距离和角度等变量.而这些就算大部分是在笛卡尔坐标系下进行的. 1.1 二维笛卡尔坐标系 一个二维笛卡尔坐标系包含了两个部分的信息 1 ...
- HTTP/2简介
1.HTTP/2的定义: HTTP/2即超文本传输协议2.0,是HTTP/1.1下一代的协议.是由互联网工程任务组(IETF)的Hypertext Transfer Protocol Bis (htt ...
- NRF52833蓝牙5.1可用于105℃环境温度的Nordic蓝牙5.1 SoC能实现更广泛的并发多协议低功耗蓝牙、mesh和Thread应用
Nordic Semiconductor宣布推出nRF52833先进多协议系统级芯片(SoC),这是其广受欢迎且验证通过的nRF52系列的第五个新成员.nRF52833是一款功耗超低的低功耗蓝牙 (B ...
- Xcode9 gitHub管理代码
https://www.raywenderlich.com/153084/use-git-source-control-xcode-9 首先上一个参考链接 在xcode9 创建工程时勾选git管理.利 ...
- ios-AutoLayout(自动布局代码控制)简单总结
转自:http://blog.sina.com.cn/s/blog_7c336a830102vaht.html 原理:IOS6.0 之后,苹果优化了UI界面的布局方式,提出了自动布局的概念,和之前的a ...
- openlayers5-webpack 入门开发系列一初探篇(附源码下载)
前言 openlayers5-webpack 入门开发系列环境知识点了解: node 安装包下载webpack 打包管理工具需要依赖 node 环境,所以 node 安装包必须安装,上面链接是官网下载 ...
- HDU1529-Casher Emploryment(最最...最经典的差分约束 差分约束-最长路+将环变线)
A supermarket in Tehran is open 24 hours a day every day and needs a number of cashiers to fit its n ...
- java_冒泡排序
public static void main(String[] args){ int[] arr= {321, 43, 45, 76, 8, 6, 9, 1, 3, 63, 43}; for(int ...
- ELK-logstash基本用法
一:logstash介绍 Logstash在elk系统中为数据存储,报表查询和日志解析创建了一个功能强大的管道链.Logstash提供了多种多样的 input,filters,codecs和outpu ...
- JS四种判断数据类型的方法:typeof、instanceof、constructor、Object.prototype.toString.call()
1.typeof 1 console.log(typeof ""); //string 2 console.log(typeof 1); //number 3 console.lo ...