c#_dotnet_wpf_mvvm设计模式

WPF MVVM（Model-View-ViewModel） 设计模式

在 WPF 应用程序中使用 MVVM（Model-View-ViewModel）设计模式的一部分，其中 ViewModel（TempModel）负责封装数据和业务逻辑，而 View（MainWindow.xaml）通过 DataBinding 与 ViewModel 进行交互。

Juster.Music\MainWindow.xaml

<Window
    x:Class="Juster.Music.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:local="clr-namespace:Juster.Music"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    Title="MainWindow"
    Width="800"
    Height="450"
    mc:Ignorable="d">
    <Grid>

        <Grid.RowDefinitions>
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
            <RowDefinition />
        </Grid.RowDefinitions>

        <StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
            <TextBlock
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Text="账号：" />
            <!-- - **数据绑定(Data Binding)**：TextBox控件的Text属性与ViewModel中的属性进行了双向数据绑定。
                    例如，`Text="{Binding Account,UpdateSourceTrigger=PropertyChanged}"`表示TextBox的文本内容会与ViewModel中的Account属性同步，
                    并且当Account属性发生变化时立即更新源。 -->
            <TextBox
                Name="TxtA"
                Width="300"
                Height="30"
                Text="{Binding Account,UpdateSourceTrigger=PropertyChanged}" />
        </StackPanel>

        <StackPanel
            Grid.Row="1"
            HorizontalAlignment="Center"
            Orientation="Horizontal">
            <TextBlock
                HorizontalAlignment="Center"
                VerticalAlignment="Center"
                Text="密码：" />
            <TextBox
                Name="TxtP"
                Width="300"
                Height="30"
                Text="{Binding PassWrold, Mode=TwoWay}" />
        </StackPanel>


        <!-- public List<string> LoginTypes -->
        <!-- - **ComboBox 绑定 ItemsSource**：ComboBox 的 ItemsSource 属性被绑定到 TempModel 类的 LoginTypes 属性，
            这样 ComboBox 的下拉列表项将由 LoginTypes 列表提供。 -->
        <ComboBox
            Grid.Row="2"
            Width="200"
            Height="25"
            ItemsSource="{Binding LoginTypes}" />

        <Button
            Name="BtnLogin"
            Grid.Row="3"
            Width="200"
            Height="30"
            Click="BtnLogin_Click"
            Content="Login" />
    </Grid>
</Window>

Juster.Music\MainWindow.xaml.cs

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;

namespace Juster.Music
{
    /// <summary>
    /// Interaction logic for MainWindow.xaml
    /// </summary>
    public partial class MainWindow : Window
    {
        public MainWindow()
        {
            InitializeComponent();
            // DataContext设置：在构造函数中设置了窗口的数据上下文 DataContext = new TempModel();
            // 这样就使得MainWindow.xaml中的数据绑定可以找到对应的TempModel类实例进行绑定。
            DataContext = new TempModel();
        }

        private void BtnLogin_Click(object sender, RoutedEventArgs e)
        {
            string a = TxtA.Text;
            string p = TxtP.Text;

            if (a == "root" && p == "123")
            {
                MessageBox.Show("登录成功！");
            }
            else
            {
                MessageBox.Show("登录失败！");
            }
        }
    }
}

Juster.Music\TempModel.cs

using Juster.Common;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;

namespace Juster.Music
{
    public class TempModel
    {
        //    - **自动属性和私有字段**：TempModel 类中定义了 Account、PassWrold 和 LoginTypes 三个属性，它们都有对应的私有字段，并提供了 get 和 set 访问器。这允许对这些属性进行读写操作以及数据绑定。
        private string _account;

        public string Account
        {
            get { return _account; }
            set
            {
                _account = value;
            }
        }

        private string _passwrold;

        public string PassWrold
        {
            get { return _passwrold; }
            set
            {
                _passwrold = value;
            }
        }

        private List<string> _loginTypes;

        public List<string> LoginTypes
        {
            get { return _loginTypes; }
            set { _loginTypes = value; }
        }



        //    - **构造函数**：TempModel 类的构造函数初始化了 Account 属性为"root"，并且初始化 LoginTypes 为一个包含三种登录类型字符串的 List。
        public TempModel()
        {
            Account = "root";
            LoginTypes = new List<string>();
            LoginTypes.Add("手机号登录");
            LoginTypes.Add("账号密码登录");
            LoginTypes.Add("二维码登录");
        }
    }
}