Force a repaint of a custom drawn UIElement in a custom WPF control

Question

I'm working on a custom WPF control. The main purpose of this control is to visualize thousands of graphical primitives in a scrollable area. The core part of the control's template looks like this:

<Setter Property="Template">
    <Setter.Value>
        <ControlTemplate TargetType="{x:Type local:ItemVisualizer}">
            <Border Background="{TemplateBinding Background}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}">

                <Grid>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="*" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="*" />
                        <ColumnDefinition Width="Auto" />
                    </Grid.ColumnDefinitions>
                    <local:ItemAreaElement Grid.Row="0" Grid.Column="0" x:Name="PART_ItemArea" />
                    <ScrollBar Grid.Row="0" Grid.Column="1" x:Name="PART_ScrollBarVert" Orientation="Vertical" Maximum="100" />
                    <ScrollBar Grid.Row="1" Grid.Column="0" x:Name="PART_ScrollBarHorz" Orientation="Horizontal" Maximum="100" />
                    <Rectangle Grid.Row="1" Grid.Column="1" x:Name="PART_SizeGrip" Focusable="False" Fill="#F0F0F0" />
                </Grid>

            </Border>
        </ControlTemplate>
    </Setter.Value>
</Setter>

The ItemAreaElement is responsible for drawing the items. For simplicity, we can think that its core part looks like this:

class ItemAreaElement : FrameworkElement
{
    protected override void OnRender(DrawingContext drawingContext)
    {
        base.OnRender(drawingContext);

        for (int i = 0; i < _data.ItemCount; i++)
        {
            drawingContext.DrawLine(_penLine, new Point(0, i * 10), new Point(100, i * 10));
        }
    }
}

I need to repaint the ItemAreaElement every time when a related property in the whole ItemVisualizer control changes. However, I didn't find a way to do that in WPF. The well know trick with the Dispatcher object does not work in my case:

private static void OnItemCountPropertyChanged(DependencyObject source,
        DependencyPropertyChangedEventArgs e)
{
    ItemVisualizer vis = (ItemVisualizer)source;
    vis._itemArea.Dispatcher.Invoke(delegate { }, DispatcherPriority.Render);
}

, where _itemArea is a local reference to the ItemAreaElement got in OnApplyTemplate():

public override void OnApplyTemplate()
{
    base.OnApplyTemplate();

    if (this.Template != null)
    {
        _itemArea = this.Template.FindName("PART_ItemArea", this) as ItemAreaElement;
        _itemArea.Grid = this;
    }
}

Are there other ways to force an update of the UIElement in my construction? Or maybe, I need to redesign the whole control to make it possible?

Answer 1

It should usually be sufficient to specify FrameworkPropertyMetadataOptions.AffectsRender on registration of the ItemCount property:

public static readonly DependencyProperty ItemCountProperty =
    DependencyProperty.Register(
        "ItemCount", typeof(int), typeof(ItemVisualizer),
        new FrameworkPropertyMetadata(FrameworkPropertyMetadataOptions.AffectsRender));

---

If that doesn't help, you could force a redraw by calling InvalidVisual() on the ItemAreaElement:

var vis = (ItemVisualizer)source;
vis._itemArea.InvalidVisual();