.NET MAUI DataForm Validation Styling

You can easily customize the validation look using the following styling properties:

• ValidationSummaryStyle(of type Style with target type DataFormValidationSummaryView)—Defines the style of the validation summary view.
• ValidationSummaryLabelStyle(of type Style with target type Label)—Defines the validation summary label style.
• ValidationSummaryImageStyle(of type Style with target type Image)—Defines the validation summary image style.

Example

The following examples demonstrate how to style the DataForm validation summary.

Define the RadDataForm

<telerik:RadDataForm x:Name="dataForm"
                     ValidationSummaryLabelStyle="{StaticResource ValidationLabelStyle}"
                     ValidationSummaryImageSource="away.png"
                     ValidationSummaryStyle="{StaticResource ValidationSummaryStyle}"
                     IsValidationSummaryVisible="True"
                     ValidationMode="LostFocus">
    <telerik:RadDataForm.BindingContext>
        <local:EditorsViewModel />
    </telerik:RadDataForm.BindingContext>
</telerik:RadDataForm>

Define the ValidationSummaryStyle

<Style x:Key="ValidationSummaryStyle" TargetType="telerik:DataFormValidationSummaryView">
    <Setter Property="BackgroundColor" Value="LightGrey" />
    <Setter Property="BorderThickness" Value="2" />
    <Setter Property="BorderColor" Value="Red" />
    <Setter Property="HorizontalOptions" Value="Center" />
</Style>

Define the ValidationLabelStyle

<Style x:Key="ValidationLabelStyle" TargetType="Label">
    <Setter Property="TextColor" Value="Red" />
    <Setter Property="VerticalTextAlignment" Value="Center" />
    <Setter Property="HorizontalTextAlignment" Value="Center" />
    <Setter Property="HorizontalOptions" Value="Center" />
</Style>

Add the following namespace:

xmlns:telerik="http://schemas.telerik.com/2022/xaml/maui"

The following image shows what the DataForm control looks like when the styles described above are applied:

See Also

• Editors Styling
• Groups Styling
• Error Message Styling
• Header Styling