稍微修改控件模板，使用样式。

Question

我只需要在ComboBox周围添加一个粗边框。正如你可能已经知道的那样，ComboBox的BorderThickness属性并没有太大用处。因此，我正在尝试使用以下样式修改Template，但无法确定需要在Border标签内编写什么内容来表示ComoboBox本身：

<Style TargetType="{x:Type ComboBox}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="ComboBox">
                <Border BorderBrush="Black" BorderThickness="2">
                    WHAT GOES HERE?
                </Border>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我已尝试使用 ContentPresenter 和 ContentControl，但实际上并不太了解它们在这种特定情况下的用法。

- dotNET

---

相关问题：WPF - 如何为组合框设置样式？ - Rachel

@Rachel：没错。不知道我怎么会错过这个。 - dotNET

Answer 1

如果我理解正确，您想把原始的ComboBox放入那个Border中，对吗？您可以在这里找到一个示例模板自定义。因此，如果您将重要部分（Grid）复制到您的Border中，它应该看起来像标准的ComboBox，只是边框更厚。也许您需要进行一些微小的修改，以使其看起来完美。顺便说一下，MS Blend会在这里提供很大的帮助。

- DHN

---

非常感谢DHN。我猜你和Olimpiu建议了同样的事情，但他提供了实际的实现。无论如何，我想你的答案是第一个出现并值得点赞的。 - dotNET

好吧，我不喜欢发布复制和粘贴的解决方案。但无论如何，很高兴我们能帮到你。;o) - DHN

Answer 2

你需要编辑完整的控件模板。这里有一个小例子，你可以随意扩展。 首先是一个用于打开组合框的ToggleButton的控件模板：

 <ControlTemplate x:Key="ComboBoxToggleButton" TargetType="{x:Type ToggleButton}">
        <Grid>
            <Grid.ColumnDefinitions>
                <ColumnDefinition />
                <ColumnDefinition Width="15" />
            </Grid.ColumnDefinitions>
            <Border x:Name="Border"  Grid.ColumnSpan="2" BorderThickness="1" />
            <Path x:Name="Arrow" 
              Fill="Black" 
              SnapsToDevicePixels="True" 
              StrokeThickness="1" 
              VerticalAlignment="Center" 
              HorizontalAlignment="Center" 
              Grid.Column="1" 
              Data="M0,0 L0,3 L1,3 L1,4 L2,4 L2,5 L3,5 L3,6 L4,6 L4,5 L5,5 L5,4 L6,4 L6,3 L7,3 L7,0 L6,0 L6,1 L5,1 L5,2 L4,2 L4,3 L3,3 L3,2 L2,2 L2,1 L1,1 L1,0 L0,0 Z" />
        </Grid>
        <ControlTemplate.Triggers>
            <Trigger Property="IsMouseOver" Value="True">
                <Setter Property="Background" Value="Gray" TargetName="Border"/>
                <Setter Property="BorderBrush" Value="DarkGray" TargetName="Border"/>
            </Trigger>
            <Trigger Property="IsFocused" Value="true">
                <Setter Property="BorderBrush" Value="DarkGray" TargetName="Border"/>
            </Trigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

这是使用此模板的组合框的样式。

<Style TargetType="{x:Type ComboBox}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ComboBox}">
                    <Border CornerRadius="5" BorderThickness="2" BorderBrush="Red">
                        <Grid>
                        <ToggleButton x:Name="ToggleButton" 
                                      Grid.Column="2"
                                      Focusable="false"
                                      ClickMode="Press"
                                      IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}"
                                      Template="{StaticResource ComboBoxToggleButton}"/>
                        <ContentPresenter x:Name="ContentSite"
                                        IsHitTestVisible="False"
                                        Content="{TemplateBinding SelectionBoxItem}"
                                        ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
                                        ContentTemplateSelector="{TemplateBinding ItemTemplateSelector}"
                                        Margin="3,3,21,3"
                                        VerticalAlignment="Stretch"
                                        HorizontalAlignment="Left">
                        </ContentPresenter>
                        <TextBox x:Name="PART_EditableTextBox"
                               Style="{x:Null}"
                               HorizontalAlignment="Left"
                               VerticalAlignment="Bottom"
                               Margin="3,3,21,3"
                               Focusable="True"
                               Background="Transparent"
                               Visibility="Hidden"
                               IsReadOnly="{TemplateBinding IsReadOnly}" />
                        <Popup x:Name="Popup"
                             Placement="Bottom"
                             IsOpen="{TemplateBinding IsDropDownOpen}"
                             AllowsTransparency="True"
                             Focusable="False"
                             PopupAnimation="Slide">
                            <Grid x:Name="DropDown"
                                  Background="WhiteSmoke"
                                  SnapsToDevicePixels="True"
                                  MinWidth="{TemplateBinding ActualWidth}"
                                  MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                    <Border x:Name="DropDownBorder"  BorderThickness="1" Margin="0 0 2 0" />
                                    <ScrollViewer SnapsToDevicePixels="True">
                                        <StackPanel IsItemsHost="True" KeyboardNavigation.DirectionalNavigation="Contained" />
                                    </ScrollViewer>
                            </Grid>
                        </Popup>
                        </Grid>
                    </Border>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>

希望能有所帮助。

- Olimpiu Datcu

---

好的，是的，如果楼主按照我的链接操作，就会看到这个样子。;o) - DHN

@Olimpiu：非常感谢。正是我需要的。虽然比我预期的要多一些工作。 - dotNET