WPF数据模型绑定

winform控件属性，没特别的东西，调整属性看一下效果，就记住了，同css

基本属性还要记得住，直接写，比找属性栏快速

 

后台部分

传统模式按钮事件写逻辑

中间隔山打牛，业务逻辑通过数据建模控制界面

中间这座山怎么建？

1、文本框TextBoxModel.cs

    public class TextBoxModel
    {
        public string Text { get; set; } = "Zys";
    }

最基本的

string Text属性

这个模型需要和界面 有个关联，怎么关联？

传统this.tb这样写没什么意义，传统模式

通过对象最基础的，没有切割业务逻辑

 

2、按钮ButtonModel.cs

通过模型方式关联一下

    public class ButtonModel
    {
        public int Width { get; set; } = 200;
    }

 

3、窗口WindowModel.cs

两个对象模型呈现到窗口里面，窗口也是对象

里面有两个模型，嵌套关系

    public class WindowModel
    {
        public string Title { get; set; } = "Hello WPF";
        public TextBoxModel TBModel { get; set; } = new TextBoxModel();
        public ButtonModel BModel { get; set; } = new ButtonModel();
    }

完成了三个模型的创建，窗口，文本框，按钮

按钮点击之后，如何通过模型来操作？

WPF给我们提供了一个特有的机制

 

数据绑定

把数据模型绑定到界面

1、数据模型与界面的绑定关系

        public MainWindow()
        {
            InitializeComponent();
            //DataContext数据上下文的数据源=WindowModel都来源这个对象
            this.DataContext = new WindowModel();
        }

DataContext数据上下文的数据源=WindowModel都来源这个对象

包括控件窗口的所有属性

只是执行两个大框的关系

2、里面的控件以及属性部分还需要指定 

Text="{Binding TBModel.Text}"

Width="{Binding BModel.Width}"

 必须和数据模型中初始化的实例名和属性字段名保持一致

窗口标题也可以绑定

Title=“{Binding Title}”

<Window x:Class="WpfApp1.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:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfApp1"
        mc:Ignorable="d"
        Title="{Binding Title}" Height="450" Width="800">
    <Grid>
        <TextBlock Text="{Binding TBModel.Text}" Margin="10"  VerticalAlignment="Top" Background="Orange"/>
        <Button Width="{Binding BModel.Width}" HorizontalAlignment="Left" Margin="196,52,0,0" VerticalAlignment="Top" Click="Button_Click" RenderTransformOrigin="2.297,-1.674">
            <TextBlock>Hello</TextBlock>
        </Button>

    </Grid>
</Window>

后台数据模型绑定到前台显示

 ViewModel业务逻辑，只关心model里面有什么属性，不关心model最终会通知哪些view

通过绑定表达式，实现了View和ViewModel的解耦 

 

可以把之前的按钮事件移动到ViewModel中去  

按钮的点击去不了，但是不用传统的Button_Click了

而是用Command属性

 

创建一个类CommandBase.cs来专门处理事件，实现ICommand接口

ctor回车自动补全构造函数

    public class CommandBase : ICommand
    {
        public event EventHandler CanExecuteChanged;

        public bool CanExecute(object parameter)
        {
            return true;
        }

        public void Execute(object parameter)
        {
            DoExecute?.Invoke(parameter);
        }

        public Action<object> DoExecute { get; set; }

        public CommandBase(Action<object> doExecute)
        {
            DoExecute = doExecute;
        }
    }

WPF内部没有实现，我们需要自己实现接口

这个对象就是需要给到前台Command属性的一个实例，需要用CommandBase来创建

 

在WindowViewModel.里面定义绑定事件业务逻辑代码

        //业务逻辑
        //需要绑定给界面的命令属性
        public CommandBase ButtonCommand { get => new CommandBase(ButtonClick); }//匿名写法new CommandBase(obj => { });
        //该命令所执行的逻辑
        private void ButtonClick(object obj)
        {
            TBModel.Text = "Button Clicked";
        }

前端绑定

Command="{Binding ButtonCommand}" 

1、前端点击按钮会

2、绑定到命令属性ButtonCommand 
3、命令属性再调用到ButtonClick方法执行逻辑

 

只需要更新表达式就可以

所有能够显示和操作的数据源

来源于DataContext

界面上不区分数据还是命令，都是通过Binding命令

 

必须是属性

字段不行