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去比对,如果相同 ...
随机推荐
- 【Python】python 入门与进阶
github地址:https://github.com/wangxiao9/basic_python.git
- UIWebView各种加载网页的方式
UIWebView加载网页的方法 最近在使用UIWebView的时候遇到各种不同形式加载网页的方式,总结起来共有三种方式,分别为:使用URL加载,使用HTML源码加载,使用HTML文件加载,各种方法的 ...
- python3基础3
# 匿名函数: bbb = lambda a, b: a + b print(bbb(1,1)) # 函数 def add(a=None, b=None): """ 接收 ...
- Web 常见漏洞
检测到目标URL存在http host头攻击漏洞 描述:为了方便的获得网站域名,开发人员一般依赖于HTTP Host header.例如,在php里用_SERVER["HTTP_HOST&q ...
- [Android systrace系列] systrace入门第一式
转载请注明出处:https://www.cnblogs.com/zzcperf/p/13978915.html Android systrace是分析性能问题最称手的工具之一,可以提供丰富的手机运行信 ...
- 基于 MongoDB 动态字段设计的探索 (二) 聚合操作
业务需求及设计见前文:基于 MongoDB 动态字段设计的探索 根据专业计算各科平均分 (总分.最高分.最低分) public Object avg(String major){ Aggregatio ...
- Javascrip之BOM
重点内容 理解windows对象-BOM核心 控制窗口.框架.弹出窗口 利用location对象中的页面信息 利用navigator对象了解浏览器 BOM:浏览器对象模型[Browner Object ...
- [BJDCTF 2nd]xss之光
[BJDCTF 2nd]xss之光 进入网址之后发现存在.git泄露,将源码下载下来,只有index.php文件 <?php $a = $_GET['yds_is_so_beautiful']; ...
- Syclover 第十次极客大挑战web题题解
这次有空的时候报名参加了一下三叶草的招新比赛,比赛时间是一个月,题目都挺基础挺好玩的,在这里记一下自己的题解同时把自己没有做的题目也跟着writeup做一遍 第一题:cl4y:打比赛前先撸一只猫!: ...
- jmeter使用中的问题
1.响应乱码 step1:指定请求节点下,新建后置控制器"BeanShell PostProcessor" step2:其脚本框中输入以下代码,保存 //获取响应代码Unicode ...