原文:uwp开发:数据绑定——值转换器 的简单使用

今天,我在做最近正在开发的“简影”uwp应用时遇到一个问题,其中有个栏目,叫做“画报”,是分组显示一组一组的 图片,每组图片在界面上只显示9个,点击去以后显示该组的所有图片。

其中,Model 如下: 画报类,其中有个属性是图片类集合。

在View界面,通过ListView嵌套绑定GridView

如下:

但是,要求是每项只能显示9张图片,而集合内的数据不止9张,如果这样直接绑定到GridView上,那么会将ImagList里面的所以图片都显示出来,那么,要想每项都显示9张。这时候,该怎么办呢?如果之前没有接触过值转换器,那么想到的肯定是改变Model里面的属性,因为属性是绑定在GridView上的,通过访问器来限制属性,这样做也可以,但是这样就会有一个问题,会对原数据造成影响。那么怎样才能不改变属性的情况下,让界面上得到想要的结果呢?此时,就需要用值转换器了。

定义一个转换类:实现IValueConverter接口,这样,就实现了一个值转换类。在Convert方法里,对我们需要改变的集合作限制,让它只显示前9个。

然后,在View层定义:

<Page.Resources>
<cvt:ImageConverter x:Key=”imgCvt”/>
</Page.Resources>

并引入转换类的命名空间,然后我们通过绑定的Convert属性来绑定转换类。这样,就完成了在界面上每组只显示9张图片,并且不改变属性的效果。

如果有问题,欢迎大家加入uwp开发交流学习群:193148992 。

——IT追梦园

uwp开发:数据绑定——值转换器 的简单使用的更多相关文章

  1. [uwp开发]数据绑定那些事(1)

    现在是msp候选人,是时候写点技术博客来加分了(实则是个人的心得体会). 注:以下都是个人理解,错误在所难免,欢迎批评指正 以前接触过WPF,只会简单的一些操作,现在在逐渐学习UWP(Universa ...

  2. [uwp开发]数据绑定那些事(2)

    接着上一篇来侃. 二.实体到控件之间的绑定 这儿不知道用实体这个词恰不恰当,凑活着理解就行了.他可以是一个类实例,也可以是一个集合. 所以,相应的我们就引入两个Demo,第一个介绍用简单的类作为作为数 ...

  3. UWP开发入门(九)——简单界面的布局技巧及屏幕适应

    嘿嘿嘿,题目比较绕哈.本篇主要讨论一般情况下,页面的布局技巧,怎么将元素的展现尽量做到分辨率无关.基本的思路仍然是尽量少的标定具体的数字,而是用比列来标注各元素占据的空间. 这里我打算用易信的名片页来 ...

  4. 【值转换器】 WPF中Image数据绑定Icon对象

    原文:[值转换器] WPF中Image数据绑定Icon对象        这是原来的代码:        <Image Source="{Binding MenuIcon}" ...

  5. UWP开发之控件:用WebView做聊天框

    目录 说明 WebView存在的价值 使用WebView的几个重要技巧 使用WebView做的聊天框 说明 大家都知道,无论是之前的Winform.WPF还是现在的IOS.Android开发中,都存在 ...

  6. Win10 UWP 开发系列:使用SQLite

    在App开发过程中,肯定需要有一些数据要存储在本地,简单的配置可以序列化后存成文件,比如LocalSettings的方式,或保存在独立存储中.但如果数据多的话,还是需要本地数据库的支持.在UWP开发中 ...

  7. Win 10 UWP开发系列:设置AppBarButton的图标

    在WP8以前,页面最下面的四个小圆按钮是不支持绑定的,WP8.1 RT之后,系统按钮升级成了AppBarButton,并且支持绑定了.在Win10 UWP开发中,按钮的样式发生了变化,外面的圆圈没有了 ...

  8. UWP开发随笔——使用SQLite数据库

    摘要 大多数的app都需要数据存储,在数据存储这方面,强大的windows把app数据分为两种:settings和files,并提供了十分简洁的api,让开发者能够轻松使用.但是在有些场景下,app的 ...

  9. Windows10 UWP开发 - 响应式设计

      Windows10 UWP开发 - 响应式设计 本篇随笔与大家简单讨论一下在开发适配不同分辨率.宽高比的Windows10 Universal App布局时的可行方式与小技巧.经验均从实践中总结, ...

随机推荐

  1. html5中input的type类型有哪些(总结)

    html5中input的type类型有哪些(总结) 一.总结 一句话总结:时间.颜色.(邮件.电话.url).(数字.数字范围).搜索search 二.html5中input的type类型 值 描述 ...

  2. CoreLocation定位

    nCoreLocation   n简介 n在移动互联网时代,移动app能解决用户的很多生活琐事,比如 p导航:去任意陌生的地方 p周边:找餐馆.找酒店.找银行.找电影院 p n在上述应用中,都用到了地 ...

  3. 毕设二:python 爬取京东的商品评论

    # -*- coding: utf-8 -*- # @author: Tele # @Time : 2019/04/14 下午 3:48 # 多线程版 import time import reque ...

  4. reduce 阶段遍历对象添加到ArrayList中的问题

    起初遍历values时直接把对象添加到集合中,后来输出结果和预期不符,debug时发现添加到集合中的对象的值全部是最后一个对象的值,网上百度了下,发现是reduce阶段对象重用的问题,reduce阶段 ...

  5. TensorFlow 实战(一)—— 交叉熵(cross entropy)的定义

    对多分类问题(multi-class),通常使用 cross-entropy 作为 loss function.cross entropy 最早是信息论(information theory)中的概念 ...

  6. 在CSDN博客中添加量子恒道统计功能的做法

    作者:朱金灿 来源:http://blog.csdn.net/clever101 什么是量子恒道统计?量子恒道统计是一套免费的网站流量统计分析系统.致力于为所有个人站长.个人博主.所有网站管理者.第三 ...

  7. git 本地分支关联远程分支

    github上已经有master分支 和dev分支 在本地 git checkout -b dev 新建并切换到本地dev分支 git pull origin dev 本地分支与远程分支相关联 在本地 ...

  8. QImage学习学习

    QImage这个类之前用过,无外乎是加载一个图片文件显示出来,并没有做过多的研究,目前工作中用到了灰度图以及图片的像素操作,重新学习了下,记录记录. 一些基本操作方法 获取图像的首地址: const ...

  9. either you have JavaScript disabled or your browser does not support JavaScript

    作者:朱金灿 来源:http://blog.csdn.net/clever101 在服务器(操作系统为WindowsServer)上部署Hudson平台,使用IE访问:http://localhost ...

  10. Latex 琐碎

    χ(\chi),Ξ(\Xi),ξ(\xi) 0. 加颜色 x2+y2=z2({\color{Red} {x^2+y^2=z^2}}) Magenta, Cyan, Emerald(宝石绿) 1. 斜杠 ...