在WPF中优雅地覆盖ComboBox的ToggleButton的样式 [英] Elegantly override style of ComboBox's ToggleButton in WPF

问题描述

我有一个问题，如何优雅地覆盖控件的视觉树中深处的任意元素。我也试图以几种不同的方式解决它，但我遇到了几个问题。通常，当我尝试三种不同的路径，并在每一个失败，我走下楼，喝杯咖啡，问一个比我聪明的人。所以这里是我。

I have a question regarding how to elegantly override an arbitrary element deep inside a control's visual tree. I also have attempted to resolve it in a few different ways, but I've run into several problems with each. Usually when I try three different paths and fail at each one I go downstairs, have a coffee, and ask someone smarter than myself. So here I am.

具体细节：

我想展平一个组合框的样式，不会引起对自身的注意。我想它类似于Windows.Forms.ComboBox的FlatStyle我想让它在Windows 7和XP上看起来一样。

I want to flatten the style of a combo box so that it will not draw attention to itself. I want it to be similar to Windows.Forms.ComboBox's FlatStyle I want it to look the same on Windows 7 and XP.

主要是要改变ComboBox的ToggleButton的外观。

Mainly, I want to change the look of a ComboBox's ToggleButton.

我可以使用Blend和rip控件模板的外观和手动更改它们。这听起来不太好吃。

I could just use Blend and rip the control template's guts out and manually change them. That doesn't sound very appetizing to me.

我尝试使用一个样式来覆盖ToggleButton的背景，但事实证明，整个ComboBox控件实际上是一个前端ToggleButton。

I tried using a style to override the ToggleButton's background, but it turns out that the whole ComboBox control is actually a front for a ToggleButton.

<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="ComboBoxExpiriment2.MainWindow"
x:Name="Window"
xmlns:Microsoft_Windows_Themes="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Classic" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
Title="MainWindow"
Width="204" Height="103">
<Grid x:Name="LayoutRoot">
    <ComboBox HorizontalAlignment="Left" Margin="32,26.723,0,0" Width="120" VerticalAlignment="Top" Height="21.277">
    <ComboBox.Style>
      <Style>
        <Setter Property="ToggleButton.Background" Value="Green" />
      </Style>
    </ComboBox.Style>
    </ComboBox>
</Grid>

所以我放弃了它使用Blend。我发现它实际上是一个称为ComboBoxTransparentButtonStyle，目标类型为ToggleButton的样式。该样式设置了一个ControlTemplate，该模板使用的DockPanel的Microsoft_Windows_Themes：ClassicBorderDecorator类型设置为右侧，而是我们实际想要控制的。

以下是图片：

So I gave up and ripped it using Blend. I found that it's actually a Style called ComboBoxTransparentButtonStyle with a target type of ToggleButton. The style sets a ControlTemplate that uses a DockPanel that has a "Microsoft_Windows_Themes:ClassicBorderDecorator" type set to the right, and that's what we're actually trying to control. (Are you with me so far?)
Here's the pic:

<Style x:Key="ComboBoxTransparentButtonStyle" TargetType="{x:Type ToggleButton}">
                <Setter Property="MinWidth" Value="0"/>
                <Setter Property="MinHeight" Value="0"/>
                <Setter Property="Width" Value="Auto"/>
                <Setter Property="Height" Value="Auto"/>
                <Setter Property="Background" Value="Transparent"/>
                <Setter Property="BorderBrush" Value="{x:Static Microsoft_Windows_Themes:ClassicBorderDecorator.ClassicBorderBrush}"/>
                <Setter Property="BorderThickness" Value="2"/>
                <Setter Property="Template">
                    <Setter.Value>
                        <ControlTemplate TargetType="{x:Type ToggleButton}">
                            <DockPanel SnapsToDevicePixels="true" Background="{TemplateBinding Background}" LastChildFill="false">
                                <Microsoft_Windows_Themes:ClassicBorderDecorator x:Name="Border" Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" DockPanel.Dock="Right" Background="Green" BorderBrush="{TemplateBinding BorderBrush}" BorderStyle="None" BorderThickness="{TemplateBinding BorderThickness}">
                                    <Path Fill="{TemplateBinding Foreground}" HorizontalAlignment="Center" VerticalAlignment="Center" Data="{StaticResource DownArrowGeometry}"/>
                                </Microsoft_Windows_Themes:ClassicBorderDecorator>
                            </DockPanel>
                            <ControlTemplate.Triggers>
                                <Trigger Property="IsChecked" Value="true">
                                    <Setter Property="BorderStyle" TargetName="Border" Value="AltPressed"/>
                                </Trigger>
                            </ControlTemplate.Triggers>
                        </ControlTemplate>
                    </Setter.Value>
                </Setter>
                <Style.Triggers>
                    <Trigger Property="IsEnabled" Value="false">
                        <Setter Property="Foreground" Value="{DynamicResource {x:Static SystemColors.ControlDarkBrushKey}}"/>
                    </Trigger>
                </Style.Triggers>
            </Style>

Arg。是不是WPF是爆炸？

Arg. Isn't WPF a blast?

所以我提取了样式ComboBoxTransparentButtonStyle，并将它放到另一个项目的application.resources。问题是我不能应用该样式到ComboBox，因为我提取的样式有一个targetType为ToggleButton，所以TargeTypes不匹配。

So I extracted the style ComboBoxTransparentButtonStyle and dropped it into another project's application.resources. Problem is I can't apply that style to a ComboBox because the style I extracted has a targetType of ToggleButton, so the TargeTypes don't match.

tl; dr

推荐答案

没有一个优雅的解决方案。你最好做的是覆盖整个ComboBox的样式，这样你可以改变它为ToggleButton设置的样式。

There isn't an elegant solution for this. The best you can do is override the style for the entire ComboBox so that you can change the style it sets for the ToggleButton.

你可以使用Blend获取样式，然而这种可能性不是最简单的方法。如果您安装了Blend，请转到[程序文件或安装Blend的位置] \SystemThemes\WPF\areo.normalcolor.xaml。

You can use Blend to get the styles, however that probabliy isn't the easiest way. If you have Blend installed, go to "[Program files or where Blend is installed]\SystemThemes\WPF\areo.normalcolor.xaml".

这篇关于在WPF中优雅地覆盖ComboBox的ToggleButton的样式的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！