Dew Drop – July 10, 2012 (#1,360)

Top Links

 

.NET / Visual Studio

 

Web Development

 

Design / Methodology / Testing

 

Silverlight / WPF / Windows Phone

 

Podcasts / Screencasts / Videos

 

Community / Events

 

Database

 

Miscellaneous

 

More Link Collections

 

The Geek Shelf

 

Dew Drop – July 3, 2012 (#1,356)

Top Links

 

.NET / Visual Studio

 

Web Development

 

Design / Methodology / Testing

 

Silverlight / WPF / Windows Phone

 

Podcasts / Screencasts / Videos

 

Community / Events

 

Database

 

SharePoint

 

Miscellaneous

 

More Link Collections

 

The Geek Shelf

JavaScript 24-Hour Trainer (Wrox Programmer to Programmer) by Jeremy McPeak

 

The Dew Review – DevExpress DXv2 WPF 2012.1

Intro

I recently had the opportunity to use a beta release of the WPF controls coming in the exciting new 2012.1 release of DevExpress DXv2. This release is a major one for DevExpress’ WPF suite, the biggest addition being a set of Metro-inspired controls. With these controls, developers will have the ability to create desktop applications that look and feel like Windows 8 Metro apps. I had previously only used the ASP.NET controls from DevExpress, and I was pleasantly surprised at how easy it was to pick up the WPF controls and start using them. Here is a quick review of my impressions.

Install Experience

Even the installer has been given the Metro treatment. It looks cool, clean and simple. It feels more like an application than an installer. Kudos to the team for not forgetting how important first impressions can be. Here are a couple of the installer screens.

installer_welcome

Figure 1 – Installer Welcome Screen

installer_readytoinstall

Figure 2 – Ready to Install

Demo Center

After the installer completes, it launches a Metro-styled Demo Center. There are several WPF demo applications to explore, including Video Rental, Realtor World, a Stock Market Trader and a mail client. The full source is available for each of the demo applications as well. I decided to explore the Realtor World app because it looks and feels like a Windows 8 Metro app.

devexpress demo-center

Figure 3 – The Demo Center

wpf-demos

Figure 4 – WPF Demos

Realtor World includes a main screen with Windows 8 styled buttons to navigate to the other screens in the app. The other screens show off controls like a Metro-styled listbox, graphs and charts. It is a cool-looking app that looks like something you would install from the Windows Marketplace in Windows 8.

realtorworld_home

Figure 5 – Realtor World Main Screen

realtorworld_loancalc

Figure 6 – Realtor World Loan Calculator

WPF Project Templates

When you start a new WPF project, you have a couple of options. You can create a regular WPF Application project, or you can use the DXperience v12.1 WPF Application project template that is included with the controls.

newproject

Figure 7 – The New Project Dialog

If you choose the DevExpress template, you are presented with another dialog where you can choose which features to include in the main dialog of your new application, such as Dock Manager, Toolbar Manager, Ribbon, Grid, Theming and others. Each of those features can be tweaked from the dialog. For example, if you choose to include the dock manager, you can select from different styles for the docked windows. One of the styles looks like Visual Studio tool windows which can be pinned, auto-hide or float. The can look even more like Visual Studio windows if you choose the Visual Studio 2010 theme for your application.

Controls

After playing around with the demos and tools for building a new project, I decided to get down to business and start a new project as if I were building a real application from scratch. When I build WPF apps, always use the Model-View-ViewModel (MVVM) pattern and usually use Laurent Bugion’s open source MVVM Light Toolkit. I found that the DXv2 controls’ data binding just works in MVVM applications.

Overall, the controls are intuitive to use and good-looking too. I built a simple music library application on top of the Chinook database. I used a DXRibbonWindow with the MetropolisDark theme, a BarManager, DockLayoutManager, a GridControl, and the TileLayoutControl. I am still working on enhancing the app, but putting together a nice looking read-only UI took only a few hours.

MyMusicLibary_blend

Figure 8 – Building ‘My Music Library’ in Expression Blend (In Progress)

Summary

I had a lot of fun developing with the WPF controls in DXv2. I am really looking forward to spending more time with the controls and enhancing my application. You can download and try a trial version of the tools today. I think you will be as impressed as I was.

Disclosure of Material Connection: I received one or more of the products or services mentioned above for free in the hope that I would mention it on my blog. Regardless, I only recommend products or services I use personally and believe my readers will enjoy. I am disclosing this in accordance with the Federal Trade Commission’s 16 CFR, Part 255: “Guides Concerning the Use of Endorsements and Testimonials in Advertising.