WPF Mouseover Trigger Effect for Child Controls

Question

Lets say I have this bit of code:

Answer 1

You can do it the other way around. That is, add DataTriggers to Image and TextBlock and make them trigger on IsMouseOver for the ancestor Grid.

Note: If you want this effect to trigger as soon as the mouse is over the Grid you will need to set Background to a value, like Transparent. By default, the Background is null and this value isn't used in hit testing.

<Style x:Key="MyGridStyle" TargetType="{x:Type Grid}">
    <!--<Setter Property="Background" Value="Transparent"/>-->
    <Setter Property="Height" Value="200" />
    <Setter Property="Width" Value="200" />
    <Style.Resources>
        <Style TargetType="{x:Type TextBlock}">
            <Setter Property="Width" Value="200" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=Grid},
                                               Path=IsMouseOver}" Value="True">
                    <Setter Property="Effect" Value="{StaticResource MyEffect}"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
        <Style TargetType="{x:Type Image}">
            <Setter Property="Height" Value="200" />
            <Setter Property="Width" Value="200" />
            <Style.Triggers>
                <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=Grid},
                                               Path=IsMouseOver}" Value="True">
                    <Setter Property="Effect" Value="{StaticResource MyEffect}"/>
                </DataTrigger>
            </Style.Triggers>
        </Style>
    </Style.Resources>
</Style>

Answer 2

We once had a similar requirement of outer glowing ONLY the content of a row of a list box, not the row overall. We took help of this article... http://drwpf.com/blog/2008/03/25/itemscontrol-i-is-for-item-container.