benruehl / adonis-ui

Lightweight UI toolkit for WPF applications offering classic but enhanced windows visuals
https://benruehl.github.io/adonis-ui/
MIT License
1.71k stars 143 forks source link

Removing the warning icon from textboxes with a validation error #92

Closed micah686 closed 4 years ago

micah686 commented 4 years ago

I have a question regarding how you would remove the yellow triangle in the textboxes. I could have sworn there was a page that described how to set the icon to {x:Null}, but I can't find it. Is there a good way to set the icon to null, or remove the icon?

On a seperate note, you might want to update your README.md The links under the "Features" section, starting with "Read more about switching color schemes" go to a page not found instead of to your github pages documentation link

benruehl commented 4 years ago

Thanks for telling me about the readme. It is fixed now.

Regarding your question, there is no totally easy way of removing the icon. You have several options here I will try to explain below.

1. Disable validation for your control If you don't want any validation indicator at all, just set ValidatesOnBindingErrors on your binding to False. (MS docs) This also makes the red border disappear.

2. Completely remove the icon globally If you want to keep the red border and just remove the icon you can add the following style to your App.xaml

<Style TargetType="{x:Type controls:ValidationErrorIndicator}"
       BasedOn="{StaticResource {x:Type controls:ValidationErrorIndicator}}">
    <Setter Property="Width" Value="0"/>
    <Setter Property="Height" Value="0"/>
</Style>

Be aware that setting Visibility instead of Width and Height does not work because internal style triggers enforce the value of Visibility.

Although this makes the icon invisible the error message tool tips still remain visible as soon as the control is focused. If you want to remove those as well, you have to do this for each default style that contains the icon individually. So you need to include something like the following at some global point like App.Resources or Window.Resources:

<Style TargetType="TextBox"
       BasedOn="{StaticResource {x:Type TextBox}}">
    <Setter Property="adonisExtensions:ValidationExtension.IsErrorMessageVisibleOnFocus" Value="False"/>
    <Setter Property="adonisExtensions:ValidationExtension.IsErrorMessageVisibleOnMouseOver" Value="False"/>
</Style>

Repeat this for PasswordBox, ComboBox, CheckBox and DatePicker.

Of course, you can set this for individual controls as well:

<TextBox Text="{Binding Path=StringValue,
                        ValidatesOnDataErrors=True,
                        NotifyOnValidationError=True,
                        UpdateSourceTrigger=PropertyChanged}"
         adonisExtensions:ValidationExtension.IsErrorMessageVisibleOnFocus="False"/>

3. Change the icon If you just don't like the current icon and want to use your own, you can change its template by overriding it in your App.Resources, e.g. like so:

<DataTemplate x:Key="{x:Static adonisUi:Icons.Error}">
    <Viewbox Stretch="UniformToFill">
        <Canvas Width="256"
                Height="256">
            <Ellipse Fill="{Binding Background, RelativeSource={RelativeSource FindAncestor, AncestorType=Control}}"
                     Width="256"
                     Height="256"/>
        </Canvas>
    </Viewbox>
</DataTemplate>

This replaces the triangle with an ellipse.

Hope this helps.

benruehl commented 4 years ago

Closing this because there was no follow-up for a while. Feel free to reopen the issue in case the proposed solution did not work for you.