Xamarin.Forms Data Binding介绍

以下主要内容转自：http://www.jianshu.com/p/6cb786ce5b61

很多时候我们需要将某个View1 值的改变显示在另外一个View2 上，对View1的对应事件编码可实现我们想要的效果，如果只是想处理值的改变，可以通过连接两个View的对应属性即可，称为Data Binding。Data Binding在Model-View-ViewModel (MVVM)设计模式中起着重要作用。

Data Binding中设计两个概念Source 和 Target。当Source的值发生改变时Data Binding会自动将这个新的值更新到Target。对Target和Source有特殊要求，Target必须继承BindableProperty类（VisualElement通过继承Element继承了BindableObject，所以Xamarin.Forms中视图的大部分属性都是BindableProperty类型），Source必须实现INotifyPropertyChanged接口提供一种通知机制监听Source值的改变(BindableObject实现了INotifyPropertyChanged接口)。

简单的Data Binding使用

本示例以Slider的Value属性作Source，Label的Opacity属性作Target，实现拖动滑块影响Label透明度的效果。

代码方式设置Data Binding:

App类中代码如下：

        public App()
        {
            // The root page of your application
            MainPage = new NavigationPage(new OpacityBindingCodePage());

        }

新建OpacityBindingCodePage的XAML Page类代码如下:

    public partial class OpacityBindingCodePage : ContentPage
    {
        public OpacityBindingCodePage()
        {
            InitializeComponent();
            Label label = new Label
            {
                Text = "Opacity Binding Demo",
                FontSize = Device.GetNamedSize(NamedSize.Large, typeof(Label)),
                VerticalOptions = LayoutOptions.CenterAndExpand,
                HorizontalOptions = LayoutOptions.Center
            };
            Slider slider = new Slider
            {
                VerticalOptions = LayoutOptions.CenterAndExpand
            };
            // Set the binding context: target is Label; source is Slider.
            label.BindingContext = slider;
            // Bind the properties: target is Opacity; source is Value.
            label.SetBinding(Label.OpacityProperty, "Value");
            // Construct the page.
            Padding = new Thickness(10, 0);
            Content = new StackLayout
            {
                Children = { label, slider }
            };

        }

BindingContext 设置为要绑定到的对象

SetBinding 方法采用两个参数。 第一个参数指定绑定类型的信息。 第二个参数提供绑定内容或绑定方式的信息。

XAML方式设置Data Binding：

  <StackLayout>
       <Label Text="Opacity Binding Demo"
              FontSize="Large"
              VerticalOptions="CenterAndExpand"
              HorizontalOptions="Center"
              BindingContext="{x:Reference Name=slider}"
              Opacity="{Binding Path=Value}" />
       <Slider x:Name="slider" VerticalOptions="CenterAndExpand" />

  </StackLayout>

查看Label定义，BindingContext属性通过x:Reference指定，Opacity为目标属性通过Binding扩展标记的Path设置。Path不仅可以是Property也可以是SubProperty或 Indexer.如Content.Children[4].Value.