本文主要讲ListView等列表可以根据内容不同,使用不同模板的列表模板选择器,DataTemplateSelector。
如果在 UWP 需要定义某些列的显示和其他列不同,或者某些行的显示和其他行不同,那么可以使用 列表模板选择器 来定义自己的列表,让列表中存在不同的显示。
好啦,我们先来说下我们在什么下需要使用,其实就是当我们的数据有多样,或者对数据所在位置有要求,这时需要对不同的数据做不同处理。我分为两个不同的方向来讲,第一个方向是根据数据所在的位置不同,选择不同的显示。第二个方向是根据数据的不同。
根据数据位置
本文告诉大家如何做出下面的控件,可以看到这使用的是 ListView ,但是第一个元素显示和其他的元素不同,看起来就是面包屑导航
需要定义第一个元素和其他元素的代码,于是使用 Path 做出来,因为本文不是说如何使用 Path 所以就不多说,直接写代码。
然后在后台定义一个类 AvmdoicYcxhqxugnSelector
,这个可以用来选择不同的模板,于是对于第一个元素,选择第一个模板,其他的元素选择其他的模板。AvmdoicYcxhqxugnSelector
需要继承DataTemplateSelector
重写方法,通过重写SelectTemplateCore
可以选择不同的DataTemplate
,但是AvmdoicYcxhqxugnSelector
需要两个属性才可以获得这两个DataTemplate
所以代码很简单。
然后就是创建一个 ListView
用来显示元素,还需要一个数据,于是所有的代码就是:
但是这样看起来还是不是我要的,把鼠标放上去,发现出现背景
如何去背景请看win10 UWP ListView
就是把ListViewItem
复制,然后去掉ListViewItemBackgroundPointerOver
和 SelectedBackground
SelectedPointerOverBackground
就好了。实际把很多属性去掉就可以做出比较好的效果,但是选中的修改颜色还需要后台写。这是我修改的 Template 可以直接复制使用。
下面来告诉大家使用不同的数据,如何对不同的数据有特殊显示。
根据不同的数据
例如我们做了一个类,叫做 人,这时我们继承人做出来 男生 和女生,那么男生的属性可能和女生的不同。所以需要对不同的数据有特殊的显示。
假设我们的 人 有个属性叫做名称,而男生有个属性叫身高,女孩有个属性叫年龄,当然女生年龄放出来并不好,不过我也没找到别的。这时需要显示男生的身高和女生的年龄,可以看到这时的 DataTemplate 难以按照不同的数据显示。于是接下来,我就告诉大家如何让列表显示不同的数据。
好啦,我们在ViewModel
放一个ObservableCollection<Human> HumanWord,这时我们发现,在前台不好弄,如何让列表显示男生和女孩,因为他们的属性不同。
这时就需要我们做选择器,这个可以根据我们传入选择模板。
首先我们建立一个类,这个类用于选择需要显示的 DataTemplate
,名称:ListViewDataTemplateSelector
需要继承 DataTemplateSelector
。这个类需要有两个 DataTemplate
一个显示 男生,一个显示女生,其中DataTemplate
会在 xaml 写,不会在 cs 写,因为在这里写难度有些高。
然后我们判断我们是否传进来是男生,如果是就返回 MaleData ,女生就返回女生的DataTemplate
,这时需要 override SelectTemplateCore
。可以看到这个方法重载有两个,如果我们的 ItemsPanel
是 ItemsStackPanel
或 ItemsWrapGrid 我们就需要选择 SelectTemplateCore(Object)
。如果我们的 VirtualizingStackPanel
或其他的WrapGrid
,就是 SelectTemplateCore(Object, DependencyObject)
。请看代码,很简单判断是男生还是女生。
下面就是如何使用这个类,首先需要在 xaml 先写出两个 DataTemplate 。需要注意的是DataTemplate
和选择器都是资源,因为资源的获取是有顺序,所以需要先写DataTemplate
,而且需要给DataTemplate
一个 key 。然后在写ListViewDataTemplateSelector
,把刚才写的DataTemplate
放在ListViewDataTemplateSelector
的属性FemaleData,MaleData 。注意ListViewDataTemplateSelector
也需要key,关于资源的寻找,参见win10 uwp x
无法获得资源
一定要有key,然后在ListViewDataTemplateSelector放在FemaleData,MaleData,注意也要key,随便给个名称都好。
在需要使用的ListView
就可以指定资源,相信大家也知道如何用。
如果使用的数据,传入的列是男生的,那么就会使用MaleData
,于是就可以对不同的数据使用不同的DataTemplate
。上面的例子只是很简单使用两个不同的数据,如果有很多不同的数据,或者数据里,需要按照数据内容,进行自定义的显示,那么使用选择器也是可以做到。
源代码:https://github.com/lindexi/kechengbiao
如果需要所有源代码,请联系我因为现在csdn上传需要审查,总是无法上传
参见:win10 uwp 如何使用DataTemplate
原文链接: http://blog.lindexi.com/post/win10-uwp-%E5%88%97%E8%A1%A8%E6%A8%A1%E6%9D%BF%E9%80%89%E6%8B%A9%E5%99%A8
本作品采用 知识共享署名-非商业性使用-相同方式共享 4.0 国际许可协议 进行许可。
欢迎转载、使用、重新发布,但务必保留文章署名 林德熙 (包含链接: https://blog.lindexi.com ),不得用于商业目的,基于本文修改后的作品务必以相同的许可发布。如有任何疑问,请与我 联系。