WPF - Warning icon shows with red borders only, without red box

Question

How to change the red box around a TextBox to a red circle with an exclamation mark? On error, WPF can show either a red border around a TextBox or a warning icon. When I create a simple test application to test validation rules, I get only red borders. But I saw warning icons on screenshots of WPF applications with red boxes. My boss asked me to setup such icons for our test app.

I tried to look at wpf-samples: they use standard warning icon from CSLA with no additional coding. I have no idea why I have only CSLA's red borders instead of CSLA's warning icon while I tried to follow validation samples.

P.S. I can create the icon manually, but I have a strict requirement to use the standard one that appears automaticaly on validation error. Following code shows how I do it manually:

    <Style TargetType="{x:Type TextBox}">
        <Setter Property="Validation.ErrorTemplate">
            <Setter.Value>
                <ControlTemplate>
                    <DockPanel>
                        <AdornedElementPlaceholder >
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition />
                            </Grid.RowDefinitions>
                            <Grid.ColumnDefinitions>
                                <ColumnDefinition />
                            </Grid.ColumnDefinitions>
                            <Ellipse HorizontalAlignment="Right"
                                     Grid.Row="0" 
                                     Grid.Column="0" 
                                     Height="20" 
                                     Width="20" 
                                     Fill="Red" VerticalAlignment="Center" />
                                <TextBlock HorizontalAlignment="Right"                                           
                                       Grid.Row="0" 
                                       Grid.Column="0" 
                                       Foreground="White" 
                                       FontSize="20">!</TextBlock>
                        </Grid>
                        </AdornedElementPlaceholder>
                    </DockPanel>
                </ControlTemplate>
            </Setter.Value>
        </Setter>

        <Style.Triggers>
            <Trigger Property="Validation.HasError" Value="true">
                <Setter Property="ToolTip" 
                        Value="{Binding RelativeSource={x:Static RelativeSource.Self},
                        Path=(Validation.Errors)[0].ErrorContent}"/>
            </Trigger>
        </Style.Triggers>
    </Style>

Answer 1

SystemIcons.Exclamation will probably give you symbol you want. Object of type Icon needs to be converted into BitmapSource to be able to use in xaml.

Answer 2

WPF does not have any automatic way to display anything besides the red border around an input control.

CSLA doesn't display anything at all. It tells WPF that there's a validation error by using the IDataErrorInfo interface defined by Microsoft. What you are seeing is the default WPF behavior of displaying a red border.

You can customize how WPF displays validation errors by creating new XAML styles.

However, the Csla.Xaml namespace (available if you have referenced the CSLA-WPF NuGet package in your UI project) includes a WPF control called PropertyStatus. This control understands how to display error, warning, and info icons, along with tooltips, based on the IDataErrorInfo interface and other metadata exposed by a CSLA business object.

To use the PropertyStatus control you can put the control directly into your page's XAML, or create a XAML style. You can see an example of using this control in the CSLA reference app: ProjectTracker.