[Expand]General Information
[Collapse]WinForms Controls
  .NET Core Support
 [Expand]What's Installed
 [Expand]Build an Application
 [Collapse]Controls and Libraries
  [Expand]Forms and User Controls
  [Expand]Messages, Notifications, and Dialogs
  [Expand]Editors and Simple Controls
  [Expand]Ribbon, Bars and Menu
  [Expand]Application UI Manager
  [Expand]Docking Library
  [Expand]Data Grid
  [Expand]Vertical Grid
  [Expand]Property Grid
  [Expand]Pivot Grid
  [Expand]Tree List
  [Expand]Gantt Control
  [Expand]Chart Control
  [Expand]Map Control
  [Collapse]Rich Text Editor
   [Expand]Product Information
    Product Class Structure
    Supported Formats
   [Expand]Getting Started
   [Expand]RichEditControl Document
    Text Formatting
    Import and Export
   [Expand]Page Layout
    Spell Checking
    AutoCorrect Feature
    Track Changes
    Mail Merge
    Restrictions and Protection
   [Expand]Visual Elements
    Keyboard Shortcuts
    HTML Tag Support
    [Expand]Search and Replace
    [Expand]Spell Check
    [Expand]Import and Export
    [Expand]UI Customization
      How to: Bind a Command to a Button
      How to: Customize Built-in Command Using Service Substitution
  [Expand]Spell Checker
  [Expand]Form Layout Managers
  [Expand]Navigation Controls
  [Expand]PDF Viewer
  [Expand]TreeMap Control
  [Expand]Sunburst Control
 [Expand]Common Features
  Get More Help
 [Expand]API Reference
[Expand]ASP.NET Controls and MVC Extensions
[Expand]ASP.NET Bootstrap Controls
[Expand]ASP.NET Core Bootstrap Controls
[Expand]WPF Controls
[Expand]Xamarin Controls
[Expand]Windows 10 App Controls
[Expand]Office File API
[Expand]Report and Dashboard Server
[Expand]eXpressApp Framework
[Expand]eXpress Persistent Objects
[Expand]CodeRush Classic
[Expand]Cross-Platform Core Libraries
[Expand]Tools and Utilities
 End-User Documentation
View this topic on docs.devexpress.com (Learn more)

How to: Bind a Command to a Button

A command can be bound to virtually any UI element. This example demonstrates a simple case - how to bind the UndoCommand command to a SimpleButton control.

Expanded Description

First, we create a descendant of the SimpleButton class, named CommandButton. Then, add two fields which will distinguish it from a simple button - one field to hold a Command object, the other - to hold a RichEditControl. Add corresponding properties with getters and setters.

The Initialize method will perform an initial assignment of the control and command identifier, both of which are required to create a command for the command button. The command itself is obtained in the CreateCommand method.


You should always create a new instance of a command before execution.

Subscribe to the RichEditControl.UpdateUI event of the RichEditControl to be notified about changes affecting the control's user interface. The handler for this event should be able to update the UI for the command. We name this method "OnUpdateUI". Notice that setters for the Command and RichEditControl properties should also call the OnUpdateUI method.

To update the command UI we need an object representing the command UI state of our CommandButton. Let's name it CommandButtonUIState. It inherits from the ICommandUIState interface and implements the ICommandUIState.Checked, the ICommandUIState.Enabled and theICommandUIState.Visible properties. The OnUpdateUI method creates a command instance, the CommandButtonUIState instance and updates the command UI state by calling the command's Command.UpdateUIState method.

The setter for the Command property calls the OnUpdateUI method. The setter for the RichEditControl property unsubscribes from the RichEditControl.UpdateUI event before assignment, then subscribes back to UpdateUI event and calls the OnUpdateUI method.

The final step is to override the OnClick method in our SimpleButton descendant. When a CommandButton is clicked, it will create a command object instance and execute a command by calling its Command.Execute method.

Expanded Implementation

The following code demonstrates the implementation of the technique described above:

Expanded Usage

Expanded Command Adapter Technique

The Command Button technique seems rather straightforward, although it has its own drawbacks. It forces us to create as many descendant classes as there are user interface elements for which command binding is required. The next step is implementing a Command Adapter object which can serve as a helpful generalization of a command UI binding solution. A command adapter contains an additional field representing a UI element, the SimpleButton in our case. The CommandButtonAdapter implementation is demonstrated in the CodeCentral example.

Is this topic helpful?​​​​​​​