Lingering WPF Drop Shadow

Question

I have a drop shadow style for a StackPanel. The content is bound to an ObservableCollection and each item is rendered as an Image. When I remove the last item from the collection, the drop shadow remains, even though the image is no longer there. This only happens with the last item.

What's going on? How do I ensure the shadow is removed too?

        <Style TargetType="StackPanel" x:Key="ShadowedStackPanel">
            <Setter Property="BitmapEffect">
                <Setter.Value>
                    <DropShadowBitmapEffect Color="Black" Direction="50" ShadowDepth="5" Opacity=".65" Softness="1"/>
                </Setter.Value>
            </Setter>
        </Style>


    <ItemsControl x:Name="TilesControl">
        <ItemsControl.ItemsPanel>
            <ItemsPanelTemplate>
                <StackPanel Orientation="Horizontal" Style="{StaticResource ShadowedStackPanel}" />
            </ItemsPanelTemplate>
        </ItemsControl.ItemsPanel>
        <ItemsControl.ItemTemplate>
            <DataTemplate>
                <Image Source="{Binding Path=ImageSource}"/>
            </DataTemplate>
        </ItemsControl.ItemTemplate>
    </ItemsControl>

The codebehind is basically:

public ObservableCollection<TileViewModel> Hand = new ObservableCollection<TileViewModel>();

TilesControl.ItemsSource = Hand;

// populate the collection here

var last = Hand.Last();

Hand.Remove( last );

And this leaves a lingering dropshadow effect.

If I remove any other earlier item in the collection, it redraws everything fine. This only happens if I remove the last item.

If I resize the window, it gets redrawn and fixed... but for whatever reason, it leaves a lingering shadow if I don't.

How do I force the redraw so the shadow goes away? Or avoid the problem in the first place?

Answer 1

You could use the code after removing

TilesControl.Items.Refresh();