How do I get a control in WPF to scale over other controls when applying a render transform?

Question

For the purposes of this question, I have a list box that uses wrap panel as its ItemsPanel, this list box is filled with 200x200 images, when a user's mouse hovers over a box, I scale the render transform by 2x. The problem is the content of the image gets clipped by the images below it, how can I override the Z-Order to the image to prevent this from happening?

Answer 1

Use a Trigger on your item containers !

<ListBox>
    <ListBox.ItemContainerStyle>
        <Style TargetType="{x:Type ListBoxItem}">
            <Style.Triggers>
                <Trigger Property="IsSelected" Value="True">
                    <Setter Property="Panel.ZIndex" Value="10" />
                </Trigger>
            </Style.Triggers>
        </Style>
    </ListBox.ItemContainerStyle>
</ListBox>