devexpress WinForms MVVM

WinForms MVVM

This section is dedicated to the Model-View-ViewModel (MVVM) architectural pattern. You will find all required info about its basic concepts and ways to implement it in WinForms applications. The 'Tutorials' group contains multiple step-by-step tutorials that accumulate theoretical concepts from the 'Concepts' group to create a sample application, built entirely in accordance to all MVVM concepts.

 

What is MVVM?

 

The MVVM pattern is well-known among WPF developers. The main idea of this pattern is separating your application into three semi-independent layers.

• Model - the data layer. Refers either to a domain model, which represents the real state content (an object-oriented approach), or to the data access layer that represents that content (a data-centric approach).
• View - the user interface layer. Contains all elements displayed by the application GUI (buttons, panels, labels, editors, etc.).
• ViewModel - the nexus between a Model and a View. This layer is an abstraction of the View that exposes public properties and commands, used to bind your data to GUI elements and manage this data.

The diagram below illustrates MVVM layers and their communication means.

By separating the graphical user interface from the business logic, this pattern provides multiple advantages, such as more efficient code management (e.g., covering it with unit tests) or the ability to modify the application interface without needing to touch your business logic.

 

MVVM in WinForms. Presenter.

 

The MVVM pattern was introduced specifically for the WPF platform. WinForms developers who will try to follow its concepts will eventually face multiple major issues, for instance:

• data binding in WinForms is more complex and less agile;
• WinForms platform features only events and methods instead of bindable WPF commands.

These issues force WinForms developers to write a decent amount of additional code behind. This code is often considered as a separate fourth layer - Presenter. Presenter manages all interaction between a ViewModel and a View that goes beyond simple command bindings and extends the "pure" MVVM pattern into MVPVM.

Typically, the Presenter layer includes the following:

• UserControls and their code behind;
• internal classes;
• methods that tweak and customize controls within the View;
• event handlers;
• bindings;
• other specific code snippets.

Thus, the WinForms platform has multiple limitations, which ultimately meand that WinForms developers will have to code more. The DevExpress MVVM Framework offers another way of overcoming all the mentioned issues.

 

DevExpress MVVM Framework

 

Since MVVM is nothing more than a concept rather than a set of strict rules to follow, developers can implement it differently depending on their needs. Many third-party vendors offer different approaches to introduce these concepts to your application development. DevExpress makes no difference has its own vision of MVVM and its own framework to implement it.

What truly excels the DevExpress MVVM Framework is its cross-platform nature: the one framework to develop both WPF and WinForms apps with ease and elegance. This framework extends the WinForms platform and grants it the following features, which it originally lacks:

• flexible data bindings;
• commands and command bindings;
• behaviors and services;
• an advanced way to implement notifications and commands.

Other benefits are:

• the MVVM Context component, available from the toolbox that simplifies creating MVVM applications;
• POCO classes support;
• rich interoperability with other DevExpress WinForms controls;
• Template Gallery templates, created specifically for MVVM apps;
• fluent API and Data Annotation Attributes support;
• various design time capabilities.

All these features allow you to create an almost "pure" MVVM application and get rid of the Presenter layer (and thus of excessive code).

 

MVVM Learning Center

 

The MVVM pattern can be tricky to learn for developers that have never used it before. To ensure your quick start into MVVM development, this documentation is bound with the 'MVVM Best Practices' demo, available from the DevExpress Demo Center. This demo contains dozens of small samples, grouped into modules. Every document from the 'Concepts' section has a code sample and a notification that shows which demo example is linked to this text block. Thus, instead of copying code samples to your test application, you can simply launch the demo, choose the related module and check out how this or that feature works. The following figure illustrates regions of this demo.

1. Module Chooser. Selects the current demo module. Each module contains multiple examples, dedicated to the specific topic (e.g., data bindings or commands). There are three groups of demo modules:
   • API Code Examples. Each module from this section contains tiny samples that illustrate how most basic tasks are implemented.
   • Navigation. This group contains modules that illustrate how to build the sample 'Expenses' application based on various services. The Tutorials section contains tutorials that help you to create this sample app all by yourself.
   • Views. Modules in this group illustrate edit forms from the sample 'Expenses' application built using different layout controls.
2. Example Chooser. Lists all examples, available for the selected module.
3. Live Example Code. Highlights the code region that provides the target functionality, illustrated in this example. You can modify this code right in the demo window.
4. Preview Section. An example preview, updated on the fly in accordance to the code from the Live Example Code region.
5. Run In Visual Studio. Launches your Visual Studio with the currently viewed example as a project. This allows you to observe the entire example code.

The entire demo is also available as a separate Support Center example. Coupled with this documentation section, the MVVM Best Practices demo creates a powerful learning center for you to discover the DevExpress MVVM Framework and test it on live examples at the same time.

 

MVVM Documentation Sections

 

• Concepts
  This section gathers
  documents that illustrate how to implement most basic tasks using the DevExpress
  Framework: bind properties, create and bind commands, use triggers to update one
  UI element in accordance to another, convert values of bindable properties,
  implement layer communication and much more.
• Design-time Support
  Includes
  articles that introduce design-time features that allow you to code less. The Control-based Services topic describes in
  details all DevExpress services, first mentioned in the Services document.
• Tutorials
  A set of step-by-step
  tutorials that guide you through the process of creation of the sample
  'Expenses' application.