c# - 在 ItemsControl 中使用 GeometryDrawing

Question

在我的 WPF 应用程序中，我使用了包含 PointCollection 的类的 ObservableCollection。此点集合用于为可观察集合中的每个项目绘制多边形。下面的代码展示了我如何使用模板绑定(bind)来绘制所有多边形:

<Grid>
<ItemsControl ItemsSource="{Binding GeoLines}">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <Canvas />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>

        <ItemsControl.ItemTemplate>
            <DataTemplate DataType="{x:Type vm:GeoPointsViewModel}">
                <Polygon Stroke="LightSkyBlue" StrokeThickness="0.5" Opacity="0.8">                      
                    <Polygon.Style>
                        <Style TargetType="{x:Type Polygon}">
                            <Setter Property="Points">
                                <Setter.Value>
                                    <MultiBinding Converter="{StaticResource pointMultiConverter}">
                                        <Binding Path="ActualWidth" RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type Canvas}}"/>
                                        <Binding Path="ActualHeight" RelativeSource="{RelativeSource FindAncestor, AncestorType={x:Type Canvas}}"/>
                                        <Binding Path="Points"/>
                                    </MultiBinding>
                                </Setter.Value>
                            </Setter>
                            <Setter Property="Fill" Value="#FF0A0A10"/>                                
                        </Style>
                    </Polygon.Style>
                </Polygon>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>
</Grid>

虽然它工作得很好，但性能并不好，因为每个多边形都是一个带有所有附加功能的 UIElement。为了提高性能，我想使用占用空间较小的 GeometryDrawing。不幸的是，我不知道在那种情况下如何进行数据绑定(bind)。所以，我的问题是如何使用 GeometryDrawing(或任何比 Shapes 更轻量级的东西)实现代码。

Answer 1

我不确定使用 GeometryDrawing 是否可以显着提高性能，但您可以通过以下方式实现它。结果可能与您想要的不完全一样，这是因为 PathFigure 的默认 StartPoint:

<DataTemplate DataType="{x:Type vm:GeoPointsViewModel}">
   <Border>
      <Border.Background>
         <DrawingBrush>
                <DrawingBrush.Drawing>
                    <GeometryDrawing Brush="Red">
                        <GeometryDrawing.Geometry>
                            <PathGeometry>
                                <PathFigure IsClosed="True">
                                    <PolyLineSegment Points="{Binding Points}"/>
                                </PathFigure>
                            </PathGeometry>
                        </GeometryDrawing.Geometry>
                    </GeometryDrawing>
                </DrawingBrush.Drawing>
          </DrawingBrush>
      </Border.Background>
   </Border>
</DataTemplate>

我为折线使用了一个简单的 Red 笔刷。如果需要，您还可以指定一些 Pen。请注意，多边形的效果可能看起来与您的原始代码产生的效果不完全一样。我想您可能需要进行更多调整才能使其正确。