[uwp]数据绑定再学习
在开始上代码前,先来假设这样一种情形:
出于某些原因,创建一个自定义控件(UserControl),然后为它定义一个依赖属性,这个属性有两个作用,一是调用控件方通过数据绑定技术为它赋值,二是控件内部的其他属性需要从这个自定义的属性获取数据。这个自定义的依赖属性充当的是一个中间件的作用。
用到的技术就是数据绑定和依赖属性。
针对这种情形,做一个例子如下:
这是充当中间件的Model,只有一个Name属性
public class Entity{
public string Name{get;set;}
}
自定义控件(这儿我给他起名为MyTextBox)的XAML代码如下:
<Grid>
<TextBox x:Name="textbox" Text="{Binding Data.Name,Mode=TwoWay}"></TextBox>
</Grid>
很简单,就一个TextBox,注意Text和Name绑定.
下面是MyTextBox对应的后台代码:
public sealed partial class MyTextBox : UserControl{
public MyTextBox(){
this.InitializeComponent();
this.textbox.DataContext = this;
}
public static readonly DependencyProperty DataProperty = DependencyProperty.Register("Data", typeof(Entity), typeof(MyTextBox), new PropertyMetadata(null));
public Entity Data
{
get { return (Entity)GetValue(DataProperty); }
set { SetValue(DataProperty, value); }
}
}
这儿就用到了自定义依赖属性的知识,其实就是一个固定套路,但一定注意,在Data属性的get和set访问器中,最好不要添加额外的代码,因为不一定会执行的。因为在内部可以直接调用GetValue和SetValue来访问依赖属性DataProperty。这点可以去MSDN上查阅。
至于这句
this.textbox.DataContext=this;
待会儿再说,应该是比较核心的一句代码,当然也有变通方式。
至此,自定义的一个MyTextBox就完成了。
接着就要使用我们这个自定义的MyTextBox了,怎么用呢?接着看
我准备在MainPage中直接使用这个控件,但在这之前,先为MainPage定义一个ViewModel,顺便玩玩MVVM。
ViewModel如下:
public class ViewModel : INotifyPropertyChanged
{
public event PropertyChangedEventHandler PropertyChanged; private Entity _info;
public Entity Info
{
get { return _info; }
set { _info= value; PropertyChanged?.Invoke(this, new PropertyChangedEventArgs("Info")); }
}
}
这个结构应该很简单了,为ViewModel实现INotifyPropertyChanged接口,然后定义一个Entity类型的属性Info,在属性的Set访问其中,调用事件的Invoke方法(现在编译器会自动优化,所以这儿不存在线程安全的问题。),Entity是之前定义的一个Model类。
接着是MainPage的XAML了,。。
<Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
<local:MyTextBox Data="{Binding Info,Mode=OneWay}" Height="50" VerticalAlignment="Stretch"></local:MyTextBox>
<Button Content="test" Click="Button_Click" HorizontalAlignment="Stretch" VerticalAlignment="Bottom"></Button>
</Grid>
这儿为自定义属性Data做了一个数据绑定,结合上面的ViewModel,很显然,是把Data和ViewModel中的Info绑定了。
至于下面那个Button,是为了通过调试来查看数据绑定的效果来设置的。
然后就是最后的MainPage.cs了
public sealed partial class MainPage : Page
{
ViewModel VM;
public MainPage()
{
this.InitializeComponent();
VM = new ViewModel();
this.DataContext = VM;
}
private void Button_Click(object sender, RoutedEventArgs e)
{
//VM.Info = new Entity() { Name = "我心爱的姑娘" };
//VM.Info.Name = "你好吗";
//VM.Info= null;
}
}
因为是一个简单的MVVM嘛,所以先定义一个字段VM,然后再构造函数里把Page的DataContext设置为VM;
工作差不多了,接下来就是通过F9,F10还有那个Button来调试了。
下面一一列举:
1.当Button_Click中代码为
VM.Info= new Entity() { Name = "我心爱的姑娘" };
这一句时,会看到MainPage中的文本框里出现了“我心爱的姑娘”字样。
基本满足要求,继续···
2.当Button_Click中代码为
VM.Info= new Entity() { Name = "我心爱的姑娘" };
VM.Info.Name = "你好吗";
这次是不是会出现“你好吗”?执行完成后,会发现字样没变,依然是“我心爱的姑娘”.
为什么会这样呢?通过调试发现,Name在内存中的确是“你好吗”,只是界面上没有显示出来。答案待会儿解释。
3.当Button_Click中代码为
VM.Info= new Entity() { Name = "我心爱的姑娘" };
VM.Info= null;
这次执行完后,结果显而易见,文本框会一片空白。
现在来分析:ViewModel实现了INotifyPropertyChanged接口,而Entity并没有实现该接口.
Info定义在ViewModel里,在属性值改编后会会调用事件的Invoke方法通知系统,实现界面的同步。
Name定义在Entity中,值改变与否,都不会通知系统。
所以,如果想要让Name的值也同步显示,只需要为Entity实现INotifyPropertyChanged该接口即可。
好,说了一大堆,启示和我写博客的初衷并不相同,我是来解释这一句的
this.textbox.DataContext=this;
为什么要这么做呢?
在XAML的控件树中,DataContext是可以继承的。因为之前设置了Page的DataContext为VM,如果不加这一句的话,会导致自定义控件的DataContext也是VM,显然在VM里是找不到Data.Name的。
VM中只有Info.Name,当然,吧Info和Data改一致后,比如说都改为Data,那么的确表面上数据得到了绑定,但是却会深度耦合。
当然还有其他办法。
欢迎交流。
demo下载点击这儿
[uwp]数据绑定再学习的更多相关文章
- js再学习笔记
#js再学习笔记 ##基本 1.js严格区分大小写 2.js末尾的分号可加,也可不加 3.六种数据类型(使用typeof来检验数据的类型) `typeof` - undefined: `var ...
- express再学习
对比spring,django,再学习express就有很多共通的地方啦... 看的书是一本小书,<express in action>,排版比较好. 昨天开始看,看了快四分之一啦... ...
- Android再学习-20141023-Intent-Thread
20141023-Android再学习 Intent对象的基本概念 Intent是Android应用程序组件之一 Intent对象在Android系统中表示一种意图 Intent当中最重要的内容是ac ...
- Android再学习-20141022-Activity的生命周期
20141022-Android再学习 如何在一个应用程序当中定义多个Activity 定义一个类,继承Activity 在该类当中,复写Activity当中的onCreate方法.onCreate( ...
- Android再学习-20141018-布局-进度条
20141018-Android再学习 对齐至控件的基准线 为了保证印刷字母的整齐而划定的线(四线三格的第三条线). android:layout_alignBaseline 与父控件的四个边缘对齐( ...
- 再学习sqlhelper
在机房收费重构系统的时候,第一次学习sqlhelper.当时感觉比较简单,没有写博客总结,现在又经过了图书馆的学习,感觉还是有必要写一写的. SqlHelper是一个基于.NETFramework的数 ...
- c/c++再学习:常用字符串转数字操作
c/c++再学习:常用字符串转数字操作 能实现字符串转数字有三种方法,atof函数,sscanf函数和stringstream类. 具体demo代码和运行结果 #include "stdio ...
- c/c++再学习:C与Python相互调用
c/c++再学习:Python调用C函数 Python 调用C函数比较简单 这里两个例子,一个是直接调用参数,另一个是调用结构体 C代码 typedef struct { int i1; int i2 ...
- MQTT再学习 -- MQTT 客户端源码分析
MQTT 源码分析,搜索了一下发现网络上讲的很少,多是逍遥子的那几篇. 参看:逍遥子_mosquitto源码分析系列 参看:MQTT libmosquitto源码分析 参看:Mosquitto学习笔记 ...
随机推荐
- 如何优化Java垃圾回收-zz
为什么需要优化GC 或者说的更确切一些,对于基于Java的服务,是否有必要优化GC?应该说,对于所有的基于Java的服务,并不总是需要进行GC优化,但前提是所运行的基于Java的系统,包含了如下参数或 ...
- libtrace 安装 使用 修改
下载 https://github.com/LibtraceTeam/libtrace/releases 解压 进入目录 依赖 sudo apt install libpcap0.8-dev -y a ...
- Node.js 项目打包
Node项目基于Electron打包 Electron打包打包后项目.exe程序包含在文件夹中,基于Electron打包的基础上直接打包成exe程序 参考一 参考二 需求的软件环境: NSIS 2.4 ...
- IE浏览器中不支持cookie问题
/** * Cookie plugin * * Copyright (c) 2006 Klaus Hartl (stilbuero.de) * Dual licensed under the MIT ...
- LevelDB 的缺憾
[LevelDB 的缺憾] 1.Snapshots 只能通过 DB::GetSnapshot() 创建,意即只能创建当下的 Snapshot. 2.
- 一些js知识点总结
1. 函数声明与函数表达式 解析器在像执行环境中加载数据时,会先读取函数声明,并使其在执行任何代码之前都可以访问,对于函数表达式,必须等到解析器执行到它所在的代码行,才会真正被执行. 例: alert ...
- CVE-2017-7494:Linux Samba named pipe漏洞
描述: 漏洞是由于代码中一个管道申请命令的判断导致的,可以通过构造特定请求执行上传的so文件. 漏洞影响了Samba 3.5.0 之后到4.6.4/4.5.10/4.4.14中间的所有版本. 测试: ...
- rsync同步常用命令[转载]
转载:http://blog.csdn.net/niushuai666/article/details/16880061 如果你是一位运维工程师,你很可能会面对几十台.几百台甚至上千台服务器,除了批量 ...
- HttpClient Timeout
1. Overview This tutorial will show how to configure a timeout with the Apache HttpClient 4. If you ...
- ZSTU4266 回文 2017-03-22 14:25 55人阅读 评论(0) 收藏
4266: 回文 Time Limit: 1 Sec Memory Limit: 128 MB Submit: 1636 Solved: 504 Description 小王想知道一个字符串是否为 ...