原文:快速构建Windows 8风格应用25-数据绑定

本篇博文主要介绍如何将UI元素与数据进行绑定、数据绑定的方向、数据更改通知、数据转换、数据绑定支持的绑定方案。

数据绑定是一种简单方式来显示数据,UI元素与数据对象之间的连接或绑定是允许数据在两者之间流动的。另外建立了绑定且数据发生变化时,相应的UI元素会自动显示变化。

 

如何将UI元素与数据进行绑定

 

从上面图可以知道,每个绑定必须指定一个源和一个目标。

其中源对象可以是任何CLR对象,包括目标元素自身和其他UI元素。目标可以是FrameworkElement的任何DependencyProperty(依赖属性)。

数据绑定引擎从Binding对象获取以下内容:

1)源对象和目标对象;

2)数据流的方向;

3)值转换器;

例如:使用C#代码和XAML将TextBox的Foreground属性进行绑定。

XAML代码:

<TextBox x:Name="MyTextBox" Text="Text" Foreground="{Binding Brush1, Mode=OneWay}"/>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

C#代码:

MyColors textcolor = new MyColors();
textcolor.Brush1 = new SolidColorBrush(Colors.Red);
MyTextBox.DataContext = textcolor;

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

绑定是使用{Binding…}语法在XAML中创建的。源是通过设置TextBox的DataContent属性在代码中设置的。

另外数据是会被继承的。若我们在某个父元素上设置数据上下文,那么其子元素将使用同一数据。我们可以通过设置Binding.Path属性绑定到源对象的某个属性。

 

数据绑定的方向

每一个绑定都包含一个Mode属性,用于确定数据流动的方式和时间。

三种类型的绑定:

1)OneTime:绑定会在创建时使用源数据更新目标。

2)OneWay:绑定会在创建时以及数据发生更改时使用源数据更新目标(默认模式)。

3)TwoWay:绑定会在目标和源中的任一个发生更改时同时更新目标和源。

 

数据更改通知

当源数据对象进行了更改,如何将新的源数据对象传递给目标对象呢?解决办法是源数据对象继承INotifyPropertyChanged 接口。因为INotifyPropertyChanged 接口提供了PropertyChanged 事件,该事件会告诉数据绑定引擎,源对象已经改变,方便更改目标值。

例如:

// Create a class that implements INotifyPropertyChanged.
public class MyColors : INotifyPropertyChanged
{
    private SolidColorBrush _Brush1;
 
    // Declare the PropertyChanged event.
    public event PropertyChangedEventHandler PropertyChanged;
 
    // Create the property that will be the source of the binding.
    public SolidColorBrush Brush1
    {
        get { return _Brush1; }
        set
        {
            _Brush1 = value;
            // Call NotifyPropertyChanged when the source property 
            // is updated.
            NotifyPropertyChanged("Brush1");
        }
    }
 
    // NotifyPropertyChanged will raise the PropertyChanged event, 
    // passing the source property that is being updated.
    public void NotifyPropertyChanged(string propertyName)
    {
        if (PropertyChanged != null)
        {
            PropertyChanged(this, 
                new PropertyChangedEventArgs(propertyName));
        }
    }
}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

示例代码中MyColors类继承了INotifyPropertyChanged 接口,当Brush1属性更改时将触发PropertyChanged事件通知目标对象以及更改。

 

数据转换

当我们存储的数据在UI界面显示的时候,对用户来讲不友好时,可以将数据进行相应的转换进行显示。这时我们就需要一个数据的转换器了。

我们可以在任意的绑定上设置转换器,并且自定义转换器类必须继承实现IValueConverter 接口。

例如:

// Custom class implements the IValueConverter interface.
public class DateToStringConverter : IValueConverter
{
 
    #region IValueConverter Members
 
    // Define the Convert method to change a DateTime object to 
    // a month string.
    public object Convert(object value, Type targetType, 
        object parameter, string language)
    {
        // value is the data from the source object.
        DateTime thisdate = (DateTime)value;
        int monthnum = thisdate.Month;
        string month;
        switch (monthnum)
        {
            case 1:
                month = "January";
                break;
            case 2:
                month = "February";
                break;
            default:
                month = "Month not found";
                break;
        }
        // Return the value to pass to the target.
        return month;
 
    }
 
    // ConvertBack is not implemented for a OneWay binding.
    public object ConvertBack(object value, Type targetType, 
        object parameter, string language)
    {
        throw new NotImplementedException();
    }
 
    #endregion
}

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

当从源对象传递数据时,绑定引擎会调用Convert 并将返回的数据传递回目标。

当从目标传递数据时,绑定引擎会调用ConvertBack 并将返回的数据传递回源。

XAML代码中设置Converter:

<UserControl.Resources>
  <local:DateToStringConverter x:Key="Converter1"/>
</UserControl.Resources>
 
...
 
<TextBlock Grid.Column="0" 
  Text="{Binding Month, Converter={StaticResource Converter1}}"/>

.csharpcode, .csharpcode pre
{
font-size: small;
color: black;
font-family: consolas, "Courier New", courier, monospace;
background-color: #ffffff;
/*white-space: pre;*/
}
.csharpcode pre { margin: 0em; }
.csharpcode .rem { color: #008000; }
.csharpcode .kwrd { color: #0000ff; }
.csharpcode .str { color: #006080; }
.csharpcode .op { color: #0000c0; }
.csharpcode .preproc { color: #cc6633; }
.csharpcode .asp { background-color: #ffff00; }
.csharpcode .html { color: #800000; }
.csharpcode .attr { color: #ff0000; }
.csharpcode .alt
{
background-color: #f4f4f4;
width: 100%;
margin: 0em;
}
.csharpcode .lnum { color: #606060; }

转换器中还有两个可选参数:ConverterLanguage(该参数允许指定在转换中使用的语言)和 ConverterParameter(该参数允许为转换逻辑传递一个参数)。

注意:若在数据转换中存在错误,最好不要抛出异常,而是返回DependencyProperty.UnsetValue,它将停止数据传输。

 

支持的绑定方案

方案 C#
绑定到对象 可以为任何对象
从绑定对象中获取属性更改更新 数据对象必须实现INotifyPropertyChanged接口
绑定到集合 使用List(Of T)
从绑定集合中获取集合更改更新 使用ObservableCollection(Of T)
实现支持绑定的集合 扩展 List(Of T) 或实现 IListIList(属于 Object)、IEnumerableIEnumerable(属于 Object)。绑定到通用 IList(Of T)IEnumerable(Of T) 的操作不受支持
实现支持集合更改更新的集合 扩展ObservableCollection(Of T) 或实现(非通用)IListINotifyCollectionChanged
实现支持增量加载的集合 扩展 ObservableCollection(Of T) 或实现(非通用)IListINotifyCollectionChanged。此外,还实现ISupportIncrementalLoading

注:该表格根据MSDN提供的文档进行相应的整理。

更多关于数据绑定的文章可参考:

1.数据绑定概述

2.快速入门:到控件的数据绑定;

3.如何绑定到分层数据并创建主视图/详细信息视图;

快速构建Windows 8风格应用25-数据绑定的更多相关文章

  1. 快速构建Windows 8风格应用4-FlipView数据控件

    原文:快速构建Windows 8风格应用4-FlipView数据控件 本篇博文主要介绍为什么使用FlipView控件.什么是FlipView控件.如何使用FlipView控件和FlipView控件最佳 ...

  2. 快速构建Windows 8风格应用5-ListView数据控件

    原文:快速构建Windows 8风格应用5-ListView数据控件 本篇博文主要介绍什么是ListView数据控件.如何构建ListView数据控件. 什么是ListView数据控件? 1)  Li ...

  3. 快速构建Windows 8风格应用6-GridView数据控件

    原文:快速构建Windows 8风格应用6-GridView数据控件 本篇博文主要介绍什么是GridView数据控件.如何构建常用的GridView数据呈现样式. 什么是GridView数据控件? G ...

  4. 快速构建Windows 8风格应用32-构建辅助磁贴

    原文:快速构建Windows 8风格应用32-构建辅助磁贴 引言 Windows Phone中,我们开发者可能会开发的一个功能点是将数据列表中某一项"Pin To Start(固定到开始屏幕 ...

  5. 快速构建Windows 8风格应用17-布局控件

    原文:快速构建Windows 8风格应用17-布局控件 本篇博文主要介绍三种常用的布局控件:Canvas.Grid.StackPanel. Panel类是开发Windows 8 Store应用中一个重 ...

  6. 快速构建Windows 8风格应用15-ShareContract构建

    原文:快速构建Windows 8风格应用15-ShareContract构建 本篇博文主要介绍共享数据包.如何构建共享源.如何构建共享目标.DataTransferManager类. 共享数据包 Da ...

  7. 快速构建Windows 8风格应用14-ShareContract概述及原理

    原文:快速构建Windows 8风格应用14-ShareContract概述及原理 本篇博文主要介绍Share Contract概述.Share Contract实现原理.实现Share Contra ...

  8. 快速构建Windows 8风格应用13-SearchContract构建

    原文:快速构建Windows 8风格应用13-SearchContract构建 本篇博文主要介绍如何在应用中构建SearchContract,相应的原理已经在博文<快速构建Windows 8风格 ...

  9. 快速构建Windows 8风格应用9-竖直视图

    原文:快速构建Windows 8风格应用9-竖直视图 本篇博文主要介绍竖直视图概览.关于竖直视图设计.如何构建竖直视图 竖直视图概览 Windows 8为了支持旋转的设备提供了竖屏视图,我们开发的应用 ...

随机推荐

  1. IE不能上网、有道云笔记不能联网、各种软件主页不能联网解决办法一

    其他的办法我几乎都试过了,读者可以无搜一下,我的问题是,我用Lantern.exe,所以只要打开这个就可以了! 我一直不知道是这个问题,困扰了好久QAQ

  2. Unity3D合并着色器

    unity 3d倒每次模型更多的是一种着色器.我可以拥有这些车型共享的地图想分享一个着色器.所以每次删除,然后附加,很麻烦.如何才能合并这些着色器? 采纳TexturePacking对 1.遍历gam ...

  3. gradle--java入门(转)

    7.3.3 项目之间的依赖性 您可以添加项目之间的依赖性在相同的构建,所以,例如,这个一个项目的JAR文件是用来编译另一个项目,在api构建文件我们将添加一个依赖JAR产生的共享项目.由于这种依赖性, ...

  4. ssis package 在调试状态中设置断点,程序 不进入断点 的解决方案

    原文:ssis package 在调试状态中设置断点,程序 不进入断点 的解决方案 针对 SSIS intergation 项目 > 属性 > Debug >Run64bITRunt ...

  5. .NET单元测试艺术(3) - 使用桩对象接触依赖

    List 3.1 抽取一个设计文件系统的类,并调用它 [Test] public bool IsValidLogFileName(string fileName) { FileExtensionMan ...

  6. harris 算法python实现

    harris 最常用作特征检测算法. 第一个文件harris.py <pre name="code" class="python">from sci ...

  7. android(9)_数据存储和访问3_scard基本介绍

    使用Activity的openFileOutput()保存文件的方法,文件存储在手机空间,通常情况下,手机的存储空间不是很大,存储小文件确定.假设你要存储大文件,如视频,是不可行. 对于这样大的文件, ...

  8. 他的第一个NDK的Demo

    DEMO下载链接: http://download.csdn.net/detail/logicsboy/7535409 首先给你们恶补下啥是NDK:(我从百度Copy的) NDK全称:Native D ...

  9. cocos2d-x 3.0游戏实例学习笔记《卡牌塔防》第六步---炮台&amp;点击炮台加入英雄&amp;英雄升级

    /* 说明: **1.本次游戏实例是<cocos2d-x游戏开发之旅>上的最后一个游戏,这里用3.0重写并做下笔记 **2.我也问过木头本人啦,他说:随便写,第一别全然照搬代码:第二能够说 ...

  10. In Oracle 11g, how to change the order of the results of a sql without “order by”?(转)

    oracle 11g 当sql语句中不加order by的时候,好像是按rowid的顺序返回结果的.我也看过一些相关的文档,oracle的官方意思就是不加order by,就不保证输出的顺序. 那么, ...