Эффект триггера мыши WPF для дочерних элементов управления
допустим, у меня есть этот кусок кода:
<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>
в основном у меня есть стиль, примененный к сетке, который говорит, что любой TextBlock или изображение в нем должны быть стилями определенного размера.
Я хочу создать триггер на сетке, который заставляет эффект применяться ко всем текстовым блокам и изображениям в сетке, но не к самой сетке.
Я могу применить триггер непосредственно к TextBlock и / или Image, но тогда эффект возникает только для каждого элемента отдельно. Мне нужно, чтобы эффект произошел с любым TextBlock и/или изображением в сетке, несмотря на то, какой внутренний дочерний элемент я завис.
может кто-нибудь помочь мне с этим?
2 ответов
вы можете сделать это наоборот. То есть добавить DataTriggers
to Image
и TextBlock
и сделать их триггер на IsMouseOver
для предка Grid
.
Примечание: Если вы хотите, чтобы этот эффект срабатывал, как только мышь находится над Grid
необходимо указать Background
значение, как Transparent
. По умолчанию Background
is 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>
У нас когда-то было аналогичное требование внешнего свечения только содержимого строки списка, а не строки в целом. Мы воспользовались этой статьей... http://drwpf.com/blog/2008/03/25/itemscontrol-i-is-for-item-container.