Avalonia UI on MacOS

October 17, 2024 by CryptoPatrick avalonia csharp dotnet

Description: How to get Avalonia setup on MacOS (Big Sur).

For VS Code users there’s an extension that can help speed up development process. You can find it on the VS Code Extension marketplace

Step: Install .NET

$ dotnet new install Avalonia.Templates
# Check installation:
$ dotnet --version

Step: Install Avalonia

Using the .NET CLI we install the Avalonia UI templates. We can install Avalonia project templates with the following command:

$ dotnet new install Avalonia.Templates

Create a project based on a template

Using the .NET CLI, dotnet, we create a new application folder, called NameOfApp, with project files inside.

#$ dotnet new avalonia.app -o MyApp
$ dotnet new avalonia.mvvm -o NameOfApp

Step: Run the Project

We build and run the application with one single command:

$ dotnet run

Step: Installing Themes

There are a number of themes that we can use to style our Avalonia App. Here’s a list of Avalonia Themes (some links may have died by the time you read this):

To use the downloaded theme in our application, we need to do two things:

1) Download the theme

Using the .NET CLI we download the theme we want to use:

dotnet add package Material.Avalonia
#dotnet add package Classic.Avalonia.Theme
#Install-Package Classic.Avalonia.Theme

2) Declare what theme to use

In our app we need to declare the name of the installed theme that we want to use:

  1. Download the project.
  2. Copy Themes folder to our project.
  3. Reference the theme in the project’s App.xaml file like the following:
<Application
	...
	<Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>
                <ResourceDictionary Source="/Themes/Styles/Generic.xaml"/>
            </ResourceDictionary.MergedDictionaries>
            <SolidColorBrush x:Key="AccentColorBrush" Color="#007ACC" />
        </ResourceDictionary>
    </Application.Resources>
</Application>

'I write to understand as much as to be understood.' —Elie Wiesel
(c) 2024 CryptoPatrick