MVVM View / ViewModel Communication - MVVM

What is MVVM View / ViewModel Communication?

On this chapter, we can learn how to upload interactivity to MVVM applications and how to cleanly call logic. you will also see that all of that is completed through maintaining the loose coupling and excellent structuring which is the heart of the MVVM pattern. To recognize all this, first allow us to learn about commands.

View / ViewModel Communication Via Commands

The command sample has been well documented and frequently uses layout pattern for multiple decades. on this pattern there are two major actors, the invoker and the receiver.

MVVM – View / ViewModel Communication

Invoker

  • The invoker is a piece of code that could execute a few imperative logic.
  • Usually, it is a UI detail that the user interacts with, in the context of a UI framework.
  • It may simply be another chunk of logic code some other place within the application.

Receiver

  • The receiver is the logic this is intended for execution whilst the invoker fires.
  • In the context of MVVM, the receiver is usually a way on your ViewModel that desires to be called.

In between those , you have an obstruction layer, which suggests the invoker and receiver do not need to explicitly recognize about each different. this is generally represented as an interface abstraction exposed to the invoker and a concrete implementation of that interface is capable of calling the receiver.

let’s have a look at a easy instance wherein you will learn the instructions and how to use them to communicate among View and ViewModel. in this chapter, we can maintain with the identical example from the last chapter.

In StudentView.xaml document, we have a ListBox which hooks up the student information from a ViewModel. Now allow’s add a button for deleting a student from the ListBox.

The critical issue is that working with instructions on button is very easy because they have a command assets to hook as much as an ICommand.

So, we can expose a assets on our ViewModel that has an ICommand and binds to it from the button’s command property as shown within the following code.

Let’s upload a new class for your project, for you to implement the ICommand interface. Following is the implementation of ICommand interface.

As you can see, this is a simple delegating implementation of ICommand wherein we have two delegates one for the executeMethod and one for the canExecuteMethod which may be passed in on construction.

In the above implementation, there are two overloaded constructors, one for only executeMethod and one for each executeMethod and i can canExecuteMethod.

Let’s add a property of MyICommand type in StudentView version class. Now we need to construct an example in the StudentViewModel. we will use the overloaded constructor of MyICommand that takes two parameters.

Now add the implementation of OnDelete and CanDelete methods.

We also want to feature a new SelectedStudent in order that the user can delete the chosen item from ListBox.

Following is the complete implementation of ViewModel class.

In StudentView.xaml, we want to feature SelectedItem property in a ListBox so that you can bind to the SelectStudent property.

Following is the complete xaml file.

When the above code is compiled and executed, you will see the following window.

MVVM – View / ViewModel Communication

You can see that delete button is disabled. It will be enabled when you select any item.

MVVM – View / ViewModel Communication

While you choose any item and press delete. you may see that the chosen object list is deleted and the delete button once more becomes disabled.

MVVM – View / ViewModel Communication

We suggest you to execute the above example in a step-by-step way for better understanding.

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd DMCA.com Protection Status

MVVM Topics