Add validations playground sample

samples/ControlGallery/ControlGallery/ControlGallery.csproj

@@ -23,12 +23,14 @@
   </ItemGroup>
 
   <ItemGroup>
+    <PackageReference Include="Accelist.FluentValidation.Blazor" Version="3.0.0" />
     <PackageReference Include="SkiaSharp.Views.Forms" Version="2.80.1" />
     <PackageReference Include="Xamarin.Forms" Version="4.8.0.1451" />
     <PackageReference Include="Xamarin.Essentials" Version="1.5.3.2" />
   </ItemGroup>
 
   <ItemGroup>
+    <ProjectReference Include="..\..\..\src\Microsoft.MobileBlazorBindings.Forms\Microsoft.MobileBlazorBindings.Forms.csproj" />
     <ProjectReference Include="..\..\..\src\Microsoft.MobileBlazorBindings.SkiaSharp\Microsoft.MobileBlazorBindings.SkiaSharp.csproj" />
     <!--
       NOTE: This project doesn't currently use any DualScreen features, but this reference is here

samples/ControlGallery/ControlGallery/Models/LogInModel.cs

@@ -0,0 +1,16 @@
+using System.ComponentModel.DataAnnotations;
+
+namespace ControlGallery.Models
+{
+    public class LogInModel
+    {
+        [Required, EmailAddress]
+        public string Email { get; set; }
+
+        [Required, MinLength(8), MaxLength(16)]
+        public string Password { get; set; }
+
+        [Required, MinLength(8), MaxLength(16)]
+        public string ConfirmPassword { get; set; }
+    }
+}

samples/ControlGallery/ControlGallery/Models/LogInModelValidator.cs

@@ -0,0 +1,24 @@
+using FluentValidation;
+
+namespace ControlGallery.Models
+{
+    public class LogInModelValidator : AbstractValidator<LogInModel>
+    {
+        public LogInModelValidator()
+        {
+            RuleFor(m => m.Email)
+                .NotNull()
+                .EmailAddress();
+
+            RuleFor(m => m.Password)
+                .NotNull()
+                .Length(8, 16);
+
+            RuleFor(m => m.ConfirmPassword)
+                .Cascade(CascadeMode.StopOnFirstFailure)
+                .NotNull()
+                .Equal(m => m.Password)
+                .WithMessage("'{PropertyName}' should be equal to '{ComparisonProperty}'");
+        }
+    }
+}

samples/ControlGallery/ControlGallery/Views/PlaygroundList.razor

@@ -9,6 +9,7 @@
             <Button Text="Navigation playground" OnClick="@(async () => await NavigationManager.NavigateToAsync("/navigation"))"></Button>
             <Button Text="Gesture playground" OnClick="@(async () => await NavigationManager.NavigateToAsync("/gestureplayground"))"></Button>
             <Button Text="Skia Playground" OnClick="@(async () => await NavigationManager.NavigateToAsync("/skia"))"></Button>
+            <Button Text="Validations Playground" OnClick="@(async () => await NavigationManager.NavigateToAsync("/validations"))"></Button>
         </StackLayout>
     </ScrollView>
 </ContentPage>

samples/ControlGallery/ControlGallery/Views/Validations.razor

@@ -0,0 +1,48 @@
+@using Microsoft.AspNetCore.Components.Forms
+@using Microsoft.MobileBlazorBindings.Forms
+@using ControlGallery.Models
+
+@page "/validations"
+
+<ContentView>
+    <StackLayout>
+        <Button Text="Add FluentValidator" OnClick="AddFluentValidator" IsEnabled="!useFluentValidator" />
+        <Button Text="Add DataAnnotationsValidator" OnClick="AddDataAnnotationsValidator" IsEnabled="!useDataAnnotationsValidator" />
+
+        <CascadingEditContext Model="LogInModel">
+            @if (useFluentValidator)
+            {
+                <FluentValidator Validator="new LogInModelValidator()" />
+            }
+            @if (useDataAnnotationsValidator)
+            {
+                <DataAnnotationsValidator />
+            }
+
+            <ValidatedEntry @bind-Text="@LogInModel.Email" Placeholder="Email" />
+            <ValidationLabel For="@(() => LogInModel.Email)" TextColor="Color.Red" />
+
+            <ValidatedEntry @bind-Text="@LogInModel.Password" Placeholder="Password" />
+            <ValidationLabel For="@(() => LogInModel.Password)" TextColor="Color.Red" />
+
+            <ValidatedEntry @bind-Text="@LogInModel.ConfirmPassword" Placeholder="Confirm password" />
+            <ValidationLabel For="@(() => LogInModel.ConfirmPassword)" TextColor="Color.Red" />
+
+            <SubmitButton Text="Submit" OnValidSubmit="OnValidSubmit" OnInvalidSubmit="OnInvalidSubmit" />
+            <Label Text="@statusText" />
+        </CascadingEditContext>
+    </StackLayout>
+</ContentView>
+
+@code {
+    LogInModel LogInModel { get; } = new LogInModel();
+    bool useFluentValidator = false;
+    bool useDataAnnotationsValidator = false;
+    string statusText;
+
+    void OnValidSubmit() => statusText = "Success!";
+    void OnInvalidSubmit() => statusText = "Failure!";
+
+    void AddFluentValidator() => useFluentValidator = true;
+    void AddDataAnnotationsValidator() => useDataAnnotationsValidator = true;
+}