Tuesday, July 18, 2017

UWP Tip #3 - UWP Community Toolkit - Part 1, What's in the Box?

Once upon a time, Microsoft released a set of free controls for WPF developers. It was called the WPF Toolkit. It contained components such as DataGrid, DatePicker, Calendar, AutoCompleteBox, and a Chart control. Today's XAML developer would consider these to be basics that would be in the box with their framework. At the time, we saw them as a saving grace. The Extended WPF Toolkit took it a step further, but that's a tale for another blog.

Today's UWP offers these types of controls and much more with File-->New Project-->Blank App. Accordingly, today's toolkit delivers richer, more advanced tools.

Last August, hot on the heels of the Windows 10 Anniversary Update, Microsoft announced the UWP Community Toolkit. Earlier this month, the UWP Community Toolkit v1.5 was released. Unlike the WPF Toolkit of yesterday, this toolkit is about more than UI controls. Sure, it has controls. It has some pretty useful controls:

AdaptiveGridView - A grid to better handle today's wide variety of form factors.

HeaderedTextBlock - A read-only header/text combination.

HamburgerMenu - This has become a staple of modern app design.

ImageEX - Loads images async with a loading indicator, plus support for caching. My favorite control in the current collection.

RotatorTile - Similar to a live tile within your app.

PullToRefreshListView - All the cool kids with iOS love Pull to Refresh. Now your users will too.

RadialGauge - Everyone love a gauge control. This one is just what you expect.

RangeSelecter - A slider with two points for selecting a value range.

SlideableListItem - Slide your list items left or right to take actions on them. This has become a more common UX, especially in mobile email clients.

BladeControl - You know the Azure Portal? Those blade that slide back and forth as you navigate through sections. Yes, you can create that same experience in your apps now.

In addition to controls, the toolkit provides:

Code Helpers - A trove of helper methods for things like storage, streams, color handling, and converters for data binding.

Each part of the toolkit can be downloaded to your project via its NuGet Package, making it easy to pick and choose which parts of the toolkit you'll want to leverage in your app without adding unnecessary bloat. To get started, just manage the NuGet packages for your UWP project and search for "Microsoft.Toolkit.UWP":

Each package's description has enough information to easily identify which of them you will want to download to your project. You'll get any other dependent packages also… because Nuget.
The entire UWP Community Toolkit is Open Source. If there is something in the toolkit that needs a fix or enhancement, add an issue, fork it, create a pull request. You know the drill by now.

Next time, in UWP Tip #4, we will start building an application with the UWP Community Toolkit. In the coming weeks, I will examine the different parts of the toolkit over a series of posts.