EventToCommand

  • 4 minutes to read

The DevExpress.WinUI.Core.EventToCommand class is a Behavior that allows you to bind an event to a command. This way, the bound command is invoked like an event handler when the event is raised.

This topic describes how to use the EventToCommand behavior.

Specify an Event

Use the DevExpress.WinUI.Core.EventTriggerBase`1.EventName property to specify an event for the EventToCommand behavior:

<UserControl
    ...
    xmlns:dxmvvmi="using:DevExpress.WinUI.Mvvm.UI.Interactivity"
    xmlns:dxmvvm="using:DevExpress.WinUI.Mvvm.UI"
    xmlns:dxe="using:DevExpress.WinUI.Editors">

    <dxe:TextEdit>
        <dxmvvmi:Interaction.Behaviors>
            <dxmvvm:EventToCommand Command="{Binding LoadedCommand}" EventName="Loaded" />
        </dxmvvmi:Interaction.Behaviors>
    </dxe:TextEdit>
</UserControl>

Specify a Source Object

The source object is an object that has the event for processing by the EventToCommand. By default, the EventToCommand processes the defined event for the associated control. This scenario is shown below.

<UserControl ...>
    ...
    <dxmvvmi:Interaction.Behaviors>
        <dxmvvm:EventToCommand EventName="Loaded" Command="{Binding InitializeCommand}"/>
    </dxmvvmi:Interaction.Behaviors>
    ...
</UserControl>

If necessary, you can manually specify the source object for the EventToCommand. To do this, bind the DevExpress.WinUI.Core.EventTriggerBase<T>.SourceObject property, or specify the object’s name using the DevExpress.WinUI.Core.EventTriggerBase<T>.SourceName property.

<UserControl ...>
    ...
    <dxmvvmi:Interaction.Behaviors>
        <dxmvvm:EventToCommand SourceName="list" EventName="DoubleTapped" Command="{Binding InitializeCommand}"/>
        <dxmvvm:EventToCommand SourceObject="{Binding ElementName=list}" EventName="DoubleTapped" Command="{Binding InitializeCommand}"/>
    </dxmvvmi:Interaction.Behaviors>
    ...
        <ListBox x:Name="list" ... />
    ...
</UserControl>

Pass a Parameter to the Bound Command

You can add a parameter to the bound command using the DevExpress.WinUI.Core.EventToCommandBase.CommandParameter property.

<ListBox x:Name="list" ...>
    <dxmvvmi:Interaction.Behaviors>
        <dxmvvm:EventToCommand EventName="DoubleTapped" Command="{Binding EditCommand}" CommandParameter="{Binding ElementName=list, Path=SelectedItem}"/>
    </dxmvvmi:Interaction.Behaviors>
</ListBox>

Alternatively, you can pass the event’s arguments to the command as a parameter by setting the DevExpress.WinUI.Core.EventToCommand.PassEventArgsToCommand property to true.

<ListBox x:Name="list" ...>
    <dxmvvmi:Interaction.Behaviors>
        <dxmvvm:EventToCommand EventName="DoubleTapped" Command="{Binding EditCommand}" PassEventArgsToCommand="True"/>
    </dxmvvmi:Interaction.Behaviors>
</ListBox>

If you have a clean MVVM architecture, you may not want to pass event arguments to View Models. In this case, you can convert the event arguments to an object suitable for the command. To do this, specify a converter using the DevExpress.WinUI.Core.EventToCommand.EventArgsConverter property.

<ListBox x:Name="list" ...>
    <dxmvvmi:Interaction.Behaviors>
        <dxmvvm:EventToCommand EventName="DoubleTapped" Command="{Binding EditCommand}">
            <dxmvvm:EventToCommand.EventArgsConverter>
                <Common:CustomEventArgsConverter/>
            </dxmvvm:EventToCommand.EventArgsConverter>
        </dxmvvm:EventToCommand>
    </dxmvvmi:Interaction.Behaviors>
</ListBox>

The defined EventArgsConverter should implement the IEventArgsConverter interface. You can also derive the converter from the EventArgsConverterBase<TArgs> class, which already implements the IEventArgsConverter interface.

public interface IEventArgsConverter {
    object Convert(object sender, object args);
}
public abstract class EventArgsConverterBase<TArgs> : IEventArgsConverter {
    protected EventArgsConverterBase();
    protected abstract object Convert(object sender, TArgs args);
}

When you implement the converter, use the LayoutTreeHelper class that has useful functions to search nodes in the visual tree. For instance:

using DevExpress.WinUI.Mvvm.UI;
using System.Linq;
public class ListBoxEventArgsConverter : EventArgsConverterBase<MouseEventArgs> {
    protected override object Convert(object sender, MouseEventArgs args) {
        ListBox parentElement = (ListBox)sender;
        DependencyObject clickedElement = (DependencyObject)args.OriginalSource;
        ListBoxItem clickedListBoxItem = 
            LayoutTreeHelper.GetVisualParents(child: clickedElement, stopNode: parentElement)
            .OfType<ListBoxItem>()
            .FirstOrDefault();
        return clickedListBoxItem != null ? clickedListBoxItem.DataContext : null;
    }
}

Specify Modifier Keys as an Additional Condition of the Command Execution

The EventToCommand behavior allows you to invoke a command only when modifier keys are pressed. Use the DevExpress.WinUI.Core.EventToCommand.ModifierKeys property to specify modifier keys.

<UserControl x:Class="Example.View.MainView" ...
    xmlns:ViewModel="using:Example.ViewModel"
    xmlns:Common="using:Example.Common"
    xmlns:dxmvvm="using:DevExpress.WinUI.Mvvm.UI"
    xmlns:dxmvvmi="using:DevExpress.WinUI.Mvvm.UI.Interactivity"
    DataContext="{dxmvvm:ViewModelSource Type=ViewModel:MainViewModel}">
    ...
        <ListBox ItemsSource="{Binding Persons}">
            <dxmvvmi:Interaction.Behaviors>
                <dxmvvm:EventToCommand EventName="MouseLeftButtonUp" Command="{Binding EditCommand}" ModifierKeys="Alt">
                    <dxmvvm:EventToCommand.EventArgsConverter>
                        <Common:ListBoxEventArgsConverter/>
                    </dxmvvm:EventToCommand.EventArgsConverter>
                </dxmvvm:EventToCommand>
            </dxmvvmi:Interaction.Behaviors>
            ...
        </ListBox>
    ...
</UserControl>

In the example above, the bound EditCommand is invoked when an end user clicks a ListBoxItem while pressing the Alt key.

Mark Routed Events as Handled

Set the DevExpress.WinUI.Core.EventToCommandBase.MarkRoutedEventsAsHandled property to True to mark routed events as handled when the bound command is executed.

<dxmvvm:EventToCommand MarkRoutedEventsAsHandled="True" .../>

In this case, the EventToCommand sets the e.Handled parameter of corresponding event arguments to True immediately after the bound command is executed.

Disable a Control When a Command Cannot be Executed

The EventToCommand class has the DevExpress.WinUI.Core.EventToCommand.AllowChangingEventOwnerIsEnabled property, which is False (the default setting). If you set this property to True, the EventToCommand disables (sets the IsEnabled property to False) the associated control when the bound command cannot be executed (when the ICommand.CanExecute method returns False).

Process Events of a Disabled Control

The EventToCommand class has the DevExpress.WinUI.Core.EventToCommandBase.ProcessEventsFromDisabledEventOwner property, which is True (the default setting). This means that the EventToCommand processes events for the associated control even if the associated control is disabled. If you need to prevent this behavior, set the ProcessEventsFromDisabledEventOwner property to False.