windows phone 8.1组合框显示多个项目，当项目数量更多时选择 [英] windows phone 8.1 ComboBox shows multiple items as selected when number of items are more
本文介绍了windows phone 8.1组合框显示多个项目，当项目数量更多时选择的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！
问题描述
当组合框中有更多项目时，组合框将显示listpicker弹出窗口。如果我选择第一个并向下滚动，则多个项目将显示为选定的。但SelectedItem的ComboBox将是我选择的那个。我修改了ListPickerFlyout的风格，并关闭了ListView的虚拟化。如果我这样做ListView不会保留SelectedItem。这是ComboBox的错误？
<$ c $ c>< DataTemplate x：Key =ListPickerFlyoutPresenterContentTemplate>
< ListView VirtualizingStackPanel.VirtualizationMode =RecyclingSelectionMode =Single>
<！ - < ListView.ItemsPanel>
< ItemsPanelTemplate>
< VirtualizingStackPanel />
< / ItemsPanelTemplate>
< /ListView.ItemsPanel> - >
< ListView.ItemContainerStyle>
< Setter Property =Template>
< Setter.Value>
< ControlTemplate TargetType =ListViewItem>
< Border x：Name =OuterContainerRenderTransformOrigin =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 =PressedTo =Normal/>
< /VisualStateGroup.Transitions>
< / VisualStateGroup>
< VisualStateGroup x：Name =SelectionStates>
< VisualState x：Name =Unselected/>
< VisualState x：Name =Selected>
< Storyboard>
< DoubleAnimation Storyboard.TargetName =CheckGlyphStoryboard.TargetProperty =OpacityDuration =0To =1/>
< DoubleAnimation Storyboard.TargetName =SelectedCheckMarkStoryboard.TargetProperty =OpacityDuration =0To =1/>
< ObjectAnimationUsingKeyFrames Storyboard.TargetName =contentPresenterStoryboard.TargetProperty =ForegroundDuration =0>
< DiscreteObjectKeyFrame KeyTime =0Value =Green/>
< / ObjectAnimationUsingKeyFrames>
< ObjectAnimationUsingKeyFrames Storyboard.TargetName =ContentBorderStoryboard.TargetProperty =Background>
< DiscreteObjectKeyFrame KeyTime =0Value ={ThemeResource ListPickerFlyoutPresenterSelectedItemBackgroundThemeBrush}/>
< / ObjectAnimationUsingKeyFrames>
< / storyboard>
< / VisualState>
< VisualState x：Name =SelectedUnfocused>
< Storyboard>
< DoubleAnimation Storyboard.TargetName =CheckGlyphStoryboard.TargetProperty =OpacityDuration =0To =1/>
< DoubleAnimation Storyboard.TargetName =SelectedCheckMarkStoryboard.TargetProperty =OpacityDuration =0To =1/>
< ObjectAnimationUsingKeyFrames Storyboard.TargetName =contentPresenterStoryboard.TargetProperty =ForegroundDuration =0>
< DiscreteObjectKeyFrame KeyTime =0Value =Green/>
< / ObjectAnimationUsingKeyFrames>
< ObjectAnimationUsingKeyFrames Storyboard.TargetName =ContentBorderStoryboard.TargetProperty =Background>
< DiscreteObjectKeyFrame KeyTime =0Value ={ThemeResource ListPickerFlyoutPresenterSelectedItemBackgroundThemeBrush}/>
< / ObjectAnimationUsingKeyFrames>
< / storyboard>
< / VisualState>
< / VisualStateGroup>
< VisualStateGroup x：Name =DataVirtualizationStates>
< VisualState x：Name =DataAvailable/>
< VisualState x：Name =DataPlaceholder>
< / VisualState>
< / VisualStateGroup>
< VisualStateGroup x：Name =MultiSelect States>
< VisualState x：Name =NoMultiSelect/>
< VisualState x：Name =ListMultiSelect>
< / VisualState>
< VisualState x：Name =GridMultiSelect/>
< VisualStateGroup.Transitions>
< VisualTransition From =ListMultiSelectTo =NoMultiSelectGeneratedDuration =0：0：0.15/>
< VisualTransition From =NoMultiSelectTo =ListMultiSelectGeneratedDuration =0：0：0.15/>
< /VisualStateGroup.Transitions>
< / VisualStateGroup>
<！ - < VisualStateGroup x：Name =HighlightStates>
< VisualState x：Name =NoHighlight/>
< VisualState x：Name =Highlighted>
< Storyboard>
< ObjectAnimationUsingKeyFrames Storyboard.TargetName =contentPresenterStoryboard.TargetProperty =ForegroundDuration =0>
< DiscreteObjectKeyFrame KeyTime =0Value =Red/>
< / ObjectAnimationUsingKeyFrames>
< ObjectAnimationUsingKeyFrames Storyboard.TargetName =ContentBorderStoryboard.TargetProperty =Background>
< DiscreteObjectKeyFrame KeyTime =0Value ={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}/> ;
<！ - 'Xg'文本模拟一行文本占据的空间量。
在DataPlaceholder状态下，内容尚未加载，所以我们
使用占位符文本近似项目的大小.-->
< TextBlock x：Name =PlaceholderTextBlock
Opacity =0
Text =Xg
Foreground ={x：Null}
={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 =
VerticalAlignment =Top>
< Path x：Name =SelectedEarmarkData =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 = 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>
当我选择一些项目时，它不会进入选定的视觉状态，当我关闭虚拟化之前的高亮状态不会保留
解决方案
问题是虚拟化listviewitems控制）。
解决方法是设置 CacheLength 属性的listview的itemsstackpanel。
代码是：
< 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>
只有在实现项目后，解决方案才会在某个时间p>
希望解决方案很好，否则你必须重写 PrepareContainerForItemOverride 列表视图
When there are more items in combobox,combobox will show the listpicker flyout. If I select first one and scroll down,more than one item will be shown as selected. But SelectedItem of ComboBox will be the one which i selected. I modified the style of ListPickerFlyout and turned off the virtualization of ListView. If I do so ListView wont retain the SelectedItem. Is this bug of ComboBox? Is there any solution for this issue
Here is style which i modified
<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>
When i select some item it wont go to selected visual state,It actually goes to Highlighted visual state and when i off the virtualization previous Highlighted state wont be retained
解决方案
The problem is with the virtualization of listviewitems(its a bug in the control).
The solution to this is to set the CacheLength property of the listview's itemsstackpanel.
The code is:
<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>
The solution removes the selction highlight after sometime(few seconds) only after the item is realized.
Hope the solution is fine else you'll have to override the PrepareContainerForItemOverride of the listview
这篇关于windows phone 8.1组合框显示多个项目，当项目数量更多时选择的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
查看全文
