Architecture & DesignGetting Up and Running with the Composite UI Application Block for WPF

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

Developer.com content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More.

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 FilesMicrosoft 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 FilesMicrosoft Smart Client Factory April 2008Lib” 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.

Exploring the Sample Application

Once you can build the WPF sample application “Quickstarts.WPFIntegration” successfully, it is time to take a quick look at how it is organized in Solution Explorer. Overall, the solution has two high-level solution folders: Blocks and Source. The Blocks folder contains the projects that form the three main building blocks of the CAB.

Source, on the other hand, contains the sample application code. If you expand this folder, you will find another solution folder named Infrastructure. This in turn contains four projects: the Shell, and then three more for application interfaces, modules, and libraries.

The execution starting point is in the Shell project. If you open up the file ShellApplication.cs, you will notice a class defined like this:

class ShellApplication : SmartClientApplication<
   WorkItem, ShellForm>

With this declaration, the ShellApplication class is defined using generics, so that the SmartClientApplication class (defined in the WPFIntegration.Infrastructure.Library project) knows the basic class types for the application main form and the work items.

The defined ShellApplication class has a regular static void Main() function, and contains startup code for the application. Notice how the Run method call differs slightly from a generic WinForms application Run method call:

private static void RunInDebugMode()
{
   Application.SetCompatibleTextRenderingDefault(false);
   new ShellApplication().Run();
}

After the Run call, the execution goes to the SmartClientApplication class’s AddServices method. Here, the most important services are added to the collection maintained by the RootWorkItem class. This class is the main (root) work item for the whole project, and keeps track of all other work items in the project.

Following the AddServices call, the execution goes to library code that loads the registered modules, and then proceeds to create the main application form, which is in the sample application’s case named ShellForm. Here, workspaces are initialized to contain the SmartParts that are to display the application’s main controls: an organization chart and a set of fields to edit database data (see Figure 3).

Figure 3: The sample application running. On the left is a WPF SmartPart displaying an organization chart.

Often, the best way to learn how an application works is to first browse through the source code, and then start running it under the debugger. By stepping the application one code line at a time, you will quickly learn how the application bootstraps, and how control is transferred within the application controls, services, and modules.

Conclusion

In this article, you learned what the Microsoft Composite UI Application Block for WPF (CAB for WPF) is, why it is useful, and how you can get started with one of the sample applications provided in the CAB installation kit.

Although the architecture of CAB is somewhat complex, it is still designed to take complexity away from larger applications. It takes some time to master the inner workings of CAB, but once you are past that phase and actually start using CAB in your own applications, you will notice that you are able to build complicated solutions faster and with less effort.

Once you develop additional applications, it is easier to re-use older code, thanks to the loosely-coupled objects suggested by the block. Thus, the main design goals of CAB—modularity, extensibility, and productivity—are easily met.

If you become a fan of Microsoft’s freely-available Patterns & Practices, you also might want to start investigating the other application blocks part of the Smart Client Software Factory (SCSF). For example, the ObjectBuilder and Disconnected Service Agent Application blocks are part of SCSF, and might interest you quite a bit.

But, even though you would only focus on CAB, you have a great set of ready-made classes to support your development efforts. Especially with the recent addition of WPF support, you can start designing applications that use the latest .NET technologies.

Good luck with your adventures in patterns and best practices!

Jani Järvinen

Links

Use these links to download and learn more about the Composite UI Application Block for WPF.

About the Author

Jani Järvinen is a software development trainer and consultant in Finland. He is a Microsoft C# MVP and has written dozens of magazine articles and three books about software development. He is a group leader of a Finnish software development expert group at ITpro.fi. His frequently updated blog can be found at http://www.saunalahti.fi/janij/. You can send him mail by clicking on his name at the top of the article.

Get the Free Newsletter!

Subscribe to Developer Insider for top news, trends & analysis

Latest Posts

Related Stories