WPF:DataTemplateSelector设置控件不同的样式
作者:互联网
最近想实现这么个东西,一个ListBox, 里面的ListBoxItem可能是文本框、下拉框、日期选择控件等等。
很自然的想到了DataTemplateSelector,并且事先定义好各类DataTemplate以显示不同的控件。
先定义好各类资源
Resources <Window.Resources><DataTemplate x:Key="textBox">
<Border BorderBrush="Gray" BorderThickness="1">
<TextBox Text="{Binding CombinedValue}"></TextBox>
</Border>
</DataTemplate>
<DataTemplate x:Key="comboBox">
<Border BorderBrush="Gray" BorderThickness="1">
<ComboBox ItemsSource="{Binding CombinedValue}"></ComboBox>
</Border>
</DataTemplate>
<DataTemplate x:Key="dateTime">
<Border BorderBrush="Gray" BorderThickness="1">
<DatePicker Text="{Binding CombinedValue}" ></DatePicker>
</Border>
</DataTemplate>
</Window.Resources>
然后在ListBox中设置ItemDataTemplateSelector
ListBox <ListBox ItemsSource="{Binding}"><ListBox.ItemTemplateSelector>
<local:DataTypeTemplateSelector TextBoxTemplate="{StaticResource textBox}"
ComboBoxTemplate="{StaticResource comboBox}"
DateTimeTemplate="{StaticResource dateTime}"></local:DataTypeTemplateSelector>
</ListBox.ItemTemplateSelector>
</ListBox>
新建一个类继承DataTemplateSelector
DataTypeTemplateSelector public class DataTypeTemplateSelector:DataTemplateSelector{
public DataTemplate TextBoxTemplate { get; set; }
public DataTemplate ComboBoxTemplate { get; set; }
public DataTemplate DateTimeTemplate { get; set; }
public override DataTemplate SelectTemplate(object item, DependencyObject container)
{
CombinedEntity entity = item as CombinedEntity; //CombinedEnity为绑定数据对象
string typeName = entity.TypeName;
if (typeName == "TextBox")
{
return TextBoxTemplate;
}
if (typeName == "ComboBox")
{
return ComboBoxTemplate;
}
if (typeName == "DateTime")
{
return DateTimeTemplate;
}
return null;
}
}
设置好DataContext,即可运行
Code Behind public partial class CombinedControl : Window{
public List<CombinedEntity> entities;
public CombinedControl()
{
InitializeComponent();
entities = new List<CombinedEntity>()
{
new CombinedEntity{ CombinedValue=new List<string>{"1","2","3"}, TypeName="ComboBox"},
new CombinedEntity{ CombinedValue ="Test", TypeName="TextBox"},
new CombinedEntity{ CombinedValue=DateTime.Now, TypeName="DateTime"}
};
this.DataContext = entities;
}
}
public class CombinedEntity
{
/// <summary>
/// 绑定数据的值
/// </summary>
public object CombinedValue
{
get;
set;
}
/// <summary>
/// 数据的类型
/// </summary>
public string TypeName
{
get;
set;
}
}
如果运行成功,我们可以看到一个下拉框,一个文本框,一个日期选择控件都做为ListBox的子项显示在窗口中。
但是,我发现,在DataTypeTemplateSelector对象的SelectTemplate 方法中,居然需要把item对象转换成我们的绑定数据对象
CombinedEntity entity = item as CombinedEntity; //CombinedEnity为绑定数据对象这意味着前台需要引入后端的业务逻辑,代码的味道相当不好,不过没有关系,我们有强大的反射工具,重构下代码:
SelectTemplate V1 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;
}
}
if (typeName == "TextBox")
{
return TextBoxTemplate;
}
if (typeName == "ComboBox")
{
return ComboBoxTemplate;
}
if (typeName == "DateTime")
{
return DateTimeTemplate;
}
return null;
}
这样,我们就无需引入后端的实体(Model)对象,保证了前端的干净。
运行起来,还是没有问题,仔细看DataTypeTemplateSelector对象的SelectTemplate 方法,还是有点丑陋,这里把CombinedEntity的TypeName属性硬编码,万一TypeName改成ControlName或其他名字,控件则无法按照预期显示。
再次重构,首先修改绑定对象CombinedEntity
CombinedEntity V1 public class CombinedEntity{
/// <summary>
/// 绑定数据的值
/// </summary>
public object CombinedValue
{
get;
set;
}
/// <summary>
/// 显示控件的类型
/// </summary>
public Type ControlType
{
get;
set;
}
}
修改ListBox绑定数据源
Data Context entities = new List<CombinedEntity>(){
new CombinedEntity{ CombinedValue=new List<string>{"1","2","3"}, ControlType = typeof(ComboBox)},
new CombinedEntity{ CombinedValue ="Test", ControlType = typeof(TextBox)},
new CombinedEntity{ CombinedValue=DateTime.Now, ControlType = typeof(DatePicker)}
};
this.DataContext = entities;
最后再次修改DataTypeTemplateSelector对象的SelectTemplate 方法
SelectTemplate V2 public override DataTemplate SelectTemplate(object item, DependencyObject container){
Type t = item.GetType();
Type controlType = null;
PropertyInfo[] properties = t.GetProperties();
foreach (PropertyInfo pi in properties)
{
if (pi.PropertyType == typeof(Type))
{
controlType = (Type)pi.GetValue(item, null);
break;
}
}
if (controlType == typeof(TextBox))
{
return TextBoxTemplate;
}
if (controlType == typeof(ComboBox))
{
return ComboBoxTemplate;
}
if (controlType == typeof(DatePicker))
{
return DateTimeTemplate;
}
return null;
}
这样,要显示不同的控件,在ControlType里面定义即可,然后在XAML添加DataTemplate,在DataTemplateSelector对象中根据不同的ControlType返回不同的DataTemplate,而且实现的方式看上去比较优雅。
转载于:https://www.cnblogs.com/leodrain/archive/2012/08/23/elegant-way-using-datatemplateselector-showing-more-styles.html
标签:控件,return,item,DataTemplate,new,DataTemplateSelector,WPF,public,CombinedEntity 来源: https://blog.csdn.net/weixin_30501857/article/details/98999713