WPF属性绑定实现双向变化
wpf依赖项属性可以实现属性的绑定,成功绑定之后只要修改后台绑定的属性,即可ui同步自动更新绑定的值,无需手动刷新界面;同样,前台的值变化后,通过获取绑定的属性值也可获取ui变化后的值,实现双向变化的效果。属性绑定使得ui更新非常的方便,下面分享一个小栗子说明使用的方式。
1、先做了一个有一个textblock和一个button的ui,想要实现点击后textblock发生变化。
<window x:class="wpfdemo.window1" 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:wpfdemo" mc:ignorable="d" title="window1" height="300" width="300"> <grid> <button name="button_ok" maxwidth="50" maxheight="20" click="button_ok_click">ok</button> <textblock maxwidth="50" maxheight="20" verticalalignment="top" horizontalalignment="left" text="{binding text}"></textblock> </grid> </window>
2、创建ui更新类(现在是测试,所以属性比较少,正常开发建议一个ui创建一个ui更新类专门用于ui更新),如下为完整代码
public class propertytoui : inotifypropertychanged { #region 私有变量 /// <summary> /// 状态栏显示文本 /// </summary> private string text = ""; #endregion #region 属性 /// <summary> /// 属性-显示文本 /// </summary> public string text { get { return text; } set { text = value; onpropertychanged("text"); } } #endregion #region 属性变化通知事件 /// <summary> /// 属性变化通知事件 /// </summary> public event propertychangedeventhandler propertychanged; /// <summary> /// 属性变化通知 /// </summary> /// <param name="e"></param> public void onpropertychanged(propertychangedeventargs e) { if (propertychanged != null) { propertychanged(this, e); } } /// <summary> /// 属性变化通知事件 /// </summary> /// <param name="propertyname"></param> public void onpropertychanged(string propertyname) { propertychangedeventargs e = new propertychangedeventargs(propertyname); if (propertychanged != null) { propertychanged(this, e); } } #endregion }
这个部分有如下几个关键点:
(1)、需要实现inotifypropertychanged接口,这是一个属性更新接口,可以看一下它的实现,有一个属性更新事件,所以要说声明该事件。
namespace system.componentmodel { // // 摘要: // notifies clients that a property value has changed. public interface inotifypropertychanged { // // 摘要: // occurs when a property value changes. event propertychangedeventhandler propertychanged; } }
(2)、创建属性更新函数
/// <summary> /// 属性变化通知 /// </summary> /// <param name="e"></param> public void onpropertychanged(propertychangedeventargs e) { if (propertychanged != null) { propertychanged(this, e); } }
参数为某个属性的更新事件,而后触发propertychanged(this, e)通知ui更新指定属性
(3)、包装属性
public string text
{ get { return text; } set { text = value; onpropertychanged("text"); } }
在设置器中调用属性更新事件,即当后台设置值时(想要更新ui值),就会触发属性更新事件,通知前台绑定的依赖项属性进行更新(事件中带有属性的身份标识和值进行传递)。
3、前台依赖项属性对属性更新类中的属性进行绑定(binding语法)
<textblock maxwidth="50" maxheight="20" verticalalignment="top" horizontalalignment="left" text="{binding text}"></textblock>
属性名绑定即可
4、绑定数据源的说明(这是比较容易忘记的地方)
propertytoui ui = new propertytoui(); this.datacontext = ui; //事件绑定数据源
以上就是属性绑定的必要步骤了,如果没什么问题基本就成功了,没成功的再好好检查一下。
如下为完整的后台代码:
/// <summary> /// window1.xaml 的交互逻辑 /// </summary> public partial class window1 : window { /// <summary> /// ui更新类对象 /// </summary> propertytoui ui = new propertytoui(); /// <summary> /// 构造函数 /// </summary> public window1() { initializecomponent(); this.datacontext = ui; //事件绑定数据源 ui.text = "程序开启"; } /// <summary> /// ok按键点击事件 /// </summary> /// <param name="sender"></param> /// <param name="e"></param> private void button_ok_click(object sender, routedeventargs e) { ui.text = "我更新了"; messagebox.show(ui.text); } }
运行效果如下:
点击ok按键后:
上一篇: 鹿肉多少钱一斤,有什么功效作用,不了解这些你将错过一种人间美味!
下一篇: Java泛型理解