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去比对,如果相同 ...
随机推荐
- PowerPoint无法正常加载MathType的解决方法
MathType是一款十分便捷的数学公式编辑器,可以和很多办公软件和网站兼容使用,我们日常用的比较多的也就是Office和WPS,更具体的说是Word\Excel\PPT等等一系列办公常用软件. 不过 ...
- 自定义 JSTLFunction
复习常用JSTL Function为什么需要自定义Function如何自定义Function,例子:1.在独立的项目中(也可以在web项目中)的类中(比如Functions)编写一个static方法: ...
- C++-codeblocks安装
2020-02-15 "Test_leetcode - Debug": The compiler's setup (GNU GCC Compiler) is invalid, so ...
- JZOJ【NOIP2012模拟8.9】2020.10.5 T1
逐个击破 题目 Description 三大战役的平津战场上,傅作义集团在以北平.天津为中心,东起唐山西至张家口的铁路线上摆起子一字长蛇阵,并企图在溃败时从海上南逃或向西逃窜.为了就地歼敌不让其逃走, ...
- Spring Cloud 学习 (四) Hystrix & Hystrix Dashboard & Turbine
在复杂的分布式系统中,可能有几十个服务相互依赖,这些服务由于某些原因,例如机房的不可靠性.网络服务商的不可靠性等,导致某个服务不可用 . 如果系统不隔离该不可用的服务,可能会导致整个系统不可用.Hys ...
- python模块wifi使用小记
安装命令 pip install wifi 连接命令 sudo wifi connect --add-hoc ssid,使用该命令会修改/etc/network/interfaces配置文件,导致启动 ...
- Linux之centos包管理【rpm】、【yum】、【tar】
rpm包是二进制格式,无需编译安装便可使用,tar包是源码格式,需要编译安装才可使用 rpm包管理: rpm:redhat package manager,红帽的包管理器,其主要的操作参数有如下: - ...
- 记一次MySQL出现Waiting for table metadata lock的原因、排查过程与解决方法
任务背景:将sql文件通过shell直接导入到mysql中执行(还原) bug表现:导入后java项目卡死 过程: 1.网上乱搜一通,无意间看到一篇文章,这篇文章说明了如何开启mysql的genera ...
- 【Docker】 CentOS7 安装 Docker 及其使用方法 ( 一 )
系列目录: [Docker] CentOS7 安装 Docker 及其使用方法 ( 一 ) [Docker] 使用Docker 在阿里云 Centos7 部署 MySQL 和 Redis (二) [D ...
- 【软件测试部署基础】gradle的认识
1. gradle简介 Java世界中主要有三大构建工具:Ant.Maven和Gradle.经过几年的发展,Ant几乎销声匿迹.Maven也日薄西山,而Gradle的发展则如日中天. 1.1. ANT ...