UWP - VisualStates SelectionStates "Selected and Unselected“不适用于ListviewItem样式。

Question

我正在开发UWP Win10 VS2015应用程序，并在ListviewItem样式中使用VisualStates。我在FocusStates中有动画/故事板，它工作得很好，但问题是当我们单击列表视图外部时，我们失去了焦点，然后动画就结束了。

实际上，我需要在选定的visualstate上启动动画，并在未选择的可视化状态上结束动画。动画工作良好，但只在PointerOver，PointerPressed，PointerFocused，非聚焦等，但我需要它在选定和未选定的视觉状态。

当我单击ListviewItem时，颜色带向右展开，当我单击另一项时，先前聚焦的ListviewItem的颜色带被折叠，当前聚焦的颜色带被展开。我已经这样做了，它在FocusStates visualstate (PointerFocus/un聚焦)上工作得很好，但问题是，当我甚至单击Listview外部时，颜色带就会崩溃，因为它失去了焦点，而非焦点可视化状态triggered...but则需要在所选的/未选择的可视化状态下使用，这样即使我们在Listview项目之外单击，也不会出现LostFocus，直到我单击另一个listview项目。请帮帮忙。

彩色带的故事板和所有的Visualstates都在样式代码中。正如我上面所说的，这个代码和动画与给定的样式代码很好地工作，但是如果我删除了FocusStates .它对SelectionStates不起作用..。我需要它在SelectionStates上。

Answer 1

样式用于列表视图自定义选定状态和未选定状态。

<Style x:Key="ListViewItemStyle1" TargetType="ListViewItem">
            <Setter Property="FontFamily" Value="{ThemeResource ContentControlThemeFontFamily}"/>
            <Setter Property="FontSize" Value="{ThemeResource ControlContentThemeFontSize}"/>
            <Setter Property="Background" Value="Transparent"/>
            <Setter Property="Foreground" Value="{ThemeResource SystemControlForegroundBaseHighBrush}"/>
            <Setter Property="TabNavigation" Value="Local"/>
            <Setter Property="IsHoldingEnabled" Value="True"/>
            <Setter Property="Padding" Value="12,0,12,0"/>
            <Setter Property="HorizontalContentAlignment" Value="Left"/>
            <Setter Property="VerticalContentAlignment" Value="Center"/>
            <Setter Property="MinWidth" Value="{ThemeResource ListViewItemMinWidth}"/>
            <Setter Property="MinHeight" Value="{ThemeResource ListViewItemMinHeight}"/>
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="ListViewItem">
                        <Grid x:Name="ContentBorder"
              Background="{TemplateBinding Background}"
              BorderBrush="{TemplateBinding BorderBrush}"
              BorderThickness="{TemplateBinding BorderThickness}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CustomStates">
                                    <VisualState x:Name="Unselected">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0:0:0.3" From="60" To="1" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="colorBand" EnableDependentAnimation="True">
                                                <DoubleAnimation.EasingFunction>
                                                    <QuadraticEase EasingMode="EaseOut"/>
                                                </DoubleAnimation.EasingFunction>
                                            </DoubleAnimation>
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="CustomSelected">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0:0:0.3" From="1" To="60" Storyboard.TargetProperty="(UIElement.RenderTransform).(CompositeTransform.ScaleX)" Storyboard.TargetName="colorBand" EnableDependentAnimation="True">
                                                <DoubleAnimation.EasingFunction>
                                                    <QuadraticEase EasingMode="EaseOut"/>
                                                </DoubleAnimation.EasingFunction>
                                            </DoubleAnimation>
                                        </Storyboard>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal">
                                    </VisualState>
                                    <VisualState x:Name="PointerOver">
                                    </VisualState>
                                    <VisualState x:Name="Pressed">
                                    </VisualState>
                                    <VisualState x:Name="Selected">
                                    </VisualState>
                                    <VisualState x:Name="PressedSelected">
                                    </VisualState>
                                </VisualStateGroup>

                            </VisualStateManager.VisualStateGroups>
                            <Border x:Name="colorBand" 
                                    Background="Red"                                    

                                    HorizontalAlignment="Left"
                                    Width="15" 
                                    Height="20" 
                                    RenderTransformOrigin="0.5,0.5">
                                <Border.RenderTransform>
                                    <CompositeTransform/>
                                </Border.RenderTransform>
                            </Border>
                            <!--<Rectangle x:Name="BorderBackground"
                    IsHitTestVisible="False"
                    Fill="{ThemeResource SystemControlHighlightListAccentLowBrush}"
                    Opacity="0"
                    Control.IsTemplateFocusTarget="True"/>-->
                            <Grid x:Name="ContentPresenterGrid"
              Background="Transparent"
              Margin="0,0,0,0">
                                <Grid.RenderTransform>
                                    <TranslateTransform x:Name="ContentPresenterTranslateTransform"/>
                                </Grid.RenderTransform>
                                <ContentPresenter x:Name="ContentPresenter"
                            ContentTransitions="{TemplateBinding ContentTransitions}"
                            ContentTemplate="{TemplateBinding ContentTemplate}"
                            Content="{TemplateBinding Content}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                            Margin="{TemplateBinding Padding}"/>
                            </Grid>
                            <!-- The 'Xg' text simulates the amount of space one line of text will occupy.
                          In the DataPlaceholder state, the Content is not loaded yet so we
                          approximate the size of the item using placeholder text. -->

                        </Grid>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

代码背后

private void ListView_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            if (e.AddedItems != null)
            {
                foreach (var item in e.AddedItems)
                {
                    Debug.WriteLine(item);
                    ListViewItem litem = (sender as ListView).ContainerFromItem(item) as ListViewItem;
                    if (litem != null)
                    {
                        VisualStateManager.GoToState(litem, "CustomSelected", true);
                    }
                }
            }
            if (e.RemovedItems != null)
            {
                foreach (var item in e.RemovedItems)
                {
                    ListViewItem litem = (sender as ListView).ContainerFromItem(item) as ListViewItem;
                    if (litem != null)
                    {
                        VisualStateManager.GoToState(litem, "Unselected", true);
                    }
                }
            }

        }

Answer 2

如果您已经实现了RemovedItems，那么似乎ISelectionInfo是空的。在这种情况下，您应该将删除的项保存在DeselectRange中，然后在SelectionChanged中访问它(在DeselectRange之后调用)。

如果您没有上面讨论过的自定义可视状态，那么您将使用VisualStateManager.GoToState(lvi，"Normal"，true)。这将从ListViewItem (lvi)中删除突出显示。

这似乎是ListView中的一个bug。在单击ListViewItem之外的另一个控件，然后在ListView中选择一个新条目后，它不会检查选定的ListView的选择状态。