Getting Up and Running with the Composite UI Application Block for WPF

By design, large software applications should be developed from loosely coupled objects. This allows the code to be re-used in other projects because, for example, a business object class does not depend on the user interface components to work.

Because building large software applications is a considerable exercise in software architecture, it helps if somebody has already figured out the most annoying mistakes, and given others good ideas on how to proceed. With its Patterns & Practices offering, Microsoft has developed sets of software building blocks and documentation to help application developers build their solutions. These Patterns & Practices are free for everyone to use; therefore, as a Visual Studio and C# developer, you should take a look at what’s available.

In this article, you will learn about one of Microsoft’s patterns, namely the Composite UI Application Block. Because, according to Microsoft, Windows Presentation Foundation (WPF) is the future of regular Windows user interface applications, this article will also show you how to get started especially with the newly released WPF integration layer.

This WPF integration layer, released only a few months ago, allows WPF controls to be used in Composite UI Application Block applications. Traditionally, the Composite UI Application Block (or CAB, for short) has been used by Windows Forms (WinForms) developers, but as WPF applications are becoming more common, the block has been expanded to support WPF applications as well.

Although this sounds especially good to those ears already impressed with WPF’s capabilities, the application block currently does not support WPF-only applications. Instead, you still need to build traditional WinForms applications where you can embed WPF controls. The application block supports communication between these WPF and WinForms parts, so although your applications are not 100% WPF applications, you still get most (if not all) the benefits of WPF, plus the ability to gain from the application block.

Understanding the CAB

The Composite User Interface Application Block (CAB) is about creating maintainable applications that look and feel professional and use modern technologies. Naturally, all this should be available through a reduced development effort.

CAB is part of a larger framework called the Smart Client Software Factory, or SCSF. Overall, SCSF contains several .NET 2.0 or later—up to .NET 3.5—based blocks that focus on different parts of the development process, such as communications or disconnected environments. The simplified basic architecture of CAB is shown in Figure 1.

Figure 1: The basic architecture of CAB, simplified.

The CAB combines proven architectural patterns, such as decoupling, into use, and contains many source code examples that you can open up in your Visual Studio environment. However, because the application block itself is rather complex, it is worthwhile to learn the basic terms first.

Starting from the user interface level, you will probably first run into a component called a workspace. A workspace can be thought of as being areas on the user interface forms (think WinForms), which in turn contain visual components called SmartParts. SmartParts can represent any visual component, but they most typically represent combinations of simple controls, such as a set of text boxes, a treeview with labels, and so on. A SmartPart can be either a WPF control or a regular WinForms control.

Furthermore, a SmartPart can be shown or hidden as the application requires. The workspace in turn specifies how the SmartPart will be shown: in a tab, next to another SmartPart, in an MDI window, and so on. This gives the developer great flexibility.

To function, a SmartPart supports commands. CAB is influenced by the MVC pattern (Model-View-Controller), in which the user interface is separated from the application state and the operation logic. Thus, CAB allows the business logic of the application to be written separately from the UI. The business logic offers commands that the user can execute via the SmartParts, which can in turn be thought of as being the “V” in MVC.

In addition to direct commands, your application also can offer several services, which are more general purpose in nature than commands. A service is a supporting class to the application, and generally is very loosely coupled to the application. The CAB also contains several ready-made services for all applications, such as the module loading and cryptography services.

Together, your SmartParts, their state information, and services can be combined into a so-called work item, which contains all the necessary classes to support certain functionality in the application. The CAB documentation itself uses the UMLish term “use case” to describe the usage of work items. (UML stands for Unified Modeling Language.)

Finally, when all other parts of the application have been written, your CAB application will need a shell. The shell can be thought as being the wrapper around all the work items, services, and SmartParts that together make the application tick. The shell itself is the main application and contains the entry point. Thus, its responsibility is to correctly bootstrap the application.

Starting Up Visual Studio

At this point, you have the required basic understanding about the workings of the Composite UI Application Block, and are ready to proceed to the code and sample applications the block contains. If you already haven’t done so, you should start by installing the latest release of the Smart Client Software Factory (SCSF) package. At this writing, the April 2008 release is the latest one, and can be found in Microsoft’s downloads (see the Links section of this article).

The SCSF package is a 33 MB .MSI file that installs easily on your computer. In addition to the SCSF package, you also will need a small, 2 MB installer for the Guidance Automation Extensions (GAX) for Visual Studio. To make things easier, first make sure you have Visual Studio installed, then install GAX, and finally SCSF. Then, you are all set to start developing applications that utilize the CAB.

When you install the .MSI package for SCSF, you also get a chance to install a copy of the source code for the block, and also several example and tutorial applications. By default, SCSF installs into the directory “C:\Program Files\Microsoft Smart Client Factory April 2008”, under which you can find a subdirectory named “Source Code Installer”. In turn, this directory has an installer file that allows you to install the source code set into any location you choose.

In the separately installed source code directory, you will find many Visual Studio solution (.sln) files. One of them is called “Quickstarts.WPFIntegration.sln”, which is the one you should try first. When you open this solution, Visual Studio will look like Figure 2.

Figure 2: The sample WPF application opened up in Visual Studio 2008.

When you first try to build the solution, you will likely get error messages such as “The referenced assembly NN was not found” or “NN does not implement interface member MM“. Although this sounds bad for a sample application, there is luckily an easy remedy: Update the references in each project part of the solution to point to correct assemblies.

If you chose the default installation directory, the correct assemblies are located in the “C:\Program Files\Microsoft Smart Client Factory April 2008\Lib” directory. From here, you will find assemblies such as Microsoft.Practices.CompositeUI and Microsoft.Practices.CompositeUI.WPF, which you need to add to the references manually, and remove the invalid references, if any.

Once you are done with the reference corrections, it is time to test whether the solution builds. Do a full rebuild (just in case), and if it succeeds, run the sample application and test it. It should work well, and you should be able to see the nice and smooth, yet interactive organization chart next to employee details. It is the application block doing its magic.

More by Author

Must Read