VisualStateManager 不会恢复到原始状态

Question

以下定义用作 GridView、SelectionMode "Single" 的 ItemContainer 样式。当一个元素被选中时，一个特定的字形变得可见以指示选择。

它适用于 Windows 8.1，但对于 UWP，它接受更改后的状态：Selected 使字形出现，但不会恢复到原始状态（状态 未选择 ），即使 SelectionChanged 事件将旧选择作为已删除的项目，字形也会随着选择的更改而保持不变。

其他状态也存在类似问题（如 Pressed 和 Focused），我只是为了简单起见没有显示完整的 VisualStateManager。

<Style x:Key="MyItemContainerStyle" TargetType="SelectorItem">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="SelectorItem">
                <Border>
                    <Grid>
                        <!--  Layout of the grid  -->
                    </Grid>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup x:Name="SelectionStates">
                            <VisualState x:Name="Unselected" />
                            <VisualState x:Name="SelectedUnfocused">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="SelectingGlyph"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1"
                                                     Duration="0" />
                                </Storyboard>
                            </VisualState>
                            <VisualState x:Name="Selected">
                                <Storyboard>
                                    <DoubleAnimation Storyboard.TargetName="SelectingGlyph"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1"
                                                     Duration="0" />
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

也试过

<VisualState x:Name="Unselected">
    <Storyboard>
        <DoubleAnimation Storyboard.TargetName="SelectingGlyph"
                         Storyboard.TargetProperty="Opacity"
                         To="0"
                         Duration="0" />
    </Storyboard>
</VisualState>

但没有帮助。

Answer 1

根据您发布的代码，您似乎正在使用 Windows 8.1 中定义的 VisualStateGroup and VisualState。但是，在 UWP 中，这些 VisualState 已更改。

在GridViewItem styles and templates中，它列出了控件默认样式中定义的所有VisualState。如您所见，在 UWP 中，没有“SelectionStates”VisualStateGroup，也没有“Unselected”VisualState .所以你的代码在 UWP 中不起作用。

为了解决您的问题，我建议您根据 UWP 中使用的新 GridViewItem styles and templates 重写您的样式。并且在新样式中，“Normal”和“Selected”视觉状态在同一个视觉状态组中。所以你可以在 "Selected" 中显示 "SelectingGlyph" 并在 "Normal" 中隐藏它，例如：

<VisualState x:Name="Normal">
    <Storyboard>
        <DoubleAnimation Storyboard.TargetName="SelectingGlyph"
                         Storyboard.TargetProperty="Opacity"
                         To="0"
                         Duration="0" />
        <PointerUpThemeAnimation Storyboard.TargetName="ContentPresenter" />
    </Storyboard>
</VisualState>
...
<VisualState x:Name="Selected">
    <Storyboard>
        <DoubleAnimation Storyboard.TargetName="SelectingGlyph"
                         Storyboard.TargetProperty="Opacity"
                         To="1"
                         Duration="0" />
        ...
    </Storyboard>
</VisualState>

VisualStateManager 不会恢复到原始状态

VisualStateManager does not revert to original state

xaml

animation

uwp

visualstatemanager

visualstates