WPF Metro Part 1 - Modern UI for WPF

Modern UI-for-WPF
  1. WPF Metro - Modern UI for WPF
  2. WPF Metro - MahApps Metro
  3. WPF Metro - Elysium
  4. WPF Metro - Elysium Extra

In these series of posts I'm going to do a quick review of a few different open source WPF Metro (Or Modern if you prefer) style SDK's. Each of them provides styles and new controls to build your WPF application from scratch. Here are the home pages for the open source projects in question where you can download the source code and the binaries to play with them yourself:

Modern UI for WPF

In this first post I will be discussing Modern UI for WPF. This is a very lightweight framework which has a complete set of styles for the built in WPF controls.

Look and Feel

The look of the application seems to borrow quite heavily from Microsoft's Zune application, which is Microsoft's equivalent of Apple's iTunes. Zune was used by Microsoft as an early test bed for their Metro style. Microsoft then went on from there to build Windows 8. This is Zune below:

Microsoft Zune Software

The Window style is quite stunning, mostly achieved by providing some very nice soft backgrounds to go with the option of white or black themes. The theme is fairly flexible, allowing a selection of 'Accent' colours and even selection of small and large font sizes. One cool feature I discovered is that changing the them does not simple change the colours but the Developer has used a colour animation to transition from one colour to another.

Modern UI for WPF Heart Background

Modern UI for WPF Themes

The controls themselves are more toned down. Employing simple grey lines and a very minimalist design. Most of the controls are slightly on the small side compared to Windows 8 but having played with Zune I can tell you that the developer has recreated everything pretty accurately.

Modern UI for WPF Input Controls

All the built in WPF controls seem to have been styled and a type ramp is even included, giving a simple way to show text in different guises. Validation of input is supported via the TextBox control. It would have been nice for other controls to have been supported too but it is very nicely done.

Custom Controls

ModernMenu

The main control of interest is the tab control called ModernMenu, this provides a very interesting multi-level tabbed experience. It allows you to split the tab contents into seperate user controls using the URI to the XAML page a bit like the Silverlight experience. Navigation is always a problem that needs to be solved in a WPF application and this is one very clean method of doing it.

Modern UI for WPF ModernMenu

ModernButton

A Windows 8 style circular app-bar button. Comes in two sizes.

Modern UI for WPF ModernButton

ModernWindow, ModernDialog and MessageBox

The developer has inherited from the Window class to create three very useful window types.

Modern UI for WPF ModernDialog

Modern UI for WPF MessageBox

ModernProgressRing

This is very easily the best progress indicator I have seen. It has several modes, allowing you to select the method of showing progress. Simply mesmerizing.

Modern UI for WPF ModernProgressRing

BBCodeBlock

This is a nice little control allowing you to use BB code to write some text.

Modern UI for WPF BBCodeBlock

Source Code

The source code seems pretty lightweight and nicely structured, with each controls style having it's own XAML file. There are only two DLL's which need to be deployed, they even provide a NuGet package which is great. Looking at the checking history, the single developer (The creator of XAML Spy no less) seems fairly active with the last check-in performed on 21st January 2014, so the project is still very much active. Looking at the discussion forums he seems to also be very helpful.

Conclusions

Overall I'm very impressed with this SDK, it's a labour of love from a single developer. It has a very high attention to detail and covers most bases for most developers, providing a full set of WPF styles.

If the developer is reading, I would suggest adding a tab in his sample showing the colours and brushes available to the developers and expanding his validation to other input controls.

This is a great project and it would be a pleasure to use any application developed using this SDK.

Web Mentions

What's this?

0 Replies

Comment

Initializing...