How to call Commands from UI Control in MVVM pattern

We will use RelayCommands to register Execute and CanExcute command handlers in MVVM pattern.

To achieve this we will create a class RelayCommand.

/// <summary>     /// To register commands in MMVM pattern     /// </summary>     public class RelayCommand : ICommand     {         readonly Action<object> _execute;         readonly Predicate<object> _canExecute;         /// <summary>         /// Constructer takes Execute events to register in CommandManager.         /// </summary>         /// <param name="execute">Execute method as action.</param>         public RelayCommand(Action<object> execute)             : this(execute, null)         {             try             {                 if (null == execute)                 {                     throw new NotImplementedException("Not implemented");                 }                 _execute = execute;             }             catch (Exception)             {                 throw;             }         }         /// <summary>         /// Constructer takes Execute and CanExcecute events to register in CommandManager.         /// </summary>         /// <param name="execute">Execute method as action.</param>         /// <param name="canExecute">CanExecute method as return bool type.</param>         public RelayCommand(Action<object> execute, Predicate<object> canExecute)         {             try             {                 if (null == execute)                 {                     _execute = null;                     throw new NotImplementedException("Not implemented");                 }                 _execute = execute;                 _canExecute = canExecute;             }             catch (Exception)             {             }         }         /// <summary>         /// Can Executed Changed Event         /// </summary>         public event EventHandler CanExecuteChanged         {             add             {                 CommandManager.RequerySuggested += value;             }             remove             {                 CommandManager.RequerySuggested -= value;             }         }         /// <summary>         /// Execute method.         /// </summary>         /// <param name="parameter">Method paramenter.</param>         public void Execute(object parameter)         {             _execute(parameter);         }         /// <summary>         /// CanExecute method.         /// </summary>         /// <param name="parameter">Method paramenter.</param>         /// <returns>Return true if can execute.</returns>         public bool CanExecute(object parameter)         {             return _canExecute == null ? true : _canExecute(parameter);         }     }

Now in MVVM pattern we need to declare a command in View Model that will be bind with the Command property of the WPF Control.

We will create a ICommand property and in get section will register the Execute and CanExecute handlers for the command. The arguments “Param” would be used for Command Parameter.

ICommand _saveSettingsCommand;         public ICommand SaveSettingsCommand         {             get             {                 if (_saveSettingsCommand == null)                     _saveSettingsCommand = new RelayCommand(param => this.SaveSettingsCommand_Execute(param), param => this.SaveSettingsCommand_CanExecute(param));                 return _saveSettingsCommand;             }         }         bool SaveSettingsCommand_CanExecute(object param)         {             return true;         }         void SaveSettingsCommand_Execute(object param)         {             if (_applicationVM == null || _configurationLabwareVM == null || !_isEditable)                 return;             Configure(!IsSelected);         }

This is done!

Now just call this command from the control in the view which is bounded with the view model where this command defined.

The Command Binding will look like this.

<telerik:RadButton Grid.Column="1"                    Name="radButton1"                    MinWidth="70"                    HorizontalAlignment="Stretch"                    VerticalAlignment="Center"                    Background="{Binding StatusBrush}"                    Height="20"                    Command="{Binding SaveSettingsCommand}"                    CommandParameter="{Binding LabwareID}"                    >

Go through the steps I defined above. It is very easy to work with commands in WPF.

Enjoy!!!