WPF使用MVVM模式开发

本文用到的有:

  • WPF(.net5)
  • Microsoft.Toolkit.Mvvm
  • 按钮不带参数/带参数点击事件绑定
  • 文本框Text绑定,点击事件绑定

步骤如下:

  1. 创建wpf项目:WpfMVVM

  2. 创建Views、ViewModels两个文件夹
    在这里插入图片描述

  3. nuget添加Microsoft.Toolkit.Mvvm
    在这里插入图片描述

  4. 在ViewModels文件夹添加类MainViewModel

using Microsoft.Toolkit.Mvvm.ComponentModel;
using Microsoft.Toolkit.Mvvm.Input;
using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;

namespace WpfMVVM.ViewModels
{
    public class MainViewModel:ObservableObject
    {
        public RelayCommand ButtonCommand { set; get; }
        public RelayCommand<Window> CloseCommand { set; get; }
        public RelayCommand<TextBox> TextBoxClickCommand { set; get; }

        private string _TextOfBox = "文本框点击命令";
        public string TextOfBox
        {
            set => SetProperty(ref _TextOfBox, value);
            get => _TextOfBox;
        }

        public MainViewModel()
        {
            ButtonCommand = new RelayCommand(OnButtonCommand);
            CloseCommand = new RelayCommand<Window>(OnCloseCommand);
            TextBoxClickCommand = new RelayCommand<TextBox>(OnTextBoxClickCommand);
        }

        private void OnTextBoxClickCommand(TextBox obj)
        {
            obj.Text = "点击了文本框";
        }

        private void OnCloseCommand(Window obj)
        {
            if(MessageBox.Show("要关闭吗?","提示",MessageBoxButton.YesNo)!= MessageBoxResult.Yes)
            {
                return;
            }
            obj.Close();
        }

        private void OnButtonCommand()
        {
            MessageBox.Show("您点击了按钮");
        }
    }
}

  1. 删除MainWindow,并在Views里面创建MainView页面,MainView页面添加两个按钮及一个文本框
    在这里插入图片描述
<Window x:Class="WpfMVVM.Views.MainView"
        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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfMVVM.Views" 
        xmlns:viewmodels="clr-namespace:WpfMVVM.ViewModels" d:DataContext="{d:DesignInstance Type=viewmodels:MainViewModel}"
        mc:Ignorable="d" WindowStartupLocation="CenterScreen"
        Title="MainView" Height="450" Width="800" x:Name="window_name">
    <Grid>
        <Button Content="按钮命令" Command="{Binding ButtonCommand}" HorizontalAlignment="Left" Margin="109,51,0,0" VerticalAlignment="Top" Width="86" Height="30"/>
        <Button Content="关闭命令" Command="{Binding CloseCommand}" CommandParameter="{Binding ElementName=window_name}" HorizontalAlignment="Left" Margin="251,51,0,0" VerticalAlignment="Top" Width="97" Height="30"/>
        <TextBox x:Name="textbox_name" HorizontalAlignment="Left" Margin="109,126,0,0" Text="{Binding TextOfBox}" TextWrapping="Wrap" VerticalAlignment="Top" Width="147" Height="25">
            <TextBox.InputBindings>
                <MouseBinding Command="{Binding TextBoxClickCommand}" CommandParameter="{Binding ElementName=textbox_name}" MouseAction="LeftClick"></MouseBinding>
            </TextBox.InputBindings>
        </TextBox>

    </Grid>
</Window>

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.Shapes;
using WpfMVVM.ViewModels;

namespace WpfMVVM.Views
{
    /// <summary>
    /// MainWindow.xaml 的交互逻辑
    /// </summary>
    public partial class MainView : Window
    {
        protected readonly MainViewModel _VM;
        public MainView()
        {
            InitializeComponent();

            DataContext = _VM = new MainViewModel();
        }
    }
}

  1. 代码地址
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

pluto li

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值