如何删除 UWP 应用程序中 ComboBox 项目列表顶部和底部设置的边距

Question

在我的 UWP 应用程序中，我使用了 ComboBox 并尝试抑制位于 ComboBox 项目顶部和底部的边距。

通过查看 ComboBox style template，该边距似乎由以下值控制：ComboBoxDropdownContentMargin，设置为 0,7,0,7 .

我为我的 ComboBox 创建了一个新样式，如下所示，但它根本不起作用（我的 ComboBox 消失了）。我尝试了很多其他解决方案，但也没有结果。

<Page.Resources>
    <Style x:Key="ComboBoxStyle1" TargetType="ComboBox">
        <Setter Property="FontSize" Value="12"/>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate>
                    <Grid>
                        <Popup>
                            <Border>
                                <ScrollViewer>
                                    <ItemsPresenter Margin="0,0,0,0"/>
                                </ScrollViewer>
                            </Border>
                        </Popup>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>
</Page.Resources>

我在 UWP/XAML 编码方面还很陌生，所以如果我的问题看起来很荒谬，我深表歉意，但是谁能告诉我如何抑制模板放置的边距。

Answer 1

创建新样式并更改ItemsPresenter是正确的。但是当你覆盖 'Template' setter 时，它会更新整个 setter，上面的代码只留下了 ItemsPresenter 元素，但其他元素都消失了，所以你看不到组合框。完成这个样式，其他保持默认样式不变，就可以了。请更新样式如下：

 <Style x:Key="ComboBoxStyle1" TargetType="ComboBox">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ComboBox">
                    <Grid>
                        <Grid.RowDefinitions>
                            <RowDefinition Height="Auto" />
                            <RowDefinition Height="*" />
                        </Grid.RowDefinitions>
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*" />
                            <ColumnDefinition Width="32" />
                        </Grid.ColumnDefinitions>
                        <ContentPresenter
                            x:Name="HeaderContentPresenter"
                            Margin="{ThemeResource ComboBoxHeaderThemeMargin}"
                            FontWeight="{ThemeResource ComboBoxHeaderThemeFontWeight}"
                            x:DeferLoadStrategy="Lazy"
                            Content="{TemplateBinding Header}"
                            ContentTemplate="{TemplateBinding HeaderTemplate}"
                            FlowDirection="{TemplateBinding FlowDirection}"
                            Visibility="Collapsed" />
                        <Border
                            x:Name="Background"
                            Grid.Row="1"
                            Grid.ColumnSpan="2"
                            Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}" />
                        <Border
                            x:Name="HighlightBackground"
                            Grid.Row="1"
                            Grid.ColumnSpan="2"
                            Background="{ThemeResource SystemControlHighlightListAccentLowBrush}"
                            BorderBrush="{ThemeResource SystemControlHighlightBaseMediumLowBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}"
                            Opacity="0" />
                        <ContentPresenter
                            x:Name="ContentPresenter"
                            Grid.Row="1"
                            Margin="{TemplateBinding Padding}"
                            HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                            VerticalAlignment="{TemplateBinding VerticalContentAlignment}">
                            <TextBlock
                                x:Name="PlaceholderTextBlock"
                                Foreground="{ThemeResource SystemControlPageTextBaseHighBrush}"
                                Text="{TemplateBinding PlaceholderText}" />
                        </ContentPresenter>
                        <FontIcon
                            x:Name="DropDownGlyph"
                            Grid.Row="1"
                            Grid.Column="1"
                            Margin="0,10,10,10"
                            HorizontalAlignment="Right"
                            VerticalAlignment="Center"
                            Foreground="{ThemeResource SystemControlForegroundBaseMediumHighBrush}"
                            FontFamily="{ThemeResource SymbolThemeFontFamily}"
                            FontSize="12"
                            AutomationProperties.AccessibilityView="Raw"
                            Glyph="&#xE0E5;"
                            IsHitTestVisible="False" />
                        <Popup x:Name="Popup">
                            <Border
                                x:Name="PopupBorder"
                                Margin="0,-1,0,-1"
                                HorizontalAlignment="Stretch"
                                Background="{ThemeResource SystemControlBackgroundChromeMediumLowBrush}"
                                BorderBrush="{ThemeResource SystemControlForegroundChromeHighBrush}"
                                BorderThickness="{ThemeResource ComboBoxDropdownBorderThickness}">
                                <ScrollViewer
                                    x:Name="ScrollViewer"
                                    MinWidth="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownContentMinWidth}"
                                    Foreground="{ThemeResource SystemControlForegroundBaseHighBrush}"
                                    AutomationProperties.AccessibilityView="Raw"
                                    BringIntoViewOnFocusChange="{TemplateBinding ScrollViewer.BringIntoViewOnFocusChange}"
                                    HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                                    HorizontalScrollMode="{TemplateBinding ScrollViewer.HorizontalScrollMode}"
                                    IsDeferredScrollingEnabled="{TemplateBinding ScrollViewer.IsDeferredScrollingEnabled}"
                                    IsHorizontalRailEnabled="{TemplateBinding ScrollViewer.IsHorizontalRailEnabled}"
                                    IsVerticalRailEnabled="{TemplateBinding ScrollViewer.IsVerticalRailEnabled}"
                                    VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                                    VerticalScrollMode="{TemplateBinding ScrollViewer.VerticalScrollMode}"
                                    VerticalSnapPointsAlignment="Near"
                                    VerticalSnapPointsType="OptionalSingle"
                                    ZoomMode="Disabled">
                                    <ItemsPresenter Margin="0"/>
                                </ScrollViewer>
                            </Border>
                        </Popup>
                        <VisualStateManager.VisualStateGroups>
                            <VisualStateGroup x:Name="CommonStates">
                                <VisualState x:Name="Normal" />
                                <VisualState x:Name="PointerOver">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlPageBackgroundAltMediumBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="BorderBrush">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightBaseMediumBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Pressed">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlBackgroundListMediumBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="BorderBrush">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightBaseMediumLowBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Disabled">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="Background">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlBackgroundBaseLowBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Background" Storyboard.TargetProperty="BorderBrush">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseLowBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HeaderContentPresenter" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownGlyph" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlDisabledBaseMediumLowBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                            <VisualStateGroup x:Name="FocusStates">
                                <VisualState x:Name="Focused">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="HighlightBackground" Storyboard.TargetProperty="BorderBrush">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightTransparentBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <DoubleAnimation
                                            Duration="0"
                                            Storyboard.TargetName="HighlightBackground"
                                            Storyboard.TargetProperty="Opacity"
                                            To="1" />
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownGlyph" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="FocusedPressed">
                                    <Storyboard>
                                        <DoubleAnimation
                                            Duration="0"
                                            Storyboard.TargetName="HighlightBackground"
                                            Storyboard.TargetProperty="Opacity"
                                            To="1" />
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ContentPresenter" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PlaceholderTextBlock" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseHighBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                        <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownGlyph" Storyboard.TargetProperty="Foreground">
                                            <DiscreteObjectKeyFrame KeyTime="0" Value="{ThemeResource SystemControlHighlightAltBaseMediumHighBrush}" />
                                        </ObjectAnimationUsingKeyFrames>
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Unfocused" />
                                <VisualState x:Name="PointerFocused" />
                                <VisualState x:Name="FocusedDropDown">
                                    <Storyboard>
                                        <ObjectAnimationUsingKeyFrames
                                            Duration="0"
                                            Storyboard.TargetName="PopupBorder"
                                            Storyboard.TargetProperty="Visibility">
                                            <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"
                                            OffsetFromCenter="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownOffset}"
                                            OpenedLength="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownOpenedHeight}"
                                            OpenedTargetName="PopupBorder" />
                                    </Storyboard>
                                </VisualState>
                                <VisualState x:Name="Closed">
                                    <Storyboard>
                                        <SplitCloseThemeAnimation
                                            ClosedTargetName="ContentPresenter"
                                            OffsetFromCenter="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownOffset}"
                                            OpenedLength="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=TemplateSettings.DropDownOpenedHeight}"
                                            OpenedTargetName="PopupBorder" />
                                    </Storyboard>
                                </VisualState>
                            </VisualStateGroup>
                        </VisualStateManager.VisualStateGroups>
                    </Grid>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

您也可以只编辑默认样式的副本，XAML 设计器会为您生成所有默认样式，您只需更新您想要的样式即可。如何生成默认样式，可以选择Combobox控件->右键->编辑模板->编辑副本，详见：

如何删除 UWP 应用程序中 ComboBox 项目列表顶部和底部设置的边距

How to remove margin set at the top and bottom of ComboBox items list in an UWP application

uwp

uwp-xaml