WPF GroupBox 样式未应用于自定义控件答案

【问题标题】：WPF GroupBox Style not being applied on custom controlWPF GroupBox 样式未应用于自定义控件
【发布时间】：2012-10-16 21:27:01
【问题描述】：

我创建了一个自定义控件，因此如果出现错误，只需将 Geroupbox 的边框绘制为红色。由于某种原因，当我使用控件时，前景色没有正确设置，它默认为白色而不是绿色。我的代码如下：

public class ErrorGroupBox : GroupBox
{
    static ErrorGroupBox()
    {
    }

    public bool ErrorState
    {
        get { return (bool)GetValue(ErrorStateProperty); }
        set { base.SetValue(ErrorStateProperty, value); }
    }

    public static readonly DependencyProperty ErrorStateProperty =
      DependencyProperty.Register("ErrorState", typeof(bool), typeof(ErrorGroupBox), new UIPropertyMetadata(false));
}

风格是：

<Style x:Name="ErrorGroupBox" TargetType="local:ErrorGroupBox">
    <Setter Property="Foreground" Value="Green"/>
    <Setter Property="BorderThickness" Value="2"/>
    <Setter Property="FontFamily" Value="Tahoma"/>
    <Setter Property="FontSize" Value="13"/>
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="GroupBox">
                <Grid SnapsToDevicePixels="True" Margin="5">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="6"/>
                        <ColumnDefinition Width="Auto"/>
                        <ColumnDefinition Width="*"/>
                        <ColumnDefinition Width="6"/>
                    </Grid.ColumnDefinitions>
                    <Grid.RowDefinitions>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="Auto"/>
                        <RowDefinition Height="*"/>
                        <RowDefinition Height="6"/>
                    </Grid.RowDefinitions>

                    <!--<Border Background="{TemplateBinding Background}" BorderBrush="Transparent" 
                         BorderThickness="{TemplateBinding BorderThickness}" 
                         CornerRadius="4" Grid.Column="1    " Grid.ColumnSpan="4" 
                         Grid.Row="1" Grid.RowSpan="3" HorizontalAlignment="Stretch"/>-->

                    <!--The Title-->
                    <Border x:Name="Header" Grid.Column="2" Grid.RowSpan="2" HorizontalAlignment="Left" 
                        Padding="3,1,3,0" VerticalAlignment="Stretch" >
                        <Border.Effect>
                            <DropShadowEffect BlurRadius="5" Direction="334"/>
                        </Border.Effect>

                        <ContentPresenter SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
                             Content="{TemplateBinding Header}" 
                             ContentSource="Header" 
                             ContentStringFormat="{TemplateBinding HeaderStringFormat}" 
                             ContentTemplate="{TemplateBinding HeaderTemplate}" 
                             RecognizesAccessKey="True" Height="Auto" 
                             VerticalAlignment="Center"
                             HorizontalAlignment="Center"
                             OpacityMask="#FF3844BD" Margin="0,1,0,0">
                        </ContentPresenter>
                    </Border>

                    <ContentPresenter Margin="5" 
    SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" 
    Content="{TemplateBinding Content}" 
    ContentStringFormat="{TemplateBinding ContentStringFormat}" 
    ContentTemplate="{TemplateBinding ContentTemplate}" 
    Grid.Column="1" Grid.ColumnSpan="2" Grid.Row="2" />
                    <Border BorderBrush="#BFBFBF" BorderThickness="{TemplateBinding BorderThickness}" 
                        CornerRadius="4" Grid.ColumnSpan="3" Grid.Row="1" Grid.RowSpan="3" RenderTransformOrigin="0.5,0.5" Margin="0">
                        <Border.OpacityMask>
                            <MultiBinding ConverterParameter="7" UpdateSourceTrigger="Default">
                                <MultiBinding.Converter>
                                    <BorderGapMaskConverter/>
                                </MultiBinding.Converter>
                                <Binding Path="ActualWidth" ElementName="Header"/>
                                <Binding Path="ActualWidth" RelativeSource="{RelativeSource Self}"/>
                                <Binding Path="ActualHeight" RelativeSource="{RelativeSource Self}"/>
                            </MultiBinding>
                        </Border.OpacityMask>
                    </Border>
                </Grid>
                <ControlTemplate.Triggers>                    
                    <Trigger Property="local:ErrorGroupBox.ErrorState" Value="True">
                        <Setter Property="Foreground" Value="Green"/>
                    </Trigger>
                    <Trigger Property="local:ErrorGroupBox.ErrorState" Value="False">
                        <Setter Property="Foreground" Value="Green"/>
                    </Trigger>
                </ControlTemplate.Triggers>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

我使用控件如下：

    <controls:ErrorGroupBox ErrorState="{Binding Error}" Header="Test Type" Margin="20,20,0,0" Name="groupBox1" HorizontalAlignment="Left" VerticalAlignment="Top" Width="226" Grid.Column="0">

【问题讨论】：

你的风格很适合我。也许使用Snoop 之类的东西来查看你的可视化树上发生了什么
@Rachel 感谢您的尝试，您的标题是否显示为绿色？我不知道发生了什么。
是的，我复制并粘贴了您在此处发布的所有 3 位代码，对我来说效果很好。此控件是否位于另一个具有选择功能的控件（例如 ListBox）中？还是您在某处覆盖了默认样式或系统颜色？
@Rachel 不，它不在另一个控件中，唯一略有不同的是 ErrorGroupBox 样式是在单独的程序集中定义的，因此可能是导致问题的原因。奇怪的是控件的其余部分样式正确，只是标题不正确。
最好的办法是像我一样将这里的内容复制到一个新项目中，这样它才能正常工作，然后一次添加一个其他组件，直到问题再次出现。这应该告诉您哪个组件导致了问题。

标签： wpf styles stylesheet groupbox

【解决方案1】：

如果这是默认主题样式，您需要在静态构造函数中指定不同的元数据类型：

public class ErrorGroupBox : GroupBox
{
    static ErrorGroupBox()
    {
        DefaultStyleKeyProperty.OverrideMetadata(typeof(ErrorGroupBox), new FrameworkPropertyMetadata(typeof(ErrorGroupBox )));
    }

【讨论】：