WPF Mouseover Trigger Effect для дочерних элементов управления

Question

Допустим, у меня есть этот бит кода:

<Window>
    <Window.Resources>
        <Color x:Key="MyColor"
               A="255"
               R="152"
               G="152"
               B="152" />
        <DropShadowEffect x:Key="MyEffect" 
                          ShadowDepth="0"
                          Color="{StaticResource MyColor}"
                          BlurRadius="10" />
        <Style x:Key="MyGridStyle"
               TargetType="{x:Type Grid}">
            <Setter Property="Height"
                    Value="200" />
            <Setter Property="Width"
                    Value="200" />
            <Style.Resources>
                <Style TargetType="{x:Type TextBlock}">
                    <Setter Property="Width"
                            Value="100" />
                </Style>
                <Style TargetType="{x:Type Image}">
                    <Setter Property="Height"
                            Value="100" />
                    <Setter Property="Width"
                            Value="100" />
                </Style>
            </Style.Resources>
            <Style.Triggers>
                <Trigger Property="IsMouseOver"
                         Value="true">
                    <!-- How do I apply my effect when this grid is hovered over to Image and TextBox, but not the grid itself? -->
                </Trigger>
            </Style.Triggers>
        </Style>
    </Window.Resources>
    <Grid Style="{StaticResource MyGridStyle}">
        <Grid.RowDefinitions>
            <RowDefinition />
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>
        <Image Grid.Row="0"
               Grid.Column="0"
               Source="image.png" />
        <TextBlock Grid.Row="0"
                   Grid.Column="0"
                   Text="Hover Over Me" />
    </Grid>
</Window>

В основном у меня есть стиль, примененный к сетке, который говорит, что любой текстовый блок или изображение внутри него должны быть стилями определенного размера.

Я хочу создать триггер на сетке, который будет применять эффект ко всем текстовым блокам и изображениям в сетке, но не к самой сетке.

Я могу применить триггер непосредственно к текстовому блоку и /или изображения, но тогда эффект происходит только на каждый элемент в отдельности.Мне нужно, чтобы эффект проявился к любому текстовому блоку и / или изображению в сетке, несмотря на то, над каким внутренним дочерним элементом я нахожусь.

Может ли кто-нибудь помочь мне с этим?

Answer 1

Вы можете сделать это наоборот. То есть, добавьте DataTriggers к Image и TextBlock и заставьте их срабатывать на IsMouseOver для предка Grid.

Примечание. Если вы хотите, чтобы этот эффект срабатывал, как только курсор мыши над Grid, вам необходимо установить Background на значение, например Transparent. По умолчанию Background равно null, и это значение не используется при проверке попаданий.

<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

У нас когда-то было аналогичное требование внешнего свечения ТОЛЬКО содержимого строки списка, а не строки в целом.Мы воспользовались помощью этой статьи ... http://drwpf.com/blog/2008/03/25/itemscontrol-i-is-for-item-container.