WPF ICommand in MVVM

Prabhat Kumar
11y
263.3k
0
5

Article

Introduction

Commands provide a mechanism for the view to update the model in the MVVM architecture. Commands provide a way to search the element tree for a command handler. The ICommand interface is defined inside the System.Windows.Input namespace. It has two methods and an event.

bool CanExecute(object parameter);
void Execute(object parameter);
event EventHandler CanExecuteChanged;

The Execute method is only invoked when CanExecute returns true. In case the CanExecute method returns false then the binding control is disabled automatically.

In order to know the CanExecute value, listen to the CanExecuteChanged event, that may vary based on the parameter passed.

Using Code

Use of ICommand

The ICommand interface is generally used in the MVVM architecture. Here in the Button control the Command property is bound to the "UpdateCommand". Since UpdateCommand is nothing but an ICommand instance, while loading the window it will check the CanExecute return value and if it returns true then it will enable the button control and the Execute method is ready to be used otherwise the button control is disabled.

Passing a parameter to the CanExecute and Execute methods

A parameter can be passed through the "CommandParameter" property. Once the button is clicked the selected address value is passed to the ICommand.Execute method.

The CommandParameter is sent to both CanExecute and Execute events.

Tasks of CanExecuteChanged

CanExecuteChanged notifies any command sources (like a Button or CheckBox) that are bound to that ICommand that the value returned by CanExecute has changed. Command sources care about this because they generally need to update their status accordingly (eg. a Button will disable itself if CanExecute() returns false).

Listen CanExecuteChanged

The CommandManager.RequerySuggested event is raised whenever the CommandManager thinks that something has changed that will affect the ability of commands to execute. This might be a change of focus, for example. This event happens to fire a lot.

        public event EventHandler CanExecuteChanged
{
  add { CommandManager.RequerySuggested += value; }
  remove { CommandManager.RequerySuggested -= value; }
}

ICommand in MVVM

Model

Create a folder named Model and a class named Person. Implement INotifyPropertyChanged and override the PropertyChanged event. Define two properties, Name and Address.

public class Person : INotifyPropertyChanged
{
  private string name;
  private string address;

public event PropertyChangedEventHandler PropertyChanged;
public void OnPropertyChanged(string propertyName)
{
  if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(propertyName));
}
}

public string Name
{
  get
{
return name;
}
set
{
name = value;
OnPropertyChanged("Name");
}
}

public string Address
{
get
{
return address;
}
set
{
address = value;
OnPropertyChanged("Address");
}
}
}

ViewModel

Create a folder named ViewModel and a class named PersonViewModel. Initialize a List object of type person. Expose this object through the Persons property. Also expose an ICommand instance in this class.

Define a class Updater and implement ICommand interface.

public class PersonViewModel
{
  private IList<Person> _personList;
  public PersonViewModel()
{
_personList = new List<Person>()
{
  new Person(){Name="Prabhat", Address="Bangalore"},
  new Person(){Name="John",Address="Delhi"}
};
}
  public IList<Person> Persons
{
  get { return _personList; }
  set { _personList = value; }
}
  private ICommand mUpdater;
  public ICommand UpdateCommand
{
  get
{
  if (mUpdater == null)
mUpdater = new Updater();
  return mUpdater;
}
set
{
mUpdater = value;
}
}
}
class Updater : ICommand
{
#region ICommand Members

  public bool CanExecute(object parameter)
{
  return true;
}
  public event EventHandler CanExecuteChanged
{
  add { CommandManager.RequerySuggested += value; }
  remove { CommandManager.RequerySuggested -= value; }
}

public void Execute(object parameter)
{
//Your Code
}
#endregion
}

View

Create a view folder and a Person.xaml class. Bind the command to the button control. Once the button is clicked, the command parameter is passed to the Execute method. You can also bind a command to any control that supports the command property. the TextBox is bound with listView selectedItem.

  <ListView.View>
   <GridView>
   <GridViewColumn Header="Name" DisplayMemberBinding="{Binding Name}" />

App.xaml.cs

Override the OnStartup method of the Application class. Initialize a view and viewModel class and wrap a viewmodel to the view by the DataContext property.

protected override void OnStartup(StartupEventArgs e)
{
base.OnStartup(e);
View.Person person = new View.Person();
PersonViewModel personViewModel = new PersonViewModel();
person.DataContext = personViewModel;
person.Show();
}

Summary

What is ICommand in WPF.
How ICommand used in MVVM architecture.
MVVM architecture flow.
How to pass parameter in CanExecute and Execute method.
How to listen to CanExecuteChanged event.

Point Of Interest

Instead of events, commands have been used in the MVVM architecture. We cannot pass a parameter to the event but we can pass a parameter through a command.

Up Next

Ebook Download

View all

Printing in C# Made Easy

Read by 10.8k people

Download Now!

Learn

View all