WPF中的自定义控件背景颜色

Question

我创建了一个自定义控件，如下所示 (Generic.xaml)：

<Style TargetType="{x:Type local:MyCC}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:MyCC}">
                <Grid Name="grd" Height="{Binding Height}" Width="{Binding Width}">
                    <Rectangle Name="FirstRec" Fill="Blue"/>
                    <Rectangle Name="SecondRec" Fill="Black" Margin="1"/>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property = "IsMouseOver" Value = "True">
            <Setter Property = "Background" Value = "Red" />
        </Trigger>
    </Style.Triggers>
</Style>

对于 FirstRec 我想获得 CC 的前景色（而不是蓝色），对于 SecondRec 我需要获得背景色（而不是黑色）。因此，现在触发器无法正常工作！我也不想绑定Grid的Height和Width，因为CC有自己的height和width但是我不知道怎么用！你能帮帮我吗？！

编辑：

它实际上是一个有状态的开关。如果 status == 0 它显示一个空矩形。如果 status == 1 它显示一个填充的矩形。如果状态 == 3 || status == 4 它上面显示一个红十字。这是抄送：

<Style TargetType="{x:Type local:BreakerCC}">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="{x:Type local:BreakerCC}">
                <Grid Name="grd" Background="{TemplateBinding Background}" >
                    <Rectangle Name="MainRectangle" StrokeThickness="1" Stroke="{TemplateBinding Foreground}"/>
                    <Path Name="Line1" Stroke="Red" StrokeThickness="1" Stretch="Fill">
                        <Path.Data>
                            <LineGeometry StartPoint="0,0" EndPoint="1,1" />
                        </Path.Data>
                        <Path.Style>
                            <Style TargetType="Path">
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding Path=Status}" Value="0x00">
                                        <Setter Property="Visibility" Value="Hidden"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding Path=Status}" Value="0x01">
                                        <Setter Property="Visibility" Value="Hidden"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding Path=Status}" Value="0x02">
                                        <Setter Property="Visibility" Value="Visible"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding Path=Status}" Value="0x03">
                                        <Setter Property="Visibility" Value="Visible"/>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Path.Style>
                    </Path>
                    <Path Name="Line2" Stroke="Red" StrokeThickness="1" Stretch="Fill">
                        <Path.Data>
                            <LineGeometry StartPoint="0,1" EndPoint="1,0" />
                        </Path.Data>
                        <Path.Style>
                            <Style TargetType="Path">
                                <Style.Triggers>
                                    <DataTrigger Binding="{Binding Path=Status}" Value="0x00">
                                        <Setter Property="Visibility" Value="Hidden"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding Path=Status}" Value="0x01">
                                        <Setter Property="Visibility" Value="Hidden"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding Path=Status}" Value="0x02">
                                        <Setter Property="Visibility" Value="Visible"/>
                                    </DataTrigger>
                                    <DataTrigger Binding="{Binding Path=Status}" Value="0x03">
                                        <Setter Property="Visibility" Value="Visible"/>
                                    </DataTrigger>
                                </Style.Triggers>
                            </Style>
                        </Path.Style>
                    </Path>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
</Style>

这是 MainWindow.xaml 中的定义

<Window.Resources>
    <Style x:Key="230KV" TargetType="Control">
        <Setter Property="Background" Value="Black"/>
        <Setter Property="Foreground" Value="Red"/>
    </Style>
    <Style x:Key="132KV" TargetType="Control">
        <Setter Property="Background" Value="Black"/>
        <Setter Property="Foreground" Value="Green"/>
    </Style>
    <Style x:Key="400KV" TargetType="Control">
        <Setter Property="Background" Value="Black"/>
        <Setter Property="Foreground" Value="Purple"/>
    </Style>
</Window.Resources>
<Grid>
    <StackPanel>
        <CC:BreakerCC Status="{Binding Status}" Style="{StaticResource 132KV}" Height="20" Width="20"/>
    </StackPanel>
</Grid>

但当状态为 3 或 4 时，我需要将前景更改为红色，这不起作用！

Answer 1

为画笔使用 TemplateBindings。根本不需要绑定宽度和高度。

<Style TargetType="local:MyCC">
    <Setter Property="Template">
        <Setter.Value>
            <ControlTemplate TargetType="local:MyCC">
                <Grid>
                    <Rectangle Fill="{TemplateBinding Foreground}"/>
                    <Rectangle Fill="{TemplateBinding Background}" Margin="1"/>
                </Grid>
            </ControlTemplate>
        </Setter.Value>
    </Setter>
    <Style.Triggers>
        <Trigger Property="IsMouseOver" Value="True">
            <Setter Property="Background" Value="Red" />
        </Trigger>
    </Style.Triggers>
</Style>

请注意，您通常会有一个 Border 元素，而不是一个 Grid，并将 TemplateBindings 分配给它的 Background、BorderBrush 和 BorderThickness 属性 - 默认情况下由 Visual Studio 在您创建新的自定义控件时完成。

---

编辑：您似乎根本不需要自定义控件。只需像这样创建 ContentControl 样式：

<Window.Resources>
    <Style TargetType="ContentControl" x:Key="BaseStyle">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="ContentControl">
                    <Border Background="{TemplateBinding Background}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            BorderThickness="{TemplateBinding BorderThickness}">
                        <Path x:Name="path" Stroke="{TemplateBinding Foreground}"
                              Data="{TemplateBinding Content}" Stretch="Fill"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <DataTrigger Binding="{Binding Path=Status}" Value="0">
                            <Setter TargetName="path"
                                    Property="Visibility" Value="Hidden"/>
                        </DataTrigger>
                        <DataTrigger Binding="{Binding Path=Status}" Value="1">
                            <Setter TargetName="path"
                                    Property="Visibility" Value="Hidden"/>
                        </DataTrigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Background" Value="Black"/>
        <Setter Property="BorderBrush" Value="{Binding Foreground,
                                        RelativeSource={RelativeSource Self}}"/>
        <Setter Property="BorderThickness" Value="1"/>
        <Setter Property="Width" Value="20"/>
        <Setter Property="Height" Value="20"/>
    </Style>
    <Style x:Key="230KV" TargetType="ContentControl" BasedOn="{StaticResource BaseStyle}">
        <Setter Property="Foreground" Value="Red"/>
    </Style>
    <Style x:Key="132KV" TargetType="ContentControl" BasedOn="{StaticResource BaseStyle}">
        <Setter Property="Foreground" Value="Green"/>
    </Style>
    <Style x:Key="400KV" TargetType="ContentControl" BasedOn="{StaticResource BaseStyle}">
        <Setter Property="Foreground" Value="Purple"/>
    </Style>
</Window.Resources>
<StackPanel>
    <ContentControl Style="{StaticResource 230KV}">
        <PathGeometry>M0,0 L1,1 M0,1 L1,0</PathGeometry>
    </ContentControl>
    <ContentControl Style="{StaticResource 132KV}">
        <PathGeometry>M0,0 L1,1 M0,1 L1,0</PathGeometry>
    </ContentControl>
    <ContentControl Style="{StaticResource 400KV}">
        <PathGeometry>M0,0 L1,1 M0,1 L1,0</PathGeometry>
    </ContentControl>
</StackPanel>