WPF 4: Custom Command and Command Parameter for TextBox using Prism 4
Posted by: Mahesh Sabnis
in Category WPF
Abstract: Using Prism 4 application libraries, it is possible for us to attach custom Command and Behavior to any control. This supports code-less application development. In this article, we will use this concept to attach command and behaviour to a WPF Text Box.
Lately I have been more inclined towards Client application development using WPF and Silverlight and I am enjoying my experimentations with various controls and its behaviors. A couple of days ago, when I was conducting a WPF and Prism 4 training, a participant asked a question on attaching a custom command property for an input control like textbox. The scenario discussed was a WPF UI had a TextBox to accept input for data filtering (search the matching record.). The application was to be developed using WPF and Prism 4. The Prism 4 framework provide libraries using which loosely-coupled application with MVVM pattern can be developed.
Note: I have written an introductory article in the past for Silverlight too Prism 4: Defining Custom Command Behavior for ListBox control in Silverlight 4.0 and for WPF WPF 4: Developing End-to-End application using Prism 4 Commanding and DataGrid Custom Behavior
For this article I have used the following Prism 4 libraries:
Let us get started.
Step 1: Open VS2010 and create a WPF windows application, name it as ‘WPF4_Custom_Command_Behavior_TextBox’. Add the libraries listed above in the project. In the MainWindow.xaml, add a TextBlock, TextBox and DataGrid as below:
Step 2: In the project, add a new class file and call it ‘DataClasses.cs’. Add the following classes shown below. These classes are used as data stores.
Step 3: In the project, add a new class file and call it ‘CustomCommandBehaviorRepository.cs’. Now add a Command Behavior class for the TextBox event. Since the custom Command property is to be executed for the TextChanged event, the custom command behavior class must raise the TextChanged event as shown below:
The CommandBehaviorBase<T> is used to define a base behavior for connecting the control type to Command.
Step 4: We now need to specify the class for defining Command and CommandParameter property. This class also defines methods to set behavior for the TextBox. Command, CommandParameter and CommandBehavior properties are added as Dependency properties. The code is as shown below:
Step 5: Now we need to add a class for providing data to the UI element. This class should define the DelegateCommand<T> object which is bound with the textbox in XAML. This command object is responsible for executing action from the UI and making data available to the UI. The code is as below:
Note: Please read the comments carefully. It explains the role of every method.
Step 6: Open MainPage.Xaml and create an instance of the ApplicatonManagement class in Xaml. Also define Command and CommandParameter property of the TextBox as shown below:
Step 7: Run the application and the following result will be displayed:
Enter product name in the TextBox and the result is as shown below:
Conclusion: Using Prism 4 application libraries, it is possible for us to attach custom Command and Behavior to any control. This supports code-less application development.
The entire source code of this article can be downloaded over here