c# - WinRT 中的透明组合框

Question

所以我尝试使用默认的 ComboBox 来显示选项列表。我希望在选择组合框时弹出的上下文菜单的背景是透明的。我找不到执行此操作的属性或样式，而且我也没有找到太多执行此操作的方法。提前致谢!

Answer 1

您需要提取 ComboBox 的当前模板副本使用 Visual Studio 设计器查看或混合并修改 Background Border 的属性(property)命名为“PopupBorder”表示Transparent .默认情况下它使用 {StaticResource ComboBoxPopupBackgroundThemeBrush} .

这是更新的 Style 的副本资源。

<Style
    x:Key="ComboBoxStyle1"
    TargetType="ComboBox">
    <Setter
        Property="Padding"
        Value="8,0" />
    <Setter
        Property="Foreground"
        Value="{StaticResource ComboBoxForegroundThemeBrush}" />
    <Setter
        Property="Background"
        Value="{StaticResource ComboBoxBackgroundThemeBrush}" />
    <Setter
        Property="BorderBrush"
        Value="{StaticResource ComboBoxBorderThemeBrush}" />
    <Setter
        Property="BorderThickness"
        Value="{StaticResource ComboBoxBorderThemeThickness}" />
    <Setter
        Property="TabNavigation"
        Value="Once" />
    <Setter
        Property="ScrollViewer.HorizontalScrollBarVisibility"
        Value="Disabled" />
    <Setter
        Property="ScrollViewer.VerticalScrollBarVisibility"
        Value="Auto" />
    <Setter
        Property="ScrollViewer.HorizontalScrollMode"
        Value="Disabled" />
    <Setter
        Property="ScrollViewer.VerticalScrollMode"
        Value="Auto" />
    <Setter
        Property="ScrollViewer.IsVerticalRailEnabled"
        Value="True" />
    <Setter
        Property="ScrollViewer.IsDeferredScrollingEnabled"
        Value="False" />
    <Setter
        Property="ScrollViewer.BringIntoViewOnFocusChange"
        Value="True" />
    <Setter
        Property="HorizontalContentAlignment"
        Value="Stretch" />
    <Setter
        Property="FontFamily"
        Value="{StaticResource ContentControlThemeFontFamily}" />
    <Setter
        Property="FontSize"
        Value="{StaticResource ControlContentThemeFontSize}" />
    <Setter
        Property="ItemsPanel">
        <Setter.Value>
            <ItemsPanelTemplate>
                <CarouselPanel />
            </ItemsPanelTemplate>
        </Setter.Value>
    </Setter>
    <Setter
        Property="Template">
        <Setter.Value>
            <ControlTemplate
                TargetType="ComboBox">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition
                            Width="*" />
                        <ColumnDefinition
                            Width="32" />
                    </Grid.ColumnDefinitions>
                    <VisualStateManager.VisualStateGroups>
                        <VisualStateGroup
                            x:Name="CommonStates">
                            <VisualState
                                x:Name="Normal" />
                            <VisualState
                                x:Name="PointerOver">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Background"
                                        Storyboard.TargetName="Background">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxPointerOverBackgroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="BorderBrush"
                                        Storyboard.TargetName="Background">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxPointerOverBorderThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Fill"
                                        Storyboard.TargetName="Highlight">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxSelectedPointerOverBackgroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState
                                x:Name="Pressed">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Background"
                                        Storyboard.TargetName="Background">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxPressedBackgroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="BorderBrush"
                                        Storyboard.TargetName="Background">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxPressedBorderThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Foreground"
                                        Storyboard.TargetName="ContentPresenter">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxPressedForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <DoubleAnimation
                                        Duration="0"
                                        To="1"
                                        Storyboard.TargetProperty="Opacity"
                                        Storyboard.TargetName="PressedBackground" />
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Foreground"
                                        Storyboard.TargetName="DropDownGlyph">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxArrowPressedForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState
                                x:Name="Disabled">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Background"
                                        Storyboard.TargetName="Background">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxDisabledBackgroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="BorderBrush"
                                        Storyboard.TargetName="Background">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxDisabledBorderThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Foreground"
                                        Storyboard.TargetName="ContentPresenter">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxDisabledForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Foreground"
                                        Storyboard.TargetName="DropDownGlyph">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxArrowDisabledForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup
                            x:Name="FocusStates">
                            <VisualState
                                x:Name="Focused">
                                <Storyboard>
                                    <DoubleAnimation
                                        Duration="0"
                                        To="1"
                                        Storyboard.TargetProperty="Opacity"
                                        Storyboard.TargetName="HighlightBackground" />
                                    <DoubleAnimation
                                        Duration="0"
                                        To="1"
                                        Storyboard.TargetProperty="Opacity"
                                        Storyboard.TargetName="Highlight" />
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Foreground"
                                        Storyboard.TargetName="ContentPresenter">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxFocusedForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState
                                x:Name="FocusedPressed">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Foreground"
                                        Storyboard.TargetName="ContentPresenter">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxPressedForegroundThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                    <ObjectAnimationUsingKeyFrames
                                        Storyboard.TargetProperty="Fill"
                                        Storyboard.TargetName="Highlight">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0"
                                            Value="{StaticResource ComboBoxPressedHighlightThemeBrush}" />
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                            <VisualState
                                x:Name="Unfocused" />
                            <VisualState
                                x:Name="PointerFocused" />
                            <VisualState
                                x:Name="FocusedDropDown">
                                <Storyboard>
                                    <ObjectAnimationUsingKeyFrames
                                        Duration="0"
                                        Storyboard.TargetProperty="Visibility"
                                        Storyboard.TargetName="PopupBorder">
                                        <DiscreteObjectKeyFrame
                                            KeyTime="0">
                                            <DiscreteObjectKeyFrame.Value>
                                                <Visibility>Visible</Visibility>
                                            </DiscreteObjectKeyFrame.Value>
                                        </DiscreteObjectKeyFrame>
                                    </ObjectAnimationUsingKeyFrames>
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                        <VisualStateGroup
                            x:Name="DropDownStates">
                            <VisualState
                                x:Name="Opened">
                                <Storyboard>
                                    <SplitOpenThemeAnimation
                                        ClosedTargetName="ContentPresenter"
                                        ContentTranslationOffset="0"
                                        ContentTargetName="ScrollViewer"
                                        ClosedLength="{Binding TemplateSettings.DropDownClosedHeight, RelativeSource={RelativeSource Mode=TemplatedParent}}"
                                        OffsetFromCenter="{Binding TemplateSettings.DropDownOffset, RelativeSource={RelativeSource Mode=TemplatedParent}}"
                                        OpenedTargetName="PopupBorder"
                                        OpenedLength="{Binding TemplateSettings.DropDownOpenedHeight, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                                </Storyboard>
                            </VisualState>
                            <VisualState
                                x:Name="Closed">
                                <Storyboard>
                                    <SplitCloseThemeAnimation
                                        ClosedTargetName="ContentPresenter"
                                        ContentTranslationOffset="40"
                                        ContentTranslationDirection="{Binding TemplateSettings.SelectedItemDirection, RelativeSource={RelativeSource Mode=TemplatedParent}}"
                                        ContentTargetName="ScrollViewer"
                                        ClosedLength="{Binding TemplateSettings.DropDownClosedHeight, RelativeSource={RelativeSource Mode=TemplatedParent}}"
                                        OffsetFromCenter="{Binding TemplateSettings.DropDownOffset, RelativeSource={RelativeSource Mode=TemplatedParent}}"
                                        OpenedTargetName="PopupBorder"
                                        OpenedLength="{Binding TemplateSettings.DropDownOpenedHeight, RelativeSource={RelativeSource Mode=TemplatedParent}}" />
                                </Storyboard>
                            </VisualState>
                        </VisualStateGroup>
                    </VisualStateManager.VisualStateGroups>
                    <Border
                        x:Name="Background"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Background="{TemplateBinding Background}"
                        Grid.ColumnSpan="2" />
                    <Rectangle
                        x:Name="PressedBackground"
                        Fill="{StaticResource ComboBoxPressedHighlightThemeBrush}"
                        Margin="{TemplateBinding BorderThickness}"
                        Opacity="0" />
                    <Border
                        x:Name="HighlightBackground"
                        BorderBrush="{StaticResource ComboBoxFocusedBorderThemeBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
                        Background="{StaticResource ComboBoxFocusedBackgroundThemeBrush}"
                        Grid.ColumnSpan="2"
                        Opacity="0" />
                    <Rectangle
                        x:Name="Highlight"
                        Fill="{StaticResource ComboBoxSelectedBackgroundThemeBrush}"
                        Margin="{TemplateBinding BorderThickness}"
                        Opacity="0" />
                    <ContentPresenter
                        x:Name="ContentPresenter"
                        HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                        Margin="{TemplateBinding Padding}"
                        VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
                    <TextBlock
                        x:Name="DropDownGlyph"
                        Grid.Column="1"
                        Foreground="{StaticResource ComboBoxArrowForegroundThemeBrush}"
                        FontWeight="Bold"
                        FontSize="{StaticResource ComboBoxArrowThemeFontSize}"
                        FontFamily="{StaticResource SymbolThemeFontFamily}"
                        HorizontalAlignment="Right"
                        IsHitTestVisible="False"
                        Margin="0,0,6,4"
                        Text="&#xE011;"
                        VerticalAlignment="Center" />
                    <Popup
                        x:Name="Popup">
                        <Border
                            x:Name="PopupBorder"
                            BorderBrush="{StaticResource ComboBoxPopupBorderThemeBrush}"
                            BorderThickness="{StaticResource ComboBoxPopupBorderThemeThickness}"
                            Background="Transparent"
                            HorizontalAlignment="Stretch">
                            <ScrollViewer
                                x:Name="ScrollViewer"
                                BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}"
                                Foreground="{StaticResource ComboBoxPopupForegroundThemeBrush}"
                                HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                                HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                                IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                                IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                                IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
                                VerticalSnapPointsType="OptionalSingle"
                                VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                                VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                                VerticalSnapPointsAlignment="Near"
                                ZoomMode="Disabled">
                                <ItemsPresenter />
                            </ScrollViewer>
                        </Border>
                    </Popup>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>