今天和大家分享一些关于windows phone ui虚拟化和数据虚拟化的一些知识。

也顺便回答我上一篇【LongListSelector 控件 在 wp7 和wp8中的不同之处】里,留下的那个问题,微软为什么推荐使用longlistselector.

如果不是新人,那么对于"虚拟化"这个词应该不陌生。

"虚拟化"简单来说,就是在数据量很大的时候,我们只加载与可视区域(如手机屏幕)相应的少量数据。

我们先来看一下UI虚拟化。

一:Windows phone UI虚拟化

对于wp的ui虚拟化,其实我们并不需要花太多心思,因为系统自带且用的最多的listbox 和longlistselector。

已经是帮我们实现了虚拟化。我们只需要注意别把美好的虚拟化破坏掉就好了。

1.首先,演示一下虚拟化。

MainPageViewMode.cs

public class MainPageViewModel

{

//省略

public MainPageViewModel()

{ //我们模拟1000条商品数据

listProduct = new List<Product>(1000);

for (int i = 0; i < 1000; i++)

{

listProduct.Add(new Product { Id = i, Name = "产品-" + rnd.Next(1000, 10000).ToString(), Category = "" });

} } }

Mainpage.xaml

<DataTemplate x:Key="LBDataTemplate">

<Grid Loaded="Grid_Loaded" d:DesignWidth="411.045" d:DesignHeight="78.209">

<TextBlock HorizontalAlignment="Left" Margin="10,17,0,25" TextWrapping="Wrap" Foreground="Black"

Text="{Binding Name}" Height="36" Width="197" FontSize="30"/>

</Grid>

</DataTemplate>

<ListBox Background="AliceBlue" ItemsSource="{Binding ListProduct}" x:Name="listbox" Grid.Row="1" ItemTemplate="{StaticResource LBDataTemplate}" />

Loaded="Grid_Loaded" 此事件触发说明模板被加载。这里我们用的是ListBox控件

MainPage.cs

MainPageViewModel vm;

public MainPage()

{

InitializeComponent();

vm= new MainPageViewModel();

LayoutRoot.DataContext = vm;

}

private void Grid_Loaded(object sender, RoutedEventArgs e)

{

vm.LoadItemCounter++;//界面上item被渲染的数目

}

我们看到我们绑定的数据源有1000条数据,页面加载后item只渲染了21个。看似是有这样一个规律的 可视区域数目*2+3

随着我们滑动列表,Item也在不断被渲染。

嗯哪,这就是所谓的UI虚拟化了。

2.常见的破坏虚拟化的场景

很多时候,我们在编辑模板的时候,会破坏掉虚拟化。看下面

当我们编辑ListBox的ItemsPanel的时候,工具帮我们自动生成了下面的代码。

<ItemsPanelTemplate x:Key="ItemsPanelTemplate">

<StackPanel/>

</ItemsPanelTemplate>

这时候我们再次运行

WoW ! 这次页面一加载,ListBox就在不停地渲染Item.直至全部!

为什么会产生这种情况?

因为实现listbox的关键是默认的容器 VirtualizingStackPanel 通过工具编辑变成了StackPanel

改回VirtualizingStackPanel

<ItemsPanelTemplate x:Key="ItemsPanelTemplate">

<VirtualizingStackPanel/>

</ItemsPanelTemplate>

呼! 星星又亮了!

好,到这里们我己经掌握了,什么是UI虚拟化,如何避免常见的破坏UI虚拟化的场景。

以及如何判断我们对控件更改后,节操和虚拟化还在不在。

妈妈再也不用担心我们不小心破坏虚拟化了!

下面我们来看一下LonglistSelector

还是上面的例子。我们把<ListBox 换成 <phone:LongListSelector 去掉ItemsPanel="{StaticResource ItemsPanelTemplate}"

还是虚拟化,只不过默认生成的item数不一样了。

那么为什么微软官方推荐我们用longlistselector代替ListBox呢?

我们继续滑动。

看输出!

什么!!!还是31,没反应?!!!

是的,Longlistselector的 DataTemplate得到了复用。我们的item的datatemplate不会再渲染新的了。

打完,收功!

东西有点多,分两篇吧,下一篇是对性能提升更有用处的数据虚拟化。

附件Demo

Windows phone UI虚拟化和数据虚拟化(一)的更多相关文章

  1. Windows phone UI虚拟化和数据虚拟化(二)

    书接上回的Windows phone UI虚拟化和数据虚拟化(一)我们学习了wp的ui虚拟化.今天来和大家分享一下wp的数据虚拟化. 并同时感谢我的同事dgwutao在编写此文时给我的巨大帮助,3ks ...

  2. Silverlight 中datagrid控件-- 通过设置数据虚拟化加速显示

    定义依赖属性作为datagrid的数据源 protected static readonly DependencyProperty ViewLogsProperty = DependencyPrope ...

  3. 基于windows server 2012 的微软桌面虚拟化实战教程

    http://abool.blog.51cto.com/8355508/1587489/ Windows Server2012 中的“远程桌面服务”服务器角色中就提供了允许用户连接到虚拟机.Remot ...

  4. 即兴小探华为开源行业领先大数据虚拟化引擎openLooKeng

    @ 目录 概述 定义 背景 特点 架构 关键技术 应用场景 安装 单台部署 集群部署 命令行接口 连接器 MySQL连接器 ClickHouse连接器 概述 定义 openLooKeng 官网地址 h ...

  5. KVM 介绍(3):I/O 全虚拟化和准虚拟化 [KVM I/O QEMU Full-Virtualizaiton Para-virtualization]

    学习 KVM 的系列文章: (1)介绍和安装 (2)CPU 和 内存虚拟化 (3)I/O QEMU 全虚拟化和准虚拟化(Para-virtulizaiton) (4)I/O PCI/PCIe设备直接分 ...

  6. Windows 7开发:UAC数据重定向 - Win32 Native

    Windows 7开发:UAC数据重定向 - Win32 Native 目标 本动手实验中,您将会学习如何: • 故障排除一个文件重定向 问题 • 使用Process Monitor查找引起问题的根本 ...

  7. 用 Blend 给Windows Phone 应用创建 示例数据

    前言  创建 示例数据(Sample Data) 是提高程序开发效率的一个很有效方法,有了它,我们调UI的时候就不必每次都运行应用,然后在手机上观看页面效果了,配合 “AlignmentGrid.pn ...

  8. Docker概念学习系列之虚拟化(系统虚拟化和容器虚拟化)

    不多说,直接上干货! 虚拟化定义: 虚拟化是一种资源管理技术,是将计算机的各种实体资源,如服务器.网络.内存及存储等,予以抽象.转换后呈现出来,打破实体结构间的不可切割的障碍,使用户可以比原本的配置更 ...

  9. TortoiseGit和msysGit安装及使用笔记(windows下使用上传数据到GitHub)[转]

    TortoiseGit和msysGit安装及使用笔记(windows下使用上传数据到GitHub) Git-1.7.11-preview+GitExtensions244SetupComplete+T ...

随机推荐

  1. 牛客网Java刷题知识点之什么是死锁、死锁产生的4个必要条件、死锁的解除与预防

    不多说,直接上干货! https://www.nowcoder.com/ta/review-java/review?query=&asc=true&order=&page=16 ...

  2. Redis 数据导入导出,redis-dump命令

    安装redis-dump 工具 yum install ruby rubygems ruby-devel# 修改为国内源gem sources --add http://gems.ruby-china ...

  3. gulp-htmlone的BUG弃坑

    之前用项目用gulp-htmlone做最后的js和css内联打包出现各种问题 这次居然遇到打包后的css斜杠变反斜杠的问题 如下:/src/common/images/i_banner.jpg会被改成 ...

  4. PS基础知识学习

    PS学习视频(全) https://ke.qq.com/webcourse/index.html#course_id=28554&term_id=100014572&taid=1349 ...

  5. I/O————字节流

    InputStream字节输入流 OutputStream字节输出流 用于以字节的形式读取和写入数据 下面是使用 字节输入流读取文件字节输出流写入文件 文件可能不存在,所以使用try catch pu ...

  6. this详解,对执行上下文说 Yes

    this 指向多变,很多隐蔽的 bug 都缘于它.与此同时,this 强大灵活,如果能熟练驾驭,就会写出更简洁.优雅的代码. 社区上对于 this 的讲解虽然不少,但缺乏统一梳理. this 相关知识 ...

  7. 一本通 1434:【例题2】Best Cow Fences

    Best Cow Fences 二分答案 + 前缀和 个人认为题意没有表述清楚,本题要求的是满足题意的连续子序列(难度大大降低了有木有). 本题的精度也是非常令人陶醉,请您自行体会吧! #includ ...

  8. Android使用MediaRecorder和Camera实现视频录制及播放功能整理

    转载请注明出处:http://blog.csdn.net/woshizisezise/article/details/51878566 这两天产品经理向我丢来一个新需求,需要在项目里添加一个视频录制的 ...

  9. thinkphp写的登录注册的小demo

    和asp.net类似,一个FormAction对应Form文件夹 demo结构: ‘ 对于项目结构有疑问的: http://www.thinkphp.cn/document/60.html login ...

  10. Struts2标签<s:checkboxlist>回显问题

    Struts2 checkboxlist回显问题中,说明两种方式,第一种方式很普遍,第二种则是个人根据现有资源加上尝试得来的成果,第二种主要是为个人笔记(其中相关知识点不一一介绍). 一.普通方法: ...