Build an Avalonia app

This tutorial creates a desktop Fabulous 10 application, connects MVU state to Avalonia widgets, runs tests, and prepares a release build. Use the multi-platform template only when you also need Android or iOS hosts.

The template and standard Avalonia controls do not require a commercial control license. Avalonia also offers premium controls under a freemium model; read Avalonia licensing before adding extension controls.

Create and run

dotnet new install Fabulous.Avalonia.Templates
dotnet new fabulous-avalonia -n Counter
cd Counter
dotnet restore
dotnet run -c Debug

Confirm that template installation selected a 10.0.x package. The maintained Avalonia MVU CounterApp is the reference implementation: it uses Program.statefulWithCmd, tracing, exception handling, Component, layouts, events, and modifiers. The app selects DesktopApplication or SingleViewApplication at compile time, so shared UI stays in one file while each target keeps a small native host.

Change the app

Follow one message end to end: Button("Increment", Increment) dispatches Increment; update creates a model with a larger count; the component observes the program through Context.Mvu; and TextBlock receives the new value. Fabulous diffs that widget description against the previous one and updates the existing Avalonia controls.

Add another message and control using the same pattern. Use VStack, HStack, Grid, Dock, or Canvas according to the layout behavior you need. Modifiers such as .centerHorizontal() and .margin(20.) return a new typed widget builder and can be chained.

For larger flows, start with basic navigation, then compare component navigation and navigation path. The Gallery is the compiled catalog for controls, styling, gestures, and extension packages.

Test and publish

dotnet build -c Release
dotnet publish -c Release -f net10.0 -r linux-x64 --self-contained true

Before publishing, add pure update tests and an Avalonia headless test. The repository's TestableApp demonstrates both and captures a screenshot artifact in CI; see testing and debugging. Runtime identifiers and mobile hosts are covered in deployment.