Uno Simple Toolkit Library

UnoFeatures: Toolkit;SimpleTheme (add to <UnoFeatures> in your .csproj)

The Uno Simple Toolkit provides a set of resources and styles based on the Uno Simple design system for the controls included in the base Uno Toolkit library

Getting Started

Initialization of the Simple Toolkit resources is handled by the specialized SimpleToolkitTheme ResourceDictionary.

`SimpleToolkitTheme`

Note

The SimpleToolkitTheme class also handles the required initialization of the Uno Simple resources. Therefore, there is no need to initialize SimpleTheme within the App.xaml

Constructors

Constructor	Description
`SimpleToolkitTheme()`	Initializes a new instance of the `SimpleToolkitTheme` resource dictionary.
`SimpleToolkitTheme(ResourceDictionary? colorOverride, ResourceDictionary? fontOverride)`	Initializes a new instance of the `SimpleToolkitTheme` resource dictionary and applies the given overrides

Properties

SimpleToolkitTheme inherits its configuration from Uno Themes. Refer to Uno Simple customization and the shared theme property reference.

Installation

Note

Make sure to setup your environment first by following our instructions.

Creating a new project with the Uno Simple Toolkit

Wizard
CLI

Follow the steps in the Getting Started with Visual Studio instructions to launch the Uno Platform Template Wizard.
Select Simple under the Theme section.
Select Toolkit under the Features section.

Installing Uno Simple Toolkit in an existing project

Depending on the type of project template that the Uno Platform application was created with, follow the instructions below to install the Uno Simple Toolkit.

Edit your project file (PROJECT_NAME.csproj) and add Toolkit and SimpleTheme to the list of UnoFeatures:
```
<UnoFeatures>Toolkit;SimpleTheme</UnoFeatures>
```

Initialize SimpleToolkitTheme in the App.xaml:

<Application.Resources>
    <ResourceDictionary>
        <ResourceDictionary.MergedDictionaries>

            <!-- Code omitted of brevity -->

            <SimpleToolkitTheme xmlns="using:Uno.Toolkit.UI.Simple" />
        </ResourceDictionary.MergedDictionaries>
    </ResourceDictionary>
</Application.Resources>

In the Solution Explorer panel, right-click on your app's App Code Library project (PROJECT_NAME.csproj) and select Manage NuGet Packages...
Install the Uno.Toolkit.WinUI.Simple

Add the SimpleToolkitTheme to AppResources.xaml:

<ResourceDictionary>
    <ResourceDictionary.MergedDictionaries>

        <SimpleToolkitTheme xmlns="using:Uno.Toolkit.UI.Simple" />

    </ResourceDictionary.MergedDictionaries>
</ResourceDictionary>

In the Solution Explorer panel, right-click on your solution name and select Manage NuGet Packages for Solution .... Choose either:
- The Uno.Toolkit.UI.Simple package when targetting Xamarin/UWP
- The Uno.Toolkit.WinUI.Simple package when targetting net6.0+/WinUI
Select the following projects for installation:
- PROJECT_NAME.Wasm.csproj
- PROJECT_NAME.Mobile.csproj (or PROJECT_NAME.iOS.csproj, PROJECT_NAME.Droid.csproj, and PROJECT_NAME.macOS.csproj if you have an existing project)
- PROJECT_NAME.Skia.Gtk.csproj
- PROJECT_NAME.Skia.WPF.csproj
- PROJECT_NAME.Windows.csproj (or PROJECT_NAME.UWP.csproj for existing projects)

Add the following resources inside App.xaml:

<Application ...>
    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>

                <!-- Load WinUI resources -->
                <XamlControlsResources xmlns="using:Microsoft.UI.Xaml.Controls" />

                <SimpleToolkitTheme xmlns="using:Uno.Toolkit.UI.Simple" />

                <!-- Load custom application resources -->
                <!-- ... -->

            </ResourceDictionary.MergedDictionaries>
        </ResourceDictionary>
    </Application.Resources>
</Application>

Customization

Apply the properties shown in Uno Themes examples directly to SimpleToolkitTheme. It initializes the underlying theme and Toolkit resources, so do not add a separate SimpleTheme.

Customize Colors

Follow the Uno Simple color override guide, using SimpleToolkitTheme as the theme dictionary.

Customize Fonts

Follow the Uno Themes typography guide and Uno Simple font guide.

Toolkit control-specific aliases such as NavigationBarFontFamily and DividerSubHeaderFontFamily retain their own override keys; DefaultFontFamily does not regenerate these aliases. See NavigationBar styling and Divider styling.

Customize Default Density

Follow the Uno Themes guides for spacing and density. Fixed Toolkit padding and margins remain independent of the generated spacing scale.

Customize Default Corner Radius

Follow the Uno Themes shape customization guide.

Seed Color Customization

Follow the Uno Themes seed color guide, using the Toolkit theme in its examples.