(04).NET MAUI实战 MVVM

1.概要

本章将讲解如何在MAUI中使用简单的MVVM模式开发“ListView”内容的增删功能,MVVM在MAUI中也同样适用。.

(04).NET MAUI实战 MVVM

Microsoft.Toolkit.Mvvm

在学习之前我们先了解一个nuget包,它可以帮助我们省去一些代码的开发时间。包Microsoft.Toolkit.Mvvm (aka MVVM Toolkit) 是一个现代、快速、模块化的 MVVM 库。此包面向 .NET Standard,以便在任何应用平台上使用它:UWP、WinForms、WPF、Xamarin、Uno 等;在任何运行时:.NET Native、.NET Core、.NET Framework或 Mono。它在所有上运行。在所有情况下,API 图面都是相同的,因此非常适合生成共享库。在解决方案资源管理器中,右键单击项目,然后选择“管理NuGet包”。搜索 Microsoft.Toolkit。Mvvm 并安装它。

(04).NET MAUI实战 MVVM

2.详细内容

Project

(04).NET MAUI实战 MVVM

View

<Grid RowDefinitions="500,50">
  <ListView ItemsSource="{Binding Temps}"/>
    <StackLayout Grid.Row="1">
       <Button WidthRequest="100" HeightRequest="25" Text="add" Command="{Binding AddCommand}"/>
       <Button WidthRequest="100" HeightRequest="25" Text="add" Command="{Binding DeleteCommand}"/>
    </StackLayout>
</Grid>

ViewModel

  //ViewModel需继承
  public class MainViewModel : ObservableObject
  {
       private string _test;
       private ObservableCollection<MainModel> _temps;
       private ICommand addCommand;
       private ICommand deleteCommand;
       //数据通知集合
       public ObservableCollection<MainModel> Temps { get => _temps; set => _temps = value; }
       //命令
       public ICommand AddCommand { get => addCommand ?? (addCommand = new RelayCommand(AddCallback));}
       public ICommand DeleteCommand { get => deleteCommand ?? (deleteCommand = new RelayCommand(DeleteCallback)); }
       //数据通知字段
       public string Test { get => _test; set => SetProperty(ref _test , value); }
       public MainViewModel()
      {
           //初始化
           Temps = new ObservableCollection<MainModel>();
           Temps.Add(new MainModel { Name = "zhangsan" });
           Temps.Add(new MainModel { Name = "zhangsan" });
      }
      //命令执行内容
      private void AddCallback()
      {
           Temps.Add(new MainModel { Name = DateTime.Now.ToString() });
      }
      private void DeleteCallback()
      {
           Temps.RemoveAt(0);
      }
  }

Model

public class MainModel
{
   public string Name { get; set; }
   public override string ToString()
  {
       return Name;
  }
}

Run

(04).NET MAUI实战 MVVM