UWP VisualStateManager PointerOver не работает

Question

Я имитирую поведение Groove Music, которое отображает эффект тени при наведении курсора мыши на обложку альбома (в моем коде это весь DataTemplate). Но мой VisualStateManager, похоже, не работает. Есть идеи? Я реализовал это программно, но я хочу использовать xaml для этого на практике.

---Обновить---

Изменение Stackpanel на Grid по-прежнему не работает.

    <GridView
        Grid.Row="1"
        Margin="10"
        IsItemClickEnabled="True"
        ItemsSource="{x:Bind Albums}">
        <GridView.ItemTemplate>
            <DataTemplate x:DataType="data:GridAlbumView">
                <Grid
                    Width="180"
                    Height="240"
                    Margin="10">
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                        <RowDefinition Height="Auto" />
                    </Grid.RowDefinitions>
                    <controls:DropShadowPanel
                        x:Name="AlbumShadowPanel"
                        VerticalContentAlignment="Top"
                        BlurRadius="15"
                        OffsetX="4"
                        OffsetY="4"
                        ShadowOpacity="0"
                        Color="Black">
                        <Image Source="{x:Bind Cover}" />
                    </controls:DropShadowPanel>
                    <TextBlock
                        Margin="0,5,0,0"
                        Grid.Row="1"
                        FontWeight="SemiBold"
                        MaxLines="2"
                        Text="{x:Bind Name}"
                        TextAlignment="Left"
                        TextWrapping="Wrap"
                        Visibility="{x:Bind Name, Converter={StaticResource AlbumNameVisibilityConverter}}" />
                    <TextBlock
                        Grid.Row="2"
                        FontSize="12"
                        Foreground="Gray"
                        Text="{x:Bind Artist}"
                        TextAlignment="Left" />
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="CommonStates">
                            <VisualState x:Name="PointerOver">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames Storyboard.TargetName="AlbumShadowPanel" Storyboard.TargetProperty="ShadowOpacity">
                                        <DiscreteObjectKeyFrame KeyTime="0" Value="1" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </Grid>
            </DataTemplate>
        </GridView.ItemTemplate>
    </GridView>

Answer 1

Это потому, что StackPanel не является элементом управления. Только элементы управления поддерживают VisualStates. Вы можете просто создать прозрачный элемент управления, который вы помещаете поверх всего (при условии, что вам не нужно взаимодействовать с чем-то внутри элемента управления). Извините, я знаю, что это может сбить с толку.

public class MyOverlayControl : Control
{
    public MyOverlayControl() : base()
    {
        Background = new SolidColorBrush(Colors.Transparent);
        HorizontalAlignment = HorizontalAlignment.Stretch;
        VerticalAlignment = VerticalAlignment.Stretch;
        PointerEntered += (s, e) => VisualStateManager.GoToState(this, nameof(PointerEntered), true);
        PointerExited += (s, e) => VisualStateManager.GoToState(this, nameof(PointerExited), true);
    }
}