WPF异步载入图片，附带载入中动画
<div id="cnblogs_post_body">http://images.cnblogs.com/cnblogs_com/Soar1991/201209/201209161902259073.gif最近，在做一个WPF项目。项目中有一个需求，就是以列表的方式显示出项目图片。这些图片有的存在于互联网上，有的存在于本地磁盘。存在本地磁盘的文件好说，主要是存在于网络的图片。因为存在于网络的图片，在载入时需要耗费时间，如果直接给Image控件绑定URI属性的话，会造成界面卡顿。为了提供更好的体验，要求有类似网页中图片载入中的特效。经过两天的研究，我翻看了爱壁纸HD For Windows的源代码（你懂得）。终于完成了这个功能。实现的效果如右图所示：
显示图片列表的，肯定是一个ListBox。通过自定义ListBox的ItemsPanel和ItemTemplate，可以实现ListBox的子项横排，以及设置子项为图片。
在做WPF项目时，我们通常是通过绑定为控件的属性赋值，所以我们要先构造一个数据源并且做一个ViewModel。
数据源，就设定为一个简单的文本文件(list.txt)。每行，一个图片地址。
示例代码如下:
<div style="border-bottom: #cccccc 1px solid; border-left: #cccccc 1px solid; padding-bottom: 5px; background-color: #f5f5f5; padding-left: 5px; padding-right: 5px; border-top: #cccccc 1px solid; border-right: #cccccc 1px solid; padding-top: 5px" class="cnblogs_code"> http://img11.360buyimg.com//n3/g2/M00/06/1D/rBEGEVAkffUIAAAAAAB54F55qh8AABWrQLxLr0AAHn4106.jpgC:\Users\Soar\Pictures\lovewallpaper\18451,106.jpghttp://img12.360buyimg.com//n3/g1/M00/06/1D/rBEGDVAkffQIAAAAAAB0mDavAccAABWrQMCUdwAAHSw197.jpgC:\Users\Soar\Pictures\lovewallpaper\367448,106.jpghttp://img13.360buyimg.com//n3/g2/M00/06/1D/rBEGElAkffIIAAAAAADVR1yd_X0AABWrQKlu2MAANVf537.jpgC:\Users\Soar\Pictures\lovewallpaper\359090,106.jpghttp://img10.360buyimg.com//n3/g5/M02/1C/00/rBEIC1Akfe8IAAAAAABDtsBt3bQAAFeCQAh13kAAEPO445.jpghttp://img11.360buyimg.com//n3/g3/M00/06/1D/rBEGE1AkfgIIAAAAAACfm_MhwRYAABWrQMmK8kAAJ-z240.jpghttp://img12.360buyimg.com//n3/g3/M00/06/1D/rBEGFFAkfhQIAAAAAABHekJE6jQAABWrQOGiEUAAEeS965.jpghttp://img13.360buyimg.com//n3/g2/M00/06/1D/rBEGElAkfegIAAAAAAClvhjSNQoAABWrQJ0KTIAAKXW818.jpghttp://img14.360buyimg.com//n3/g1/M00/06/1D/rBEGDlAkfe4IAAAAAABQsM9eGEoAABWrQJ4WIwAAFDI883.jpghttp://img10.360buyimg.com//n3/g3/M00/06/1D/rBEGE1AkfgQIAAAAAACBZc_HeVAAABWrQM293sAAIF9407.jpghttp://img11.360buyimg.com//n3/g3/M00/06/1D/rBEGE1AkfgkIAAAAAAC_6A3AnhwAABWrQOfht8AAMAA406.jpghttp://img12.360buyimg.com//n3/g5/M02/1C/00/rBEDilAkfeAIAAAAAACdJBYljH0AAFeCQAuIsMAAJ08326.jpghttp://img13.360buyimg.com//n3/g1/M00/06/1D/rBEGDVAkfe4IAAAAAACXzwGDqfoAABWrQKpCmEAAJfn685.jpghttp://img12.360buyimg.com//n3/g3/M00/06/1D/rBEGE1AkfgcIAAAAAAC5nK25hEQAABWrQOCa3sAALm0258.jpghttp://img14.360buyimg.com//n3/g2/M00/06/1D/rBEGEFAkfdUIAAAAAACZblNaX_kAABWrQJ0zwgAAJmG566.jpghttp://img14.360buyimg.com//n3/g2/M00/06/1D/rBEGEFAkfewIAAAAAACfqQVJlNoAABWrQOirGwAAJ_B820.jpghttp://img11.360buyimg.com//n3/g2/M01/06/1D/rBEGEFAkffMIAAAAAACgY4EpzwYAABWrgAfHyIAAKB7880.jpg
页:
[1]