UWP ComboBoxItem是否為“未選中” VisualState？

Question

UWP ComboBox中的“未選定” VisualState是否等效？ 我們正在從Windows 8遷移，希望有一個相互交叉兼容的解決方案。

我查看了ComboBoxItem的默認樣式，UWP似乎沒有“ 未選中 ”的VisualState。

這是發生的情況的屏幕截圖：

藍色的是已選擇的項目。 由於UWP中沒有“ 未選定的”可視狀態，因此不會取消選定先前選定的項目。

這是我的ComboBoxItem樣式代碼：

<Style x:Key="Style_ComboBox_CheckSelector_ItemContainer" TargetType="ComboBoxItem">
        <Setter Property="TabNavigation" Value="Local" />
        <Setter Property="Padding" Value="8,10" />
        <Setter Property="HorizontalContentAlignment" Value="Left" />
        <Setter Property="VerticalContentAlignment" Value="Center" />
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBoxItem">
                    <Border x:Name="LayoutRoot"
                        Background="{TemplateBinding Background}"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}">
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="0:0:0" />
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="PointerOver">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="Rectangle_Background_OverState"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="Rectangle_DisabledVisualElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="Rectangle_PressedVisualElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="SelectionStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="0:0:0" />
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Unselected" />
                                <VisualState x:Name="Selected">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="ContentPresenter_Selected"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="Rectangle_FocusVisualElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="SelectedUnfocused">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="ContentPresenter_Selected"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="SelectedDisabled">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="ContentPresenter_Selected"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="Rectangle_DisabledVisualElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="SelectedPointerOver">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="ContentPresenter_Selected"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="Rectangle_Background_OverState"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="SelectedPressed">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="ContentPresenter_Selected"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="Rectangle_PressedVisualElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="FocusStates">
                                <VisualStateGroup.Transitions>
                                    <VisualTransition GeneratedDuration="0:0:0" />
                                </VisualStateGroup.Transitions>
                                <VisualState x:Name="Focused">
                                    <Storyboard>
                                        <DoubleAnimation Duration="0"
                                                     Storyboard.TargetName="Rectangle_FocusVisualElement"
                                                     Storyboard.TargetProperty="Opacity"
                                                     To="1" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Unfocused" />
                                <VisualState x:Name="PointerFocused" />
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                        <Grid x:Name="InnerGrid">
                            <Rectangle x:Name="Rectangle_Background_NormalState" Fill="#FF404040" />
                            <Rectangle x:Name="Rectangle_Background_OverState"
                                   Fill="#FF666666"
                                   Opacity="0"
                                   Stroke="#FF999999"
                                   StrokeThickness="1" />
                            <ContentPresenter x:Name="ContentPresenter"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          Content="{TemplateBinding Content}"
                                          ContentTemplate="{TemplateBinding ContentTemplate}"
                                          ContentTransitions="{TemplateBinding ContentTransitions}"
                                          Foreground="#FFCCCCCC" />
                            <ContentPresenter x:Name="ContentPresenter_Selected"
                                          Margin="{TemplateBinding Padding}"
                                          HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                          VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                          Content="{TemplateBinding Content}"
                                          ContentTemplate="{TemplateBinding ContentTemplate}"
                                          ContentTransitions="{TemplateBinding ContentTransitions}"
                                          Foreground="Blue"
                                          Opacity="0" />
                            <Grid x:Name="Grid_ControlOverlayParts" IsHitTestVisible="False">
                                <Rectangle x:Name="Rectangle_PressedVisualElement"
                                       Fill="#33FFFFFF"
                                       Opacity="0" />
                                <Rectangle x:Name="Rectangle_FocusVisualElement"
                                       Opacity="0" />
                                <Rectangle x:Name="Rectangle_DisabledVisualElement"
                                       Fill="#7F1A1A1A"
                                       Opacity="0" />
                            </Grid>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

謝謝！

Answer 1

我不建議在Windows 8 / 8.1和UWP中共享用於同一控件的模板。 大多數控件的實現已發生重大變化，並且它們可能需要不同的模板部分。 為UWP編譯時，適用於Windows 8.1中控件的模板可能無法正常工作。

Windows 8.1和UWP之間的ComboBoxItem控件的可視狀態有所不同。 在Windows 8.1中，它具有一個“ SelectionStates” VisualStateGroup，其中包含“ Selected” VisualState，而在UWP中，“ Selected” VisualState是“ CommonStates” VisualStateGroup的一部分。

您的模板符合Windows 8.1的實現，而不符合UWP的實現。 您將需要有兩個單獨的模板，一個用於Windows 8.1，一個用於UWP。