Question

在我的应用程序中，我有一个ComboBox，它已使用IDataErrorInfo接口进行了验证。

发生验证错误时，我希望组合框的背景更改为红色，而不是默认的红色边框。

在上图中，我希望“月”组合框具有红色背景，就像验证错误时的其他控件一样。我已经通过使用样式触发器的文本框和IntegerUpDown控件实现了这种样式。

<ControlTemplate.Triggers>
   <Trigger Property="Validation.HasError" Value="True">
     <Setter TargetName="temp" Property="Background" Value="Red" />
   </Trigger>
 </ControlTemplate.Triggers>

我用ComboBox控件尝试了同样的事情，但没有成功。我找到的所有其他答案都只是在其周围包裹了另一个边框

WPF Combobox Validation.ErrorTemplate error

这是到目前为止的所有相关代码：

    <StackPanel>
       <xctk:WatermarkComboBox x:Name="Month" ItemsSource="{Binding ListOfMonths}" SelectedItem="{Binding SelectedMonth, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}" Margin="0,0,20,0" Style="{DynamicResource WatermarkComboBoxStyle1}">
        <xctk:WatermarkComboBox.Watermark>
            <TextBlock Text="Month" Foreground="{StaticResource OffsetWhiteBrush}" />
        </xctk:WatermarkComboBox.Watermark>
      </xctk:WatermarkComboBox>
      <Label Content="{Binding (Validation.Errors)[0].ErrorContent, ElementName=Month}" Foreground="Red" />
  </StackPanel>


<!-- STYLINGS FOR THE COMBOBOX -->

 <!-- Overrides the combo boxes items in the list -->
    <Style x:Key="ComboBox" TargetType="{x:Type ComboBoxItem}">
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type ComboBoxItem}">
                    <Border x:Name="Bd" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" Padding="{TemplateBinding Padding}" SnapsToDevicePixels="True">
                        <ContentPresenter ContentTemplate="{TemplateBinding ContentTemplate}" Content="{TemplateBinding Content}" ContentStringFormat="{TemplateBinding ContentStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Border>
                    <ControlTemplate.Triggers>
                        <Trigger Property="IsEnabled" Value="False">
                            <Setter Property="TextElement.Foreground" Value="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}"/>
                        </Trigger>
                        <Trigger Property="IsMouseOver" Value="True">
                            <Setter Property="Background" Value="{StaticResource LightGreyBrush}"/>
                        </Trigger>
                        <Trigger Property="IsSelected" Value="True">
                            <Setter Property="Background" Value="{StaticResource BlueBrush}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>
    </Style>


    <!-- Watermark combo box style and template. -->
    <Style x:Key="WatermarkComboBoxStyle1" TargetType="{x:Type xctk:WatermarkComboBox}">
        <Setter Property="Foreground" Value="{StaticResource WhiteColorBrush}" />
        <Setter Property="FontSize" Value="{StaticResource FontSize20}" />
        <Setter Property="FontFamily" Value="{StaticResource LatoRegular}" />
        <Setter Property="ItemContainerStyle" Value="{StaticResource ComboBox}" />
        <Setter Property="MinWidth" Value="120" />
        <Setter Property="MaxHeight" Value="30" />

        <Setter Property="WatermarkTemplate">
            <Setter.Value>
                <DataTemplate>
                    <ContentControl Content="{Binding}" Foreground="{DynamicResource {x:Static SystemColors.GrayTextBrushKey}}" Focusable="False">
                    </ContentControl>
                </DataTemplate>
            </Setter.Value>
        </Setter>
        <Setter Property="Template">
            <Setter.Value>
                <ControlTemplate TargetType="{x:Type xctk:WatermarkComboBox}">
                    <Grid x:Name="templateRoot" SnapsToDevicePixels="True">
                        <Grid.ColumnDefinitions>
                            <ColumnDefinition Width="*"/>
                            <ColumnDefinition MinWidth="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}" Width="0"/>
                        </Grid.ColumnDefinitions>
                        <Popup x:Name="Popup" Placement="Bottom" IsOpen="{TemplateBinding IsDropDownOpen}" AllowsTransparency="True"  Focusable="False" PopupAnimation="Slide" Width="120">
                            <Grid  x:Name="DropDown" SnapsToDevicePixels="True" MinWidth="{TemplateBinding ActualWidth}" MaxHeight="{TemplateBinding MaxDropDownHeight}">
                                <Border x:Name="DropDownBorder" Background="{StaticResource DarkGreyBrush}" />
                                <ScrollViewer SnapsToDevicePixels="True" Foreground="{StaticResource WhiteColorBrush}" FontFamily="{StaticResource LatoRegular}" FontSize="{StaticResource FontSize20}" VerticalAlignment="Center">
                                    <StackPanel IsItemsHost="True" />
                                </ScrollViewer>
                            </Grid>
                        </Popup>

                        <ToggleButton x:Name="toggleButton" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Grid.ColumnSpan="2" IsChecked="{Binding IsDropDownOpen, Mode=TwoWay, RelativeSource={RelativeSource TemplatedParent}}">
                            <ToggleButton.Style>
                                <Style TargetType="{x:Type ToggleButton}">
                                    <Setter Property="Template">
                                        <Setter.Value>
                                            <ControlTemplate TargetType="{x:Type ToggleButton}">

                                                <!-- Setting the default dark grey background for the combo box
                                                     and trying to change the background to red when an IDataErrorInfo validation error has occurred, however, it does not change-->
                                                <Border x:Name="templateRoot" SnapsToDevicePixels="True">
                                                    <Border.Style>
                                                        <Style TargetType="{x:Type Border}">
                                                            <Setter Property="Background" Value="{StaticResource DarkGreyBrush}" />
                                                            <Style.Triggers>
                                                                <Trigger Property="Validation.HasError" Value="True">
                                                                    <Setter Property="Background" Value="Red" />
                                                                </Trigger>
                                                            </Style.Triggers>
                                                        </Style>
                                                    </Border.Style>

                                                    <Border x:Name="splitBorder" BorderBrush="Transparent" BorderThickness="1" HorizontalAlignment="Right" Margin="0" SnapsToDevicePixels="True" Width="{DynamicResource {x:Static SystemParameters.VerticalScrollBarWidthKey}}">
                                                        <Path x:Name="Arrow" Grid.Column="1"  Fill="{StaticResource WhiteColorBrush}" HorizontalAlignment="Center" VerticalAlignment="Center" Data="M 0 0 L 4 4 L 8 0 Z"/>
                                                    </Border>
                                                </Border>

                                                <!-- Control triggers to change the background of the combo box when it is pressed.
                                                     Also attempting to change the background of the ComboBox's background to red on a validation error however, it doesnt change-->
                                                <ControlTemplate.Triggers>
                                                    <DataTrigger Binding="{Binding ElementName=toggleButton, Path=IsChecked}"  Value="True">
                                                        <Setter Property="Background" TargetName="templateRoot" Value="{StaticResource LightGreyBrush}" />
                                                    </DataTrigger>
                                                    <Trigger Property="Validation.HasError" Value="True">
                                                        <Setter TargetName="templateRoot" Property="Background" Value="Red" />
                                                    </Trigger>
                                                </ControlTemplate.Triggers>
                                            </ControlTemplate>
                                        </Setter.Value>
                                    </Setter>
                                </Style>
                            </ToggleButton.Style>
                        </ToggleButton>

                        <ContentPresenter x:Name="contentPresenter" ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}" Content="{TemplateBinding SelectionBoxItem}" ContentStringFormat="{TemplateBinding SelectionBoxItemStringFormat}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsHitTestVisible="False" Margin="{TemplateBinding Padding}" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                        <TextBox x:Name="PART_EditableTextBox" Visibility="Hidden" />
                        <ContentPresenter x:Name="PART_WatermarkHost" ContentTemplate="{TemplateBinding WatermarkTemplate}" Content="{TemplateBinding Watermark}" HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" IsHitTestVisible="False" Margin="{TemplateBinding Padding}" Visibility="Collapsed" VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
                    </Grid>
                    <ControlTemplate.Triggers>
                        <DataTrigger Binding="{Binding SelectedMonth}" Value="{x:Null}">
                            <Setter Property="Visibility" TargetName="PART_WatermarkHost" Value="Visible"/>
                        </DataTrigger>
                        <Trigger Property="Validation.HasError" Value="True">
                            <Setter Property="ToolTip" Value="{Binding RelativeSource={x:Static RelativeSource.Self}, Path=(Validation.Errors)[0].ErrorContent}" />
                        </Trigger>
                    </ControlTemplate.Triggers>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

        <Style.Triggers>
            <Trigger Property="Validation.HasError" Value="True">
                <Setter Property="Background" Value="Red" />
            </Trigger>
        </Style.Triggers>
    </Style>

Answer 1

尝试使用绑定到父项DataTrigger的{{1}}附加属性的Validation.HasError：

WatermarkComboBox

更改ComboBox的验证样式WPF

1 个答案: