Reactiveui ReactiveCommand without OAPH

Hello everyone, I’m writing this post to to add value to one of my existing posts. That is MVVM pattern with ReactiveUI and Xamarin.Forms . Do you remember it ❓ No ❓ then you should go look read it, Yes ❓ then read this one carefully cause I’ll make good additions to it. Now let’s see ReactiveCommand OAPH.

What are the amelioration ?… you are surely asking your self. I’ll let you know but before that, you need to know where improvements could be done. In this tutorial, the Reactive commands declared in the view-models used OAPH to determine whether the commands could execute.There is nothing wrong with this. It functions absolutely well and my aim was to demonstrate the use of as many ReactiveUI features for the demo app as I could. But I didn’t mention that there was another way of accomplishing this CanExecute on Commands. So, what you should do instead is use simple bservables for this. As shown below.

Here is the code for this tutorial, and the pull request made without the OAPH.

OAPH is great and here is the documentation in case you want to know more.

We will take for instance the LoginViewModel’s LoginCommand. This command is a ReactiveCommand and instead of using the OAPH to determine if it can execute or not, do as follows ;

//Create the canLogin Observable
 var canLogin = this.WhenAnyValue(x => x.UserName, x => x.Password,
               (email, password) =>
               (
                   //Validate the password
                   !string.IsNullOrEmpty(password) && password.Length > 5
               )
               &&
               (
                   //Validate the email.
                   !string.IsNullOrEmpty(email)
                   &&
                   Regex.Matches(email, "^\\w+([-+.']\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$").Count == 1
               ));

//Add this observable to the LoginCommand
LoginCommand = ReactiveCommand.CreateFromTask(async () =>
            {

                var lg = await login.Login(_userName, _password);
                if (lg)
                {
                    HostScreen.Router
                                .Navigate
                                .Execute(new ItemsViewModel())
                                .Subscribe();
                }
            }, canLogin);

//Create the canLogin Observable

var canLogin = this.WhenAnyValue(x => x.UserName, x => x.Password,

(email, password) =>

(

//Validate the password

!string.IsNullOrEmpty(password) && password.Length > 5

)

(

//Validate the email.

!string.IsNullOrEmpty(email)

Regex.Matches(email, "^\\w+([-+.']\\w+)*@\\w+([-.]\\w+)*\\.\\w+([-.]\\w+)*$").Count == 1

));

//Add this observable to the LoginCommand

LoginCommand = ReactiveCommand.CreateFromTask(async () =>

{

var lg = await login.Login(_userName, _password);

if (lg)

{

HostScreen.Router

.Navigate

.Execute(new ItemsViewModel())

.Subscribe();

}

}, canLogin);

This can be done with any other ReactiveCommand where OAPH has been used. You should be able to accomplish this easily for any other project, since the creation of Observables as shown above is straight forward and in my opinion, requires less lines of codes.

If you liked this post, or it was useful to you, please ? like it, share it on twitter, facebook or other social media… in case you want to get updated on any new useful post, follow me on twitter and like my page on facebook. aaadfdf …

Check some other very usefull Xamarin Posts here.

Build a cross platform mobile app for your chat bot here.

Follow me on social media and stay updated