c# - 如何在WPF中不挂应用程序绘制1216个 Canvas 元素

Question

我正在开发一个应用程序，我想添加一些很酷的图标。因为我使用的是漂亮的 MahApps 库，所以我想在 MahApps.Metro/MahApps.Metro.Resources/Icons.xaml 中的图标上有一个视觉效果，所以我做了一些字符串操作来获取 x:Key每个的一部分 <Canvas x:Key="appbar_3d_3ds" Width="76" Height="76" Clip="F1 M 0,0L 76,0L 76,76L 0,76L 0,0">线。简而言之，我所做的所有字符串操作最终都得到了以下内容的 1216 个副本:

<controls:Tile
Title="appbar_zune" Count="1215" Grid.Row="121" Grid.Column="15" TiltFactor="2" Width="1*" Height="1*"  VerticalAlignment="Stretch" HorizontalAlignment="Stretch">
<Rectangle Margin="0" Fill="{Binding RelativeSource={RelativeSource AncestorType=Button}, Path=Foreground}">
<Rectangle.OpacityMask>
<VisualBrush Stretch="Fill"
Visual="{StaticResource appbar_zune}" />
</Rectangle.OpacityMask>
</Rectangle>
</controls:Tile>

注意 <control:Tile的每个副本具有适当的属性 Count , Grid.Row和 Grid.Column正确设置。

但是，我总是以 Application not responding 结束。窗口消息。现在正如我所说的，我的动机只是为了获得漂亮图标集合的视觉效果，而不是导致应用程序崩溃。我只是想知道是否有一种方法可以在不使任何人的计算机崩溃的情况下显示如此庞大的集合(注意:系统的 RAM 非常低:我的一台测试机器在 virtualbox 中运行)。

Answer 1

首先，使您的 Fill 绑定(bind)具有 Mode=OneWay。我敢打赌你不需要它是 TwoWay，它可能是你设置中的默认值。双向绑定(bind)的成本要高得多。

其次，考虑使用更严苛的版本:Mode=OneTime。由于图标不太可能更改，因此您根本不需要任何更改跟踪。这将为您节省更多资源。

就您而言，First+Second 可能不会给您带来巨大的提升，但值得尝试和记住。

三、你的VisualBrush怎么样？是吗？他们是否都使用相同的 Visual="{StaticResource appbar_zune}" ?那你为什么要创建数千个实例？不要复制粘贴，只需创建一个实例并使所有项目都使用该实例。您可以节省大量时间和内存。

第四，也是最重要的，通常也是最大的加速，是 - 你有 吨 项。我敢打赌你有一些滚动，水平或垂直。但是您如何生成和显示这些项目呢？一次创建它们是 .. 浪费。它们不适合所有屏幕，对吗？

你有一些 ItemsControl 可以生成那一千个项目吗？调查ItemsPanel ItemsControl 的属性并打开 virtualizing该面板上的选项。这将导致它链接到滚动条，并且它将开始仅动态创建屏幕上的项目并销毁移出屏幕的项目。好吧，我把它简化了，但可以说它是这样工作的。请注意像 ListBox 这样的容器(和许多其他人)也是一个 ItemsControl，所以它也适用于这里。

或者，也许您有巨大的显式 XAML 文件，其中一些 StackPanel 中包含一千个控件。没有 ItemsControl？这不是很明智。但是哦，好吧..你仍然可以打开virtualization在那个 StackPanel 上。

如果您有几十个以上的项目，打开虚拟化通常是一个好主意。通常，您必须拥有一百个，如果您达到数千个甚至更多，则必须这样做。然而，虚拟化成本:它经常重置/重新初始化项目。如果您的 ItemTemplate 真的很复杂，虚拟化可能会导致滚动变得“锯齿/滞后”，我不知道如何用英语表达，抱歉。合成线程可能根本没有足够的时间来重新计算和重新布局所有快速移动的项目。如果您遇到该问题，请尝试设置 Height项目的一个不变的真正固定的常数值。它对加快布局有很大帮助。但如果您的 ItemTemplate 真的非常复杂，它也可能无济于事。在这种死胡同的情况下，您唯一的选择是...重新设计并简化项目模板。

编辑:

当然，如果您没有滚动条并且试图一次显示大量项目，那么所有这些都不会为您带来任何好处。在这种情况下，努力简化或删除绑定(bind)、模板、组件嵌套(有时手动计算位置比使用三个嵌入式网格更好)，use rendering cache或 (...).. 抱歉，我开始猜测太多，选择太多。

编辑:

我刚注意到 Width="1*"和 Stretch ，因此您可能在顶部有一个 Grid，而不是 StackPanel。由于您希望它们大小相同，UniformGrid可能会有更好的表现。此外，通过一些工作，您也可以向网格添加虚拟化:

从 4.5 开始，它更容易 - article: WPF 4.5 new virtualizing features

下面，它需要更多的工作，请参阅 Dan Crevier 的 4 部分系列博客:

一:http://blogs.msdn.com/dancre/archive/2006/02/06/implementing-a-virtualized-panel-in-wpf-avalon.aspx

二:http://blogs.msdn.com/dancre/archive/2006/02/13/531550.aspx

三:http://blogs.msdn.com/dancre/archive/2006/02/14/532333.aspx

四:http://blogs.msdn.com/dancre/archive/2006/02/16/implementing-a-virtualizingpanel-part-4-the-goods.aspx
如果虚拟化网格还不够，请尝试移至 Canvas 并手动强制设置一些宽度/高度/位置。删除自动布局有时可以节省很多。然后，您可以使用 VirtualizedCanvas如果你真的把固定大小的元素放在那里，你可能会尽快得到它。但这是最后的选择。前面提到的事情应该运作良好。

哦，还有关于虚拟化的最后一句话:请记住，当 ScrollView 在虚拟化模式下工作时， Position不再以像素/点计算。 v模式下，滚动条的Position计入 items ，即 position=2.5 表示滚动条位于第三个项目的中途(通过了 2 个项目，还有半个)，而不是在 pos=2.5“像素”处。

旁注:“百万点 Canvas ”: https://blogs.msdn.microsoft.com/kaelr/2010/08/11/zoomableapplication2-a-million-items/