UWP ListView添加不同样式
先看效果:
使用ListView的ItemTemplateSelector
<ListView
IsItemClickEnabled="True"
ItemContainerStyle="{StaticResource ListViewItemStyle1}"
ItemTemplateSelector="{StaticResource HomeTemplateSelector}"
ItemsSource="{x:Bind HomeTab.NewsList}"
SelectionMode="None" />
1、定义一个 HomeTemplateSelector继承DataTemplateSelector,
并定义两个数据模板AdTemplate,NewsTemplate,代码如下
1 public class HomeDataTemplateSelector : DataTemplateSelector
2 {
3
4 public DataTemplate AdTemplate { get; set; }
5 public DataTemplate NewsTemplate { get; set; }
6
7 protected override DataTemplate SelectTemplateCore(object item, DependencyObject container)
8 {
9 var bean = item as ItemData;
10 if (1 == bean.ItemType)
11 {
12 return AdTemplate;
13 }
14 else if (2 == bean.ItemType)
15 {
16 return NewsTemplate;
17 }
18 return NewsTemplate;
19 }
20 }
2、定义一个ItemData的基类,添加ItemType字段,区分不同类型的项数据,代码如下
1 public class ItemData : ObservableObject
2 {
3 public string ItemTitle { get; set; }
4 public int ItemType { get; set; }
5 }
3、添加数据
namespace Demo.UWP.ViewModels
{
public class HomeViewModel : MyViewModel
{
public string Title { get; set; }
public ObservableCollection<ItemData> NewsList { get; set; } public HomeViewModel()
{
NewsList = new ObservableCollection<ItemData>
{
new AdBean() {Title = "aaa", ImgUrl = "ms-appx:///Assets/Main/8b59cca11a991187fcb2c1bd71b3345c220639.png", ItemType = 1},
new AdBean() {Title = "aaa", ImgUrl = "ms-appx:///Assets/Main/8b59cca11a991187fcb2c1bd71b3345c220639.png", ItemType = 1},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用", Price = "¥328", ItemType = 2},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用,建议6-7人使用,建议6-7人使用", Price = "¥328", ItemType = 2},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用", Price = "¥328", ItemType = 2},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用", Price = "¥328", ItemType = 2},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用", Price = "¥328", ItemType = 2},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用", Price = "¥328", ItemType = 2},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用", Price = "¥328", ItemType = 2},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用", Price = "¥328", ItemType = 2},
new NewsBean() {Title = "东北小厨", SubTitle = "[丰庄]午市套餐C,建议6-7人使用", Price = "¥328", ItemType = 2}
}; } public override string ToString()
{
return "首页";
}
}
}
<Page.Resources>
<ResourceDictionary>
<DataTemplate x:Key="AdTemplate" x:DataType="bean:AdBean">
<local:AdItemView />
</DataTemplate>
<DataTemplate x:Key="NewsTemplate" x:DataType="bean:HomeBean">
<local:NewsItemView />
</DataTemplate>
<dataTemplateSelectors:HomeDataTemplateSelector
x:Key="HomeTemplateSelector"
AdTemplate="{StaticResource AdTemplate}"
NewsTemplate="{StaticResource NewsTemplate}" />
</ResourceDictionary>
</Page.Resources>
<Grid>
<ListView
IsItemClickEnabled="True"
ItemContainerStyle="{StaticResource ListViewItemStyle1}"
ItemTemplateSelector="{StaticResource HomeTemplateSelector}"
ItemsSource="{x:Bind HomeTab.NewsList}"
SelectionMode="None" />
</Grid>
转载请标明出处:http://www.cnblogs.com/xiaocaidev/p/7021541.html,本文出自:【xiaocaidev的博客】
UWP ListView添加不同样式的更多相关文章
- UWP ListView添加分割线
先看效果: 我并没有找到有设置ListView分割线的属性 下面是一个比较简单的实现,如果有同学有更好的实现,欢迎留言,让我们共同进步.我的叙述不一定准确 实现的方法就是在DataTemplate里包 ...
- 仿喜马拉雅实现ListView添加头布局和脚布局
ListView添加头布局和脚布局 之前学习喜马拉雅的时候做的一个小Demo,贴出来,供大家学习参考: 如果我们当前的页面有多个接口.多种布局的话,我们一般的选择无非就是1.多布局:2.各种复杂滑动 ...
- 044. asp.net主题之二为主题添加CSS样式和动态加载主题
1. 新建任意一个网站, 默认主页为Default.aspx, 增加一个App_Themes目录, 用于存储主题, 添加一个MyTheme的主题, 在MyTheme主题下添加一个样式表文件, 默认名称 ...
- 8添加一些样式:开始学习CSS
CSS中简单的表达式,成为规则.一个典型的规则包括一个选择符.若干属性和属性值. 1.在XHTML中直接添加CSS样式,必须在<head>元素里添加样式开始和结束标记.(但这未必是最好的方 ...
- class属性中为什会添加非样式的属性值?
来由 在一些插件中经常看到, 在class属性中出现一些跟样式无关的属性值, 这些值在css样式中没有对应定义, 但是在js中会根据这个值来给dom对象添加特殊的行为, 例如: jquery vali ...
- ListView添加项目带序列
ListView添加项目带序列 function AddSelItems(listview1:TListView;ListView2:TListView):Boolean;var s: st ...
- 为ListView添加头和脚
转自:https://software.intel.com/zh-cn/blogs/2014/12/15/android-listview-addheaderview-addfooterview ...
- 自定义listView添加滑动删除功能
今天研究了一下android里面的手势,结合昨天学习的自定义View,做了一个自定义的listview,继承自listView,添加了条目的滑动手势操作,滑动后出现一个删除按钮,点击删除按钮,触发一个 ...
- 怎么给当前点击的a标签添加一个样式(跳转页面后)
怎么给当前点击的a标签添加一个样式(跳转页面后): 方法1. 用cookie记录这个打开的序列号,然后页面在跳转的时候在读出来.方法2. 循环a的链接,然后与location.href去比对,如果相同 ...
随机推荐
- 一文搞懂所有Java集合面试题
Java集合 刚刚经历过秋招,看了大量的面经,顺便将常见的Java集合常考知识点总结了一下,并根据被问到的频率大致做了一个标注.一颗星表示知识点需要了解,被问到的频率不高,面试时起码能说个差不多.两颗 ...
- [NOIP2013][LGOJ P1967]货车运输
Problem Link 题目描述 A国有n座城市,编号从1到n,城市之间有 m 条双向道路.每一条道路对车辆都有重量限制,简称限重.现在有 q 辆货车在运输货物, 司机们想知道每辆车在不超过车辆限重 ...
- java实验作业1
1 //1已知圆的半径为10,求其周长及面积 2 package calsswork3; 3 4 public class test3_1 { 5 //求周长 6 public static doub ...
- framework中的sentinel
引入切面: 切面+sentinel-web-servlet private void initDataSource() { String zkUrl = zaSentinelConfig.getDat ...
- IEEE浮点数标准
IEEE浮点数标准 阅读笔记:Computer System : A Programmmer's Perspective 基本概念 IEEE浮点数标准采用 \[V=(-1)^s\times M\tim ...
- gitlab 文件读取+rce复现 CVE202010977
文件读取实现,首先生成两个project 再任意一个project添加issue,然后描述如下: 学习随笔:使用pyqtConfigure建立信号和槽的连接
老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 在PyQt中,一般信号和槽的连接是通过connect方法建立的,语法如下: connect(slot ...
- 超详细讲解mysql存储过程中的in/out/inout
存储过程 大概定义:用一个别名来描述多个sql语句的执行过程. 最简单 delimiter // create PROCEDURE p1() begin select * from userinfo; ...