CODEWITHSUNDEEP
c#wpfcanvasitemscontrol
gerstla
gerstla

Reputation: 597

Drawing thousands of rectangles in WPF

I need to draw many rectangles(~50000). Currently I'm using the following approach. 

<ItemsControl ItemsSource="{Binding Elements}" IsHitTestVisible="False"  Background="Transparent">

    <ItemsControl.ItemsPanel>
        <ItemsPanelTemplate>
            <Canvas IsItemsHost="True"
                    Background="Transparent"
                    Width="500" 
                    Height="500">
            </Canvas>
        </ItemsPanelTemplate>
    </ItemsControl.ItemsPanel>

    <ItemsControl.ItemContainerStyle>
        <Style TargetType="ContentPresenter">
            <Setter Property="Canvas.Left" Value="{Binding X}"/>
            <Setter Property="Canvas.Bottom" Value="{Binding Y}"/>
        </Style>
    </ItemsControl.ItemContainerStyle>

    <ItemsControl.ItemTemplate>
        <DataTemplate DataType="{x:Type models:Element}">
            <Rectangle Width  = "{Binding Width}"
                       Height = "{Binding Height}"
                       Fill= "{Binding Brush}"
                       SnapsToDevicePixels="True" >
            </Rectangle>
        </DataTemplate>
    </ItemsControl.ItemTemplate>

</ItemsControl>

The problem is that it takes a very long time to draw this amount of rectangles. Is there a better way to draw a large amount of shapes?

Upvotes: 4

Views: 1774

Answers (1)

SnowballTwo
SnowballTwo

Reputation: 539

Wpf has a pretty inefficient rendering engine, and 50000 shapes are way too much for it, even without the binding overhead.

Take a short look at this document: WPF rendering system

Instead, consider to use a drawing API such as Direct2D, which is compareably well accessible from WPF: Direct2D with WPF

Upvotes: 3

Related Questions