Questions about data validation

[SCLDGit]

Hey all,

I'm currently researching porting one of our desktop applications that makes heavy use of DevExpress tooling for both controls, and speedier MVVM workflow. ReactiveUI seems very similar for the MVVM stuff, but there are some things we take for granted in DX as far as validation goes for which I haven't been able to find a good equivalent in Avalonia/Reactive, and any advice would be much appreciated.

First, and example of how a ViewModel might be set up in DX:

using System.ComponentModel.DataAnnotations;
using System.Security;
using DevExpress.Mvvm.DataAnnotations;
using DevExpress.Mvvm.POCO;

namespace MyApp.ViewModels
{
    [MetadataType(typeof(MetaData))]
    [POCOViewModel(ImplementIDataErrorInfo = true)]
    public class MyViewModel
    {
        public class MetaData : IMetadataProvider<MyViewModel>
        {
            void IMetadataProvider<MyViewModel>.BuildMetadata
                (MetadataBuilder<MyViewModel> p_builder)
            {
                p_builder.Property(p_vm => p_vm.UserName).MatchesInstanceRule(
                    (value, instance) => !string.IsNullOrEmpty(value), () => "'Name' field cannot be empty.");
                p_builder.Property(p_vm => p_vm.Password).MatchesInstanceRule(
                    (value, instance) => !string.IsNullOrEmpty(Utilities.SecureStringToString(value)), () => "'Password' field cannot be empty.");
            }
        }

        protected MyViewModel()
        {
            UserName = string.Empty;
        }

        public static MyViewModel Create()
        {
            return ViewModelSource.Create(() => new MyViewModel());
        }

        public virtual string UserName { get; set; }
        public virtual SecureString Password { get; set; }

    }
}

We use a simple metadata builder to define validation rules. These can be as simple or as complex as needed. Viewmodels are instanced with the static Create() method, which takes care of automatically registering the virtual properties with change notifications and whatnot at runtime.

Now, some xaml of a bound control:

<dxe:TextEdit Text="{Binding UserName, Mode=TwoWay, UpdateSourceTrigger=PropertyChanged, ValidatesOnDataErrors=True}" ValidateOnTextInput="True"/>

With those things set up, we get a textbox like this when we run:

My question is, how can I get the equivalent effect in Avalonia? I've had some success with a ViewModel like the following:

public class MainWindowViewModel : ReactiveValidationObject
    {
        public MainWindowViewModel()
        {
            this.ValidationRule(
                x => x.UserName,
                name => !string.IsNullOrWhiteSpace(name),
                "User name shouldn't be null or white space.");        
        }
        
        [Reactive]
        public string UserName { get; set; }
    }

When bound to a textbox, it does appear to get a red border when validation is not met, but I don't get any icon nor tooltip indicating as much (although I've seen other Avalonia users asking about validation with such an icon and matching error tooltip).

What is the preferred/correct way to do this with MVVM in the Avalonia framework? Am I on the right path? Completely off? Looking for something that isn't implemented?

[danwalmsley]

@SCLDGit does your mvvm framework implement INotifyDataErrorInfo

You can see an example custom implementation here...
https://github.com/zkSNACKs/WalletWasabi/blob/master/WalletWasabi.Fluent/ViewModels/ViewModelBase.cs

or ReactiveUI has inbuilt validation support.

However id have thought your existing framework would implement that interface and be compatible?

[SCLDGit]

@danwalmsley It does implement it via the [POCOViewModel(ImplementIDataErrorInfo = true)] property, but I'm not 100% how that gets set up under the hood when .Create() is called. Regardless, it does not appear to properly attach to the textbox.

I have gotten ReactiveUI to work (I think...) with the second viewmodel example above, and I'm certainly not against the idea of porting our existing validation to Reactive's syntax, but at that point my concern becomes getting the GUI to behave the way I'd like (something like what the first post shows here).

[maxkatz6]

Probably related
#5497

[SCLDGit]

This came down to #5497 . Validation currently works as expected when using the Default theme. Only the Fluent theme has the issue where the error is not displayed as a tooltip.