Цвет фона пользовательского элемента управления в WPF - PullRequest
Новая
       10

Цвет фона пользовательского элемента управления в WPF

0 голосов
/ 30 сентября 2018

Я создал пользовательский элемент управления, как вы видите ниже (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 мне нужно получить фон (вместо черного).Поэтому теперь триггер не работает должным образом!Я также не хочу связывать высоту и ширину сетки, потому что CC имеет свою собственную высоту и ширину, но я не знаю, как ее использовать!Не могли бы вы помочь мне?!

РЕДАКТИРОВАТЬ:

Это на самом деле переключатель, который имеет статус.если статус == 0, он показывает пустой прямоугольник.если статус == 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, мне нужно изменить цвет переднего плана на красный, и этоне работает!

1 Ответ

0 голосов
/ 30 сентября 2018

Используйте TemplateBindings для кистей.Binding Width и Height совсем не нужны. 

<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>

В качестве примечания вместо Grid обычно используется элемент Border и назначается 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>
...