antigravity-skills-reference/skills/avalonia-viewmodels-zafiro/navigation_sections.md

Navigation & Sections

Zafiro provides powerful abstractions for managing application-wide navigation and modular UI sections.

Navigation with INavigator

The INavigator interface is used to switch between different views or viewmodels.

public class MyViewModel(INavigator navigator)
{
    public async Task GoToDetails()
    {
        await navigator.Navigate(() => new DetailsViewModel());
    }
}

UI Sections

Sections are modular parts of the UI (like tabs or sidebar items) that can be automatically registered.

The [Section] Attribute

ViewModels intended to be sections should be marked with the [Section] attribute.

[Section("Wallet", icon: "fa-wallet")]
public class WalletSectionViewModel : IWalletSectionViewModel
{
    // ...
}

Automatic Registration

In the CompositionRoot, sections can be automatically registered:

services.AddAnnotatedSections(logger);
services.AddSectionsFromAttributes(logger);

Switching Sections

You can switch the current active section via the IShellViewModel:

shellViewModel.SetSection("Browse");

Important

The icon parameter in the [Section] attribute supports FontAwesome icons (e.g., fa-home) when configured with ProjektankerIconControlProvider.