XAML的数据绑定,知乎上看到说MVVM的最大优点为交互设计和业务设计是分离开的。
所以我就在考虑关于这个具体的分离要做到哪一步比较科学。
实际动手才能说明问题。
这里拿TextBox举例,我们通常TextBox用于放内容,单向或者双向的交互。
而MVVM的哲学是设计和业务逻辑分离,那么对于UI设计来说,可能需要的方式为你
"我从你那里拿数据就好,具体怎么布局和展示由我负责,数据的来和去由你负责。"
没错,那就是绑定了...
根据XAML的树形继承结构,如果在其父级别定义一个类,用于托管整个相关的数据,
整个UI的设计与业务逻辑的融合就可以实现就可以比较简单。
具体在语法上
<Grid x:Name="GridSerialOut" HorizontalAlignment="Stretch" VerticalAlignment="Stretch" Margin="0,0,0,0" Grid.Row="1" > <TextBox Text="{Binding SerialOutBaudRate}" HorizontalAlignment="Left" Height="23" Margin="83,39,0,0" TextWrapping="Wrap" VerticalAlignment="Top" Width="120"/> <Button Click="ButtonSerialOut_Click" Content="Button" HorizontalAlignment="Right" Height="44" VerticalAlignment="Bottom" Width="44" Margin="10,10,10,10" /> </Grid>
在具体的实现上,我目前正在计划学习期拿来练手的项目为,自用小工具,串口转发
需要定义一个Grid容器,用来展示所有跟选用的串口相关的信息(双向)。在上述描述中可以看到TextBox的属性Text已经绑定了描述
Text="{Binding SerialOutBaudRate}"
同时其归属
<Grid x:Name="GridSerialOut"
所以我们在init的时候添加代码,将GridSerialOut的DataContext变量到指定的托管类。就可以实现数据绑定。
public partial class MainWindow : Window { private Data_view_module _module; public MainWindow() { InitializeComponent(); _module = new Data_view_module { SerialOutBaudRate = "921600", }; this.LayoutRoot.DataContext = _module; } }
其中用到了一个C#的类,需要自行定义,我这里做一个简易的示例:
class Data_view_module : INotifyPropertyChanged { private string _SerialOutBaudRateText; public event PropertyChangedEventHandler PropertyChanged; public string SerialOutBaudRate { get { return _SerialOutBaudRateText; } set { if(value != _SerialOutBaudRateText){ _SerialOutBaudRateText = value; NotifyPropertyChanged("SerialOutBaudRate"); } } } private void NotifyPropertyChanged(String info) { if (PropertyChanged != null) { PropertyChanged(this, new PropertyChangedEventArgs(info)); } } }
最终就可以实现将_module 类绑定到GridSerialOut下,而其对应的
public string SerialOutBaudRate
自然就对应绑定到了XAML描述下的TextBox.Text了