windows phone 8.1 ComboBox在项目数量较多时显示多个项目被选中

windows phone 8.1 ComboBox shows multiple items as selected when number of items are more

当组合框中有更多项目时,组合框将显示列表选择器弹出窗口。如果我 select 第一个并向下滚动,则不止一个项目将显示为 selected。但是 ComboBox 的 SelectedItem 将是我 selected 的那个。我修改了ListPickerFlyout的样式,关闭了ListView的虚拟化。如果我这样做,ListView 将不会保留 SelectedItem。这是 ComboBox 的错误吗?这个问题有解决办法吗

这是我修改的样式

 <DataTemplate x:Key="ListPickerFlyoutPresenterContentTemplate" >
                <ListView VirtualizingStackPanel.VirtualizationMode="Recycling" SelectionMode="Single"   > 
                    <!--<ListView.ItemsPanel>
                        <ItemsPanelTemplate>
                            <VirtualizingStackPanel/>
                        </ItemsPanelTemplate>
                    </ListView.ItemsPanel>-->
                    <ListView.ItemContainerStyle>

                           <Setter Property="Template">
                                <Setter.Value>
                                    <ControlTemplate TargetType="ListViewItem">
                                        <Border x:Name="OuterContainer" RenderTransformOrigin="0.5,0.5">
                                            <VisualStateManager.VisualStateGroups>
                                                <VisualStateGroup x:Name="CommonStates">
                                                    <VisualState x:Name="Normal" />
                                                    <VisualState x:Name="Pressed"/>

                                                    <VisualState x:Name="Disabled"/>
                                                                                                                                                        <VisualStateGroup.Transitions>
                                                        <VisualTransition From="Pressed" To="Normal" />


                                                    </VisualStateGroup.Transitions>
                                                </VisualStateGroup>
                                                <VisualStateGroup x:Name="SelectionStates">
                                                    <VisualState x:Name="Unselected" />
                                                    <VisualState x:Name="Selected">
                                                        <Storyboard>
                                                            <DoubleAnimation Storyboard.TargetName="CheckGlyph" Storyboard.TargetProperty="Opacity" Duration="0" To="1" />
                                                            <DoubleAnimation Storyboard.TargetName="SelectedCheckMark" Storyboard.TargetProperty="Opacity" Duration="0" To="1" />
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="Foreground" Duration="0">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Green" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentBorder" Storyboard.TargetProperty="Background">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListPickerFlyoutPresenterSelectedItemBackgroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                    <VisualState x:Name="SelectedUnfocused">
                                                        <Storyboard>
                                                            <DoubleAnimation Storyboard.TargetName="CheckGlyph" Storyboard.TargetProperty="Opacity" Duration="0" To="1" />
                                                            <DoubleAnimation Storyboard.TargetName="SelectedCheckMark" Storyboard.TargetProperty="Opacity" Duration="0" To="1" />
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="Foreground" Duration="0">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Green" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentBorder" Storyboard.TargetProperty="Background">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListPickerFlyoutPresenterSelectedItemBackgroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>
                                                <VisualStateGroup x:Name="DataVirtualizationStates">
                                                    <VisualState x:Name="DataAvailable" />
                                                    <VisualState x:Name="DataPlaceholder">

                                                    </VisualState>
                                                </VisualStateGroup>
                                                <VisualStateGroup x:Name="MultiSelectStates">
                                                    <VisualState x:Name="NoMultiSelect" />
                                                    <VisualState x:Name="ListMultiSelect">

                                                    </VisualState>
                                                    <VisualState x:Name="GridMultiSelect" />
                                                    <VisualStateGroup.Transitions>
                                                        <VisualTransition From="ListMultiSelect" To="NoMultiSelect" GeneratedDuration="0:0:0.15" />
                                                        <VisualTransition From="NoMultiSelect" To="ListMultiSelect" GeneratedDuration="0:0:0.15" />
                                                    </VisualStateGroup.Transitions>
                                                </VisualStateGroup>
                                                <!--<VisualStateGroup x:Name="HighlightStates">
                                                    <VisualState x:Name="NoHighlight" />
                                                    <VisualState x:Name="Highlighted">
                                                        <Storyboard>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="contentPresenter" Storyboard.TargetProperty="Foreground" Duration="0">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="Red" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentBorder" Storyboard.TargetProperty="Background">
                                                                <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource ListPickerFlyoutPresenterSelectedItemBackgroundThemeBrush}" />
                                                            </ObjectAnimationUsingKeyFrames>
                                                        </Storyboard>
                                                    </VisualState>
                                                </VisualStateGroup>-->
                                            </VisualStateManager.VisualStateGroups>

                                                            <Grid>
                                                                <ContentPresenter x:Name="contentPresenter"
                                        ContentTransitions="{TemplateBinding ContentTransitions}"
                                        ContentTemplate="{TemplateBinding ContentTemplate}"
                                        Content="{TemplateBinding Content}"
                                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                        Margin="{TemplateBinding Padding}"
                                        Style="{ThemeResource FlyoutPickerListViewItemContentPresenterStyle}" />
                                                                 <!--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.--> 
                                                                <TextBlock x:Name="PlaceholderTextBlock"
                                 Opacity="0"
                                 Text="Xg"
                                 Foreground="{x:Null}"
                                 Margin="{TemplateBinding Padding}"
                                 IsHitTestVisible="False"
                                 AutomationProperties.AccessibilityView="Raw"/>
                                                                <Rectangle x:Name="PlaceholderRect"
                                 Visibility="Collapsed"
                                 Fill="{ThemeResource FlyoutBackgroundThemeBrush}"
                                 IsHitTestVisible="False" />
                                                            </Grid>
                                                        </Border>
                                                    </Border>
                                                </Border>
                                                <Border x:Name="SelectedBorder"
                      IsHitTestVisible="False"
                      Opacity="0"
                      BorderBrush="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}"
                      BorderThickness="{ThemeResource GridViewItemMultiselectBorderThickness}">
                                                    <Grid x:Name="SelectedCheckMark"
                      Opacity="0"
                      Height="34"
                      Width="34"
                      HorizontalAlignment="Right"
                      VerticalAlignment="Top">
                                                        <Path x:Name="SelectedEarmark" Data="M0,0 L40,0 L40,40 z"
                        Fill="{ThemeResource ListViewItemSelectedBackgroundThemeBrush}"
                        Stretch="Fill" />
                                                        <Path x:Name="SelectedGlyph"
                        Data="M0,123 L39,93 L124,164 L256,18 L295,49 L124,240 z"
                        Fill="{ThemeResource ListViewItemCheckThemeBrush}"
                        Height="14.5"
                        Stretch="Fill"
                        Width="17"
                        HorizontalAlignment="Right"
                        Margin="0,1,1,0"
                        VerticalAlignment="Top"
                        FlowDirection="LeftToRight" />
                                                    </Grid>
                                                </Border>
                                            </Grid>
                                        </Border>
                                    </ControlTemplate>
                                </Setter.Value>
                            </Setter>
                        </Style>

                    </ListView.ItemContainerStyle>
                    <ListView.Footer>
                        <Border Height="{ThemeResource ListPickerFlyoutFooterThemeHeight}" Width="1" />
                    </ListView.Footer>                     
                </ListView>
            </DataTemplate>

当我 select 一些项目它不会进入 selected 视觉状态,它实际上进入高亮视觉状态,当我关闭虚拟化时,以前的高亮状态不会被保留

问题出在 listviewitems 的虚拟化上(它是控件中的一个错误)。

解决方法是设置listview的itemstackpanel的CacheLength属性

密码是:

<DataTemplate x:Key="ListPickerFlyoutPresenterContentTemplate">
    <ListView ItemContainerStyle="{StaticResource ListPickerFlyoutPresenterItemStyle}">
       <ListView.ItemsPanel>
           <ItemsPanelTemplate>
                <ItemsStackPanel  CacheLength="10" />
            </ItemsPanelTemplate>
        </ListView.ItemsPanel>

        <ListView.Footer>
            <Border Height="{ThemeResource ListPickerFlyoutFooterThemeHeight}"
                    Width="1" />
        </ListView.Footer>
    </ListView>
</DataTemplate>

该解决方案仅在项目实现后的某个时间(几秒)后才删除选择突出显示。

希望解决方案没问题,否则您将不得不覆盖列表视图的 PrepareContainerForItemOverride