在Avalonia中使用Community Toolkit & MVVM实现视图跳转按钮

步骤1：给ValueSelectionPageView添加跳转按钮 #

修改ValueSelectionPageView.axaml，添加绑定导航命令的按钮：

<UserControl xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
             mc:Ignorable="d" d:DesignWidth="800" d:DesignHeight="450"
             x:Class="AvaloniaApplication1.Views.ValueSelectionPageView"
             xmlns:vm="using:AvaloniaApplication1.ViewModels"
             x:DataType="vm:ValueSelectionPageViewModel"
             >
    <StackPanel HorizontalAlignment="Center" VerticalAlignment="Center">
        <Button Content="跳转到文本页面" 
                Command="{Binding NavigateToTextPageCommand}"
                Padding="10 5"/>
    </StackPanel>
</UserControl>

步骤2：给ValueSelectionPageViewModel添加导航命令 #

修改ValueSelectionPageViewModel.cs，添加RelayCommand处理跳转逻辑：

using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
using AvaloniaApplication1.Views;
using Avalonia.Controls.ApplicationLifetimes;

namespace AvaloniaApplication1.ViewModels;

public partial class ValueSelectionPageViewModel : ViewModelBase
{
    [RelayCommand]
    private void NavigateToTextPage()
    {
        // 获取主窗口并切换内容为TextPageView
        if (Application.Current.ApplicationLifetime is IClassicDesktopStyleApplicationLifetime desktopLifetime)
        {
            desktopLifetime.MainWindow.Content = new TextPageView
            {
                DataContext = new TextPageViewModel()
            };
        }
    }
}

步骤3：设置主窗口初始显示内容 #

如果主窗口还未初始化显示ValueSelectionPageView，修改MainWindow.xaml.cs的构造函数：

using Avalonia.Controls;
using AvaloniaApplication1.Views;

namespace AvaloniaApplication1;

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        // 初始加载ValueSelectionPageView
        Content = new ValueSelectionPageView
        {
            DataContext = new ValueSelectionPageViewModel()
        };
    }
}

补充说明 #

上述是最基础的视图切换方案，适合入门。如果后续需要路由管理、视图堆栈、参数传递等复杂导航场景，可以学习Avalonia官方的NavigationView组件或社区成熟的导航库。

内容的提问来源于stack exchange，提问作者someone