WPF - 从 Combobox 控件中隐藏所选项目/文本框部分

Question

我正在寻找一种方法来隐藏 wpf combobox 的选定项目/文本框部分，只留下下拉按钮，以便用户仍然可以与列表交互。

我找不到切换此行为的属性，我很想知道是否有办法更改此控件某些部分的可见性？

如果有人有任何建议，将不胜感激。

Answer 1

隐藏文本部分的最简单方法可能是设置ComboBox的Width ：

<ComboBox Width="20" />

否则，您始终可以定义自己的自定义ControlTemplate并将Template属性设置为此，但这需要更多的努力。

Answer 2

编辑 - 要使用以下代码，您需要使用 ComboBoxStyleWithoutText 作为 combobox 上的样式

为了实现这一点，我必须重新创建一个组合框并编辑模板本身，同时调整单个 styles 以适应我们应用程序的配色方案。

这是结果

在应用程序中

请随意使用下面的代码，它可能有一些我从其他字典中使用过的自定义颜色（将这些更改为适合您的应用程序的任何颜色）

<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
                xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">

<ResourceDictionary.MergedDictionaries>
    <ResourceDictionary Source="Shared.xaml" />
    <ResourceDictionary Source="Colours.xaml" />
    <ResourceDictionary Source="Brushes.xaml" />
</ResourceDictionary.MergedDictionaries>

<!-- SimpleStyles: ComboBox -->
<ControlTemplate x:Key="ComboBoxToggleButton" 
                 TargetType="ToggleButton">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition Width="20" />
        </Grid.ColumnDefinitions>
        <Border x:Name="Border"
                Grid.ColumnSpan="2"
                CornerRadius="2"
                Background="{StaticResource ScreenBackgroundBrush}"
                BorderBrush="{StaticResource GridBorderBrush}"
                BorderThickness="2" />
        <Border Grid.Column="0"
                CornerRadius="2,0,0,2"
                Margin="1"
                Background="{StaticResource ScreenBackgroundBrush}"
                BorderBrush="{StaticResource GridBorderBrush}"
                BorderThickness="1,1,1,1" />
        <Path x:Name="Arrow"
              Grid.Column="1"
              Fill="{StaticResource SecondaryControlBrush}"
              HorizontalAlignment="Center"
              VerticalAlignment="Center"
              Data="M 0 0 L 4 4 L 8 0 Z" />
    </Grid>
    <ControlTemplate.Triggers>
        <Trigger Property="ToggleButton.IsMouseOver" 
                 Value="true">
            <Setter TargetName="Border" 
                    Property="Background" 
                    Value="{StaticResource DataGridHeaderRowBackgroundBrush}" />
        </Trigger>
        <Trigger Property="ToggleButton.IsChecked" 
                 Value="true">
            <Setter TargetName="Border"
                    Property="Background"
                    Value="{StaticResource DataGridHeaderRowBackgroundBrush}" />
        </Trigger>
        <Trigger Property="IsEnabled" 
                 Value="False">
            <Setter Property="Opacity" 
                    Value="0.25" />
            <Setter TargetName="Border" 
                    Property="Background" 
                    Value="{StaticResource DisabledBackgroundBrush}" />
            <Setter TargetName="Border" 
                    Property="BorderBrush" 
                    Value="{StaticResource DisabledBorderBrush}" />
            <Setter Property="Foreground" 
                    Value="{StaticResource DisabledForegroundBrush}" />
            <Setter TargetName="Arrow" 
                    Property="Fill" 
                    Value="{StaticResource DisabledForegroundBrush}" />
        </Trigger>
    </ControlTemplate.Triggers>
</ControlTemplate>

<ControlTemplate x:Key="ComboBoxTextBox" 
                 TargetType="TextBox">
    <Border x:Name="PART_ContentHost" 
            Focusable="False" 
            Background="{TemplateBinding Background}" />
</ControlTemplate>

<Style x:Key="ComboBoxStyleWithoutText" TargetType="{x:Type ComboBox}">
    <Setter Property="SnapsToDevicePixels"                 Value="true" />
    <Setter Property="OverridesDefaultStyle"                 Value="true" />
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility"                 Value="Auto" />
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility"                 Value="Auto" />
    <Setter Property="ScrollViewer.CanContentScroll"                 Value="true" />
    <Setter Property="MinWidth"                 Value="0" />
    <Setter Property="MinHeight"                 Value="20" />
    <Setter Property="Background"                 Value="Green" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ComboBox">
                <Grid>
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="0"></ColumnDefinition>
                        <ColumnDefinition MinWidth="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" Width="0"/>
                    </Grid.ColumnDefinitions>
                    <ToggleButton Name="ToggleButton" 
                                  Template="{StaticResource ComboBoxToggleButton}" 
                                  Grid.Column="2" 
                                  Focusable="false" 
                                  IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}" 
                                  ClickMode="Press">
                    </ToggleButton>
                    <ContentPresenter Name="ContentSite" 
                                      IsHitTestVisible="False" 
                                      Content="{TemplateBinding SelectionBoxItem}" 
                                      ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" 
                                      ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" 
                                      Margin="3,3,3,3" 
                                      VerticalAlignment="Center" 
                                      HorizontalAlignment="Left" />
                    <TextBox x:Name="PART_EditableTextBox" 
                             Style="{x:Null}" 
                             Template="{StaticResource ComboBoxTextBox}" 
                             HorizontalAlignment="Left" 
                             VerticalAlignment="Center" 
                             Margin="3,3,3,3" 
                             Focusable="True" 
                             Visibility="Hidden" 
                             IsReadOnly="{TemplateBinding IsReadOnly}" />
                    <Popup Name="Popup" 
                           Placement="Bottom" 
                           IsOpen="{TemplateBinding IsDropDownOpen}" 
                           AllowsTransparency="True" 
                           Focusable="False" 
                           PopupAnimation="Slide">
                        <Grid Name="DropDown" 
                              SnapsToDevicePixels="True" 
                              MinWidth="{TemplateBinding ActualWidth}" 
                              MaxHeight="{TemplateBinding MaxDropDownHeight}">
                            <Border x:Name="DropDownBorder" 
                                    Background="{StaticResource TextBoxBrush}" 
                                    BorderThickness="2" 
                                    BorderBrush="{StaticResource SolidBorderBrush}" />
                            <ScrollViewer Margin="4,6,2,2" 
                                          SnapsToDevicePixels="True">
                                <StackPanel IsItemsHost="True" 
                                            KeyboardNavigation.DirectionalNavigation="Contained" />
                            </ScrollViewer>
                        </Grid>
                    </Popup>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="HasItems" 
                             Value="false">
                        <Setter TargetName="DropDownBorder" 
                                Property="MinHeight" 
                                Value="95" />
                    </Trigger>
                    <Trigger Property="IsEnabled" 
                             Value="false">
                        <Setter Property="Foreground" 
                                Value="{StaticResource DisabledForegroundBrush}" />
                    </Trigger>
                    <Trigger Property="IsGrouping" 
                             Value="true">
                        <Setter Property="ScrollViewer.CanContentScroll" 
                                Value="false" />
                    </Trigger>
                    <Trigger SourceName="Popup" 
                             Property="Popup.AllowsTransparency" 
                             Value="true">
                        <Setter TargetName="DropDownBorder" 
                                Property="CornerRadius" 
                                Value="4" />
                        <Setter TargetName="DropDownBorder" 
                                Property="Margin" 
                                Value="0,2,0,0" />
                    </Trigger>
                    <Trigger Property="IsEditable" 
                             Value="true">
                        <Setter Property="IsTabStop" 
                                Value="false" />
                        <Setter TargetName="PART_EditableTextBox" 
                                Property="Visibility" 
                                Value="Visible" />
                        <Setter TargetName="ContentSite" 
                                Property="Visibility" 
                                Value="Hidden" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
    </Style.Triggers>
</Style>

<Style x:Key="{x:Type ComboBox}" 
       TargetType="ComboBox">
    <Setter Property="SnapsToDevicePixels" 
            Value="true" />
    <Setter Property="OverridesDefaultStyle" 
            Value="true" />
    <Setter Property="ScrollViewer.HorizontalScrollBarVisibility" 
            Value="Auto" />
    <Setter Property="ScrollViewer.VerticalScrollBarVisibility" 
            Value="Auto" />
    <Setter Property="ScrollViewer.CanContentScroll" 
            Value="true" />
    <Setter Property="MinWidth" 
            Value="120" />
    <Setter Property="MinHeight" 
            Value="20" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ComboBox">
                <Grid>
                    <ToggleButton Name="ToggleButton" 
                                  Template="{StaticResource ComboBoxToggleButton}" 
                                  Grid.Column="2" 
                                  Focusable="false" 
                                  IsChecked="{Binding Path=IsDropDownOpen,Mode=TwoWay,RelativeSource={RelativeSource TemplatedParent}}" 
                                  ClickMode="Press">
                    </ToggleButton>
                    <ContentPresenter Name="ContentSite" 
                                      IsHitTestVisible="False" 
                                      Content="{TemplateBinding SelectionBoxItem}" 
                                      ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" 
                                      ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}" 
                                      Margin="3,3,23,3" 
                                      VerticalAlignment="Center" 
                                      HorizontalAlignment="Left" />
                    <TextBox x:Name="PART_EditableTextBox" 
                             Style="{x:Null}" 
                             Template="{StaticResource ComboBoxTextBox}" 
                             HorizontalAlignment="Left" 
                             VerticalAlignment="Center" 
                             Margin="3,3,23,3" 
                             Focusable="True" 
                             Visibility="Hidden" 
                             IsReadOnly="{TemplateBinding IsReadOnly}" />
                    <Popup Name="Popup" 
                           Placement="Bottom" 
                           IsOpen="{TemplateBinding IsDropDownOpen}" 
                           AllowsTransparency="True" 
                           Focusable="False" 
                           PopupAnimation="Slide">
                        <Grid Name="DropDown" 
                              SnapsToDevicePixels="True" 
                              MinWidth="{TemplateBinding ActualWidth}" 
                              MaxHeight="{TemplateBinding MaxDropDownHeight}">
                            <Border x:Name="DropDownBorder" 
                                    Background="{StaticResource TextBoxBrush}" 
                                    BorderThickness="2" 
                                    BorderBrush="{StaticResource SolidBorderBrush}" />
                            <ScrollViewer Margin="4,6,4,6" 
                                          SnapsToDevicePixels="True">
                                <StackPanel IsItemsHost="True" 
                                            KeyboardNavigation.DirectionalNavigation="Contained" />
                            </ScrollViewer>
                        </Grid>
                    </Popup>
                </Grid>
                <ControlTemplate.Triggers>
                    <Trigger Property="HasItems" 
                             Value="false">
                        <Setter TargetName="DropDownBorder" 
                                Property="MinHeight" 
                                Value="95" />
                    </Trigger>
                    <Trigger Property="IsEnabled" 
                             Value="false">
                        <Setter Property="Foreground" 
                                Value="{StaticResource DisabledForegroundBrush}" />
                    </Trigger>
                    <Trigger Property="IsGrouping" 
                             Value="true">
                        <Setter Property="ScrollViewer.CanContentScroll" 
                                Value="false" />
                    </Trigger>
                    <Trigger SourceName="Popup" 
                             Property="Popup.AllowsTransparency" 
                             Value="true">
                        <Setter TargetName="DropDownBorder" 
                                Property="CornerRadius" 
                                Value="4" />
                        <Setter TargetName="DropDownBorder" 
                                Property="Margin" 
                                Value="0,2,0,0" />
                    </Trigger>
                    <Trigger Property="IsEditable" 
                             Value="true">
                        <Setter Property="IsTabStop" 
                                Value="false" />
                        <Setter TargetName="PART_EditableTextBox" 
                                Property="Visibility" 
                                Value="Visible" />
                        <Setter TargetName="ContentSite" 
                                Property="Visibility" 
                                Value="Hidden" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
    </Style.Triggers>
</Style>

<!-- SimpleStyles: ComboBoxItem -->
<Style x:Key="{x:Type ComboBoxItem}" 
       TargetType="ComboBoxItem">
    <Setter Property="SnapsToDevicePixels" 
            Value="true" />
    <Setter Property="OverridesDefaultStyle" 
            Value="true" />
    <Setter Property="Background" 
            Value="{StaticResource ScreenBackgroundBrush}"/>
    <Setter Property="Foreground" 
            Value="{StaticResource PrimaryTextBrush}" />
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ComboBoxItem">
                <Border Name="Border" 
                        Padding="2" 
                        SnapsToDevicePixels="true">
                    <ContentPresenter />
                </Border>
                <ControlTemplate.Triggers>
                    <Trigger Property="IsHighlighted" 
                             Value="true">
                        <Setter TargetName="Border"
                                Property="Background"
                                Value="{StaticResource DataGridRowSelectedBrush}" />
                        <Setter TargetName="Border"
                                Property="CornerRadius"
                                Value="2" />
                    </Trigger>
                    <Trigger Property="IsEnabled" 
                             Value="false">
                        <Setter Property="Foreground" 
                                Value="{StaticResource DisabledForegroundBrush}" />
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>