loading experience

Avalonia UI

Avalonia: MVVM e binding compilati

Organizzare un'applicazione Avalonia con ViewModel, ViewLocator e binding verificati a compilazione.

Avalonia: MVVM e binding compilati

Il template MVVM di Avalonia prepara già la struttura: cartelle Views e ViewModels, un ViewLocator che associa automaticamente ogni ViewModel alla sua vista e i binding compilati attivi di default.

Cambiare schermata significa cambiare il ViewModel corrente.
Cambiare schermata significa cambiare il ViewModel corrente.

Binding compilati

Con i binding compilati il compilatore XAML verifica che ogni proprietà esista davvero nel ViewModel: un errore di battitura diventa un errore di compilazione, non un campo vuoto scoperto dall'utente.

<PropertyGroup>
  <AvaloniaUseCompiledBindingsByDefault>true</AvaloniaUseCompiledBindingsByDefault>
</PropertyGroup>
<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:vm="using:Magazzino.ViewModels"
             x:Class="Magazzino.Views.ArticoliView"
             x:DataType="vm:ArticoliViewModel">
    <DockPanel Margin="16">
        <TextBox DockPanel.Dock="Top" Watermark="Cerca..." Text="{Binding Filtro}" />
        <ListBox ItemsSource="{Binding Articoli}" SelectedItem="{Binding Selezionato}">
            <ListBox.ItemTemplate>
                <DataTemplate x:DataType="vm:ArticoloRiga">
                    <TextBlock Text="{Binding Descrizione}" />
                </DataTemplate>
            </ListBox.ItemTemplate>
        </ListBox>
    </DockPanel>
</UserControl>

Il ViewModel

public partial class ArticoliViewModel(ICatalogo catalogo) : ViewModelBase
{
    [ObservableProperty]
    public partial string Filtro { get; set; } = "";

    [ObservableProperty]
    public partial ArticoloRiga? Selezionato { get; set; }

    public ObservableCollection<ArticoloRiga> Articoli { get; } = [];

    partial void OnFiltroChanged(string value) => _ = AggiornaAsync(value);

    private async Task AggiornaAsync(string filtro)
    {
        var risultati = await catalogo.CercaAsync(filtro);
        Articoli.Clear();
        foreach (var r in risultati) Articoli.Add(r);
    }
}

CommunityToolkit.Mvvm funziona con Avalonia esattamente come con MAUI e WPF: i metodi parziali On...Changed generati permettono di reagire alle modifiche delle proprietà. In alternativa, il template offre anche ReactiveUI, molto usato nell'ecosistema Avalonia.

Navigazione tra viste

Un ViewModel principale espone una proprietà con il ViewModel corrente; un ContentControl la mostra e il ViewLocator sceglie la vista giusta. Cambiare schermata significa solo cambiare quell'oggetto.

Commenti (0)

Nessun commento ancora.

Lascia un commento