少有人走的路

MVVM演示

TodoItem.cs

namespace _07_MVVM.Models;

public class TodoItem
{
    public required string Title { get; set; }
    public bool IsCompleted { get; set; }
    public string Priority { get; set; } = "Normal";
}

MainWindowViewModel.cs

using _07_MVVM.Models;
using CommunityToolkit.Mvvm.ComponentModel;
using CommunityToolkit.Mvvm.Input;
using System.Collections.ObjectModel;
using System.Linq;

namespace _07_MVVM.ViewModels;

public partial class MainWindowViewModel : ObservableObject
{
    [ObservableProperty]
    private string _newTodoTitle = "";

    [ObservableProperty]
    private string _selectedPriority = "Normal";

    [ObservableProperty]
    private string _statusMessage = "待办事项：0 项";

    public string[] Priorities { get; } = { "Low", "Normal", "High", "Urgent" };
    public ObservableCollection<TodoItem> TodoItems { get; } = new();

    public MainWindowViewModel()
    {
        TodoItems.Add(new TodoItem { Title = "学习 Avalonia", Priority = "High" });
        TodoItems.Add(new TodoItem { Title = "完成 MVVM 项目", Priority = "Normal" });
        UpdateStatus();
    }

    partial void OnNewTodoTitleChanged(string value)
    {
        StatusMessage = string.IsNullOrEmpty(value)
            ? $"待办：{TodoItems.Count} 项"
            : $"输入中：{value}";
    }

    [RelayCommand]
    void AddTodo()
    {
        if (string.IsNullOrWhiteSpace(NewTodoTitle)) return;

        TodoItems.Add(new TodoItem
        {
            Title = NewTodoTitle,
            Priority = SelectedPriority
        });
        NewTodoTitle = "";
        UpdateStatus();
    }

    [RelayCommand]
    void RemoveTodo(TodoItem? item)
    {
        if (item != null)
        {
            TodoItems.Remove(item);
            UpdateStatus();
        }
    }

    [RelayCommand]
    void ToggleCompleted(TodoItem? item)
    {
        if (item != null) item.IsCompleted = !item.IsCompleted;
    }

    void UpdateStatus()
    {
        int total = TodoItems.Count;
        int done = TodoItems.Count(x => x.IsCompleted);
        StatusMessage = $"总计：{total} 项 | 已完成：{done} 项";
    }
}

App.axaml

<Application xmlns="https://github.com/avaloniaui"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             x:Class="_07_MVVM.App">

    <!-- 应用主题样式 -->
    <Application.Styles>
        <FluentTheme  /> <!-- Light=浅色 / Dark=深色 -->
    </Application.Styles>

</Application>

MainWindow.axaml

<Window xmlns="https://github.com/avaloniaui"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      
        xmlns:vm="using:_07_MVVM.ViewModels"
        xmlns:m="using:_07_MVVM.Models"
        x:Class="_07_MVVM.MainWindow"
        
        x:DataType="vm:MainWindowViewModel"
        Title="MVVM Pattern - 待办事项示例"
        Width="500"
        Height="500">

  <Window.DataContext>
    <vm:MainWindowViewModel/>
  </Window.DataContext>

  <DockPanel Margin="20">
    <StackPanel DockPanel.Dock="Top" Spacing="10" Margin="0,0,0,20">
      <TextBlock Text="待办事项管理" FontSize="20" FontWeight="Bold"/>

      <StackPanel Orientation="Horizontal" Spacing="10">
        <TextBox Text="{Binding NewTodoTitle}"
                 Watermark="输入新待办..."
                 Width="250"/>
        <ComboBox ItemsSource="{Binding Priorities}"
                  SelectedItem="{Binding SelectedPriority}"
                  Width="100"/>
        <Button Content="添加"
                Command="{Binding AddTodoCommand}"
                Padding="15,5"/>
      </StackPanel>
    </StackPanel>

    <Border DockPanel.Dock="Bottom"
            Background="#F5F5F5"
            Padding="10"
            CornerRadius="5"
            Margin="0,10,0,0">
      <TextBlock Text="{Binding StatusMessage}"
                 HorizontalAlignment="Center"/>
    </Border>

    <ListBox ItemsSource="{Binding TodoItems}">
      <ListBox.ItemTemplate>
        <!-- ✅ 数据模板显式声明 DataType，绑定 TodoItem 模型 -->
        <DataTemplate x:DataType="m:TodoItem">
          <DockPanel>
            <Button DockPanel.Dock="Right"
                    Content="删除"
                  
                    Command="{Binding $parent[ListBox].DataContext.RemoveTodoCommand}"
                    CommandParameter="{Binding}"
                    Padding="10,2"
                    Classes="Light"/>

            <CheckBox IsChecked="{Binding IsCompleted}"
                      VerticalAlignment="Center">
              <StackPanel Orientation="Horizontal" Spacing="10">
                <TextBlock Text="{Binding Title}"
                           FontSize="14">
                  <TextBlock.TextDecorations>
                   
                  </TextBlock.TextDecorations>
                </TextBlock>
                <TextBlock Text="{Binding Priority, StringFormat='[{0}]'}"
                           Foreground="Gray"
                           FontSize="12"/>
              </StackPanel>
            </CheckBox>
          </DockPanel>
        </DataTemplate>
      </ListBox.ItemTemplate>
    </ListBox>
  </DockPanel>
</Window>

效果：