CODEWITHSUNDEEP
c#wpfcomboboxstylescontroltemplate
Tomtom
Tomtom

Reputation: 9394

Borders around ControlTemplate for ComboBox

I have the following ControlTemplate for the Validation of a ComboBox

<ControlTemplate x:Key="ComboBoxHighlightTemplate" TargetType="Control">
    <Grid ClipToBounds="False">
        <Border BorderBrush="{StaticResource fokusBrush}" BorderThickness="2.5" Margin="-1" Visibility="{Binding ElementName=adornedElementHighligh,
            Path=AdornedElement.(Validation.Errors)[0].ErrorContent, Converter={StaticResource inverseErrorContentVisibilityConverter}}">
            <AdornedElementPlaceholder Name="adornedElementHighligh"/>
        </Border>

        <Border BorderBrush="Red" BorderThickness="1" Margin="-1" Visibility="{Binding ElementName=adornedElement,
            Path=AdornedElement.(Validation.Errors)[0].ErrorContent, Converter={StaticResource errorContentToErrorVisibilityConverter}}">
            <AdornedElementPlaceholder Name="adornedElement" />
        </Border>
        <Image HorizontalAlignment="Right" VerticalAlignment="Top" Visibility="{Binding ElementName=adornedElement,
            Path=AdornedElement.(Validation.Errors)[0].ErrorContent, Converter={StaticResource errorContentToErrorVisibilityConverter}}"
                Width="16" Height="16" Margin="0,-9,-9,0" Source="{x:Static helper:ImageHelper.ErrorImage}"
                ToolTip="{Binding ElementName=adornedElement, Path=AdornedElement.(Validation.Errors)[0].ErrorContent}" />
    </Grid>
</ControlTemplate>

Depending on the ErrorContent I decide which Border I draw around the ComboBox.

The Converter ErrorContentToErrorVisibilityConverter looks like

internal class ErrorContentToErrorVisibilityConverter : IValueConverter
{
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
    {
        if (value is string)
        {
            if (((string) value).EndsWith("not an error"))
                return Visibility.Hidden;
        }
        return Visibility.Visible;
    }

    public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
    {
        throw new NotImplementedException();
    }
}

Everything just works fine. But if I produce an error in my ComboBox so that the ControlTemplate for Errors is shows, the bounds of the drawn borders are not at the "real" borders of the ComboBox.

The usage of the ControlTemplate looks like:

Upvotes: 0

Views: 262

Answers (1)

pushpraj
pushpraj

Reputation: 13669

here is a sample template, I did try to simplify it for you

    <ControlTemplate x:Key="ComboBoxHighlightTemplate"
                     TargetType="Control">
        <Grid ClipToBounds="False">
            <AdornedElementPlaceholder Name="adornedElement" />
            <Border BorderBrush="Red"
                    BorderThickness="1"
                    x:Name="errorBorder" />
            <Image HorizontalAlignment="Right"
                   VerticalAlignment="Top"
                   x:Name="image"
                   Width="16"
                   Height="16"
                   Margin="0,-9,-9,0"
                   Source="{x:Static helper:ImageHelper.ErrorImage}"
                   ToolTip="{Binding ElementName=adornedElement, Path=AdornedElement.(Validation.Errors)[0].ErrorContent}" />
        </Grid>
        <ControlTemplate.Triggers>
            <DataTrigger Binding="{Binding AdornedElement.(Validation.Errors)[0].ErrorContent, ElementName=adornedElement,Converter={StaticResource errorContentToErrorVisibilityConverter}}"
                         Value="Hidden">
                <Setter Property="BorderBrush"
                        TargetName="errorBorder"
                        Value="{StaticResource fokusBrush}" />
                <Setter Property="BorderThickness"
                        TargetName="errorBorder"
                        Value="2.5" />
                <Setter Property="Visibility"
                        TargetName="image"
                        Value="Collapsed" />
            </DataTrigger>
        </ControlTemplate.Triggers>
    </ControlTemplate>

try it and let me know how close is this to your results, we may also simplify the trigger a bit further, I did this on assumptions.

Upvotes: 1

Related Questions