DataTemplateSelector可以帮助我们实现动态选择数据绑定的模版,如通过ListView+DataTemplateSelector实现微信朋友圈或聊天列表效果。

Github已有聊天效果图

 
 

喜欢阅读代码请直接移步:https://github.com/nishanil/Xamarin.Forms-Samples/tree/master/DataTemplateSelector


本文通过一个简单的Demo练习DataTemplateSelector的使用。

首先在新建的空项目中添加三个Model类:

 
 

其中BaseModel作基类,表示数据源类型,TitleModelDescribeModel分别是BaseModel的子类表示数据源的不同情况。作为练习BaseModel中仅定义了一个String类型属性Title,TitleModel只是单纯的继承BaseModel,DescribeModel继承BaseModel的同时增加了一个String类型属性Describe。

接下来开始为本文的主角编码,声明一个MyDataTemplateSelector继承DataTemplateSelector

 
 

其中TitleTemplate和DescribeTemplate是我们根据情况定义的两个数据模版,TitleTemplate对应TitleModel,DescribeTemplate对应DescribeModel。

OnSelectTemplate方法是我们必须重写的一个方法,在OnSelectTemplate方法中判断item的类型或某个属性值返回对应的DataTemplate。

接下来主要介绍DataTemplateSelector在Xaml中的使用。

首先在Resources中定义我们需要的两个DataTemplate。

 
 

为了方便用TextCell代替自定义Cell,两个DataTemplate 的Key值方便使用区分分别定义为TitleTemplate和DescribeTemplate,可以定义你自己的任意值。

定义了需要的DataTemplate后再定义我们的MyDataTemplateSelector。并将提前定义好的DataTemplate通过StaticResource赋值给MyDataTemplateSelector的TitleTemplate和DescribeTemplate属性。

 
 

Demo中所有内容都定义在了ContentPage.Resources内,完整定义代码。

 
 

定义ListView时再将我们定义好的MyDataTemplateSelector对象赋值给ListView的ItemTemplate属性

 
 

模拟数据源并绑定到ListView:

 
 

Demo效果图:

 

作者:MayueCif
链接:https://www.jianshu.com/p/a9bdcffa50c9
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。

 
------------------------------------------------------------------------------------------------------------------------------

 

DataTemplateSelector介绍的更多相关文章

  1. CSS3 background-image背景图片相关介绍

    这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...

  2. MySQL高级知识- MySQL的架构介绍

    [TOC] 1.MySQL 简介 概述 MySQL是一个关系型数据库管理系统,由瑞典MySQL AB公司开发,目前属于Oracle公司. MySQL是一种关联数据库管理系统,将数据保存在不同的表中,而 ...

  3. Windows Server 2012 NIC Teaming介绍及注意事项

    Windows Server 2012 NIC Teaming介绍及注意事项 转载自:http://www.it165.net/os/html/201303/4799.html Windows Ser ...

  4. Linux下服务器端开发流程及相关工具介绍(C++)

    去年刚毕业来公司后,做为新人,发现很多东西都没有文档,各种工具和地址都是口口相传的,而且很多时候都是不知道有哪些工具可以使用,所以当时就想把自己接触到的这些东西记录下来,为后来者提供参考,相当于一个路 ...

  5. JavaScript var关键字、变量的状态、异常处理、命名规范等介绍

    本篇主要介绍var关键字.变量的undefined和null状态.异常处理.命名规范. 目录 1. var 关键字:介绍var关键字的使用. 2. 变量的状态:介绍变量的未定义.已定义未赋值.已定义已 ...

  6. HTML DOM 介绍

    本篇主要介绍DOM内容.DOM 节点.节点属性以及获取HTML元素的方法. 目录 1. 介绍 DOM:介绍DOM,以及对DOM分类和功能的说明. 2. DOM 节点:介绍DOM节点分类和节点层次. 3 ...

  7. HTML 事件(一) 事件的介绍

    本篇主要介绍HTML中的事件知识:事件相关术语.DOM事件规范.事件对象. 其他事件文章 1. HTML 事件(一) 事件的介绍 2. HTML 事件(二) 事件的注册与注销 3. HTML 事件(三 ...

  8. HTML5 介绍

    本篇主要介绍HTML5规范的内容和页面上的架构变动. 目录 1. HTML5介绍 1.1 介绍 1.2 内容 1.3 浏览器支持情况 2. 创建HTML5页面 2.1 <!DOCTYPE> ...

  9. ExtJS 4.2 介绍

    本篇介绍ExtJS相关知识,是以ExtJS4.2.1版本为基础进行说明,包括:ExtJS的特点.MVC模式.4.2.1GPL版本资源的下载和说明以及4种主题的演示. 目录 1. 介绍 1.1 说明 1 ...

随机推荐

  1. 关于 IPv6 国家有大动作啦!快来瞅瞅行动计划都说了什么~

    随着进入三伏天开始,杭州就像突然被丢上了炭火炉,没有空调的高温厕所,彻底断绝了二狗子带薪摸鱼的快乐.深感绝望的二狗子只能痛苦地把自己的摸鱼地点改成了空调大开的零食角."哎,真的很不喜欢零食角 ...

  2. asp网页防止乱码

    <%@LANGUAGE="VBSCRIPT" CODEPAGE="65001"%> <%Session.CodePage=65001%> ...

  3. LeetCode解题记录(双指针专题)

    1. 算法解释 双指针主要用于遍历数组,两个指针指向不同的元素,从而协同完成任务.也可以延伸到多个数组的多个指针. 若两个指针指向同一数组,遍历方向相同且不会相交,则也称为滑动窗口(两个指针包围的区域 ...

  4. matlab——线性规划

    @ 目录 前言 一.基本概念 二.matlab实现 1.常用函数 2.常见变形 参考书目 前言 线性规划是数学规划中的一个重要分支,常用于解决如何利用现有资源来安排生产,以取得最大经济效益的问题.本文 ...

  5. IDEA工具-自动导包去除星号(import xx.xx.*)

    打开设置>Editor>Code Style>Java>Scheme Default>Imports 设置导入类数值阈值,默认同包类是超过5个变成*,静态导入超过3个变成 ...

  6. ubuntu平台下,字符集的转换命令iconv

    iconv命令格式 iconv -f 源字符集(要转换文件的字符集) -t 目标字符集  file iconv -f gb18030 -t utf-8 file 默认情况下,不改变原文件,输出到屏幕. ...

  7. 算法leetcode二分算法

    二分算法通常用于有序序列中查找元素: 有序序列中是否存在满足某条件的元素: 有序序列中第一个满足某条件的元素的位置: 有序序列中最后一个满足某条件的元素的位置. 思路很简单,细节是魔鬼. 一.有序序列 ...

  8. mybatis-4-Mapper映射文件

    Mapper映射文件 映射文件的Mapper标签包含标签 1.CDUS增删改查 2.参数处理 (1)直接传入参数 单个参数 //传入当个参数 public Employee getEmployeeBy ...

  9. Halcon——图像增强算子以及分类

    摘要 图像增强就是指通过某种图像处理方法对退化的某些图像特征,如边缘.轮廓.对比度等进行处理,以改善图像的视觉效果,提高图像的清晰度,或是突出图像中的某些"有用",压缩其他&quo ...

  10. Scanner的基本语法及用法

    一.Scanner对象 基本语法中并没有实现程序和人的交互,但是Java给我们提供了一个这样的工具类,我们可以获取用户的输入.java.util.Scanner是Java5的新特征,我们可以通过Sca ...