In this tutorial, I will show you how to install and work with Avalonia and Avalonia.Templates.
First, about Avalonia:
Avalonia is a WPF/UWP-inspired cross-platform XAML-based UI framework providing a flexible styling system and supporting a wide range of Operating Systems such as Windows (.NET Framework, .NET Core), Linux (via Xorg), MacOS and with experimental support for Android and iOS.
The easiest way to get started with Avalonia from Visual Studio is to install the extension from the Visual Studio Marketplace.
Create an Empty project, I rename this with this name: Avalonia001.
From the main menu I select the Tools – NuGet Package Manager – Manage NuGet Packages for Solution… or use Package Manager Console and use this command, see:
1 2 3 4 5 6 | PM> Install-Package Avalonia ... Added package 'Avalonia.0.10.7' to 'packages.config' Successfully installed 'Avalonia 0.10.7' to Avalonia001 Executing nuget actions took 25.85 sec Time Elapsed: 00:01:02.3171534 |
This will install the Avalonia package.
Next, install Avalonia templates:
1 2 3 4 5 | C:\CSharpProjects>git clone https://github.com/AvaloniaUI/avalonia-dotnet-templates --recursive ... C:\CSharpProjects>cd avalonia-dotnet-templates-master C:\CSharpProjects\avalonia-dotnet-templates-master>dotnet new -i Avalonia.Templates ... |
MVVM is the recommended pattern for creating Avalonia applications. The MVVM application template uses ReactiveUI to ease building applications with complex interactions.
To create a new MVVM application called MyApp in its own subdirectory, run:
1 | dotnet new avalonia.mvvm -o MyApp |
To create a new Window called MyNewWindow, in the namespace MyApp run:
1 | dotnet new avalonia.window -na MyApp -n MyNewWindow |
To create a new UserControl called MyNewView, in the namespace MyApp run:
1 | dotnet new avalonia.usercontrol -na MyApp -n MyNewView |
To create a new Styles list called MyStyles, run:
1 | dotnet new avalonia.styles -n MyStyles |
To create a new ResourceDictionary called MyResources, run:
1 | dotnet new avalonia.styles -n MyStyles |
To create a new barebones application called MyApp in its own subdirectory, run:
1 | dotnet new avalonia.app -o MyApp |
Because I want to use an application I use this command:
1 2 | C:\CSharpProjects\Avalonia001\Avalonia001>dotnet new avalonia.app -o Avalonia001 --force The template "Avalonia .NET Core App" was created successfully. |
The Visual Studio will refresh the source code with the new files.
If I run this the result will be a window with a text message: Welcome to Avalonia!
This message comes from MainWindow.axaml file.