CherylUI theme for your Uno Platform Applications

by

I’ve talked a lot in the past about how XAML applications lend themselves to being styled using data and control templates. The Uno Platform, which defaults to the Fluent theme, also supports Material, which adjusts the control templates for the in-box controls according to the Material theme from Google. In this post we’re going to look at CherylUI, an open source theme that you can apply to your Uno Platform application.

Getting Started

To switch your Uno Platform application across to using the CherylUI theme, there’s three things you need to do:

  1. Add a reference to the CherylUI.Uno nuget package
  2. Add the Cheryl.Uno style dictionary to your App.xaml (ie <ResourceDictionary Source="ms-appx:///Cheryl.Uno/Styles/Index.xaml" />)
  3. Add the InteractiveContainer to the root of your Page.

Hot Design Enabled

Now that you’ve got the setup done, you can start to build out the UI of your application. Here’s a short video where I replace the default content of the application with the InteractiveContainer and then proceed to add an instance of the MobileDatePicker. This is all done using Hot Design, rather than having to manually write the XAML.

The great thing about the CherylUI nuget package is that it not only adjusts the theme of the built in controls, it also offers a number of great controls, such as the MobileDatePicker, that you can use as you build your application. You can even check out the GitHub repository in order to see the Styles and Templates that are being used.

Leave a comment