WPF 雜談——Binding表達式

不管是定義控件還是用戶控件都會用到一個功能——綁定(Binding)。書面的叫法：元素綁定。意思就是讓綁定的元素實現數據同步。在筆者看來WPF引入這一個功能實在是太完美了。編程更加的具體化。特別是跟MVVM模式的配合，那叫完美。筆者不是學術派的。全面性的講述的話那是不現實。就從筆者的使用經驗來談Binding吧。

最普通的使用方式，他的目標元素是控件上的DataContext對象。如下：

 <TextBlock Grid.Column="0" Text="{Binding DishName}" Style="{StaticResource TakingDishDishNameTextStyle}" />

DataContext這個屬性是在FrameworkElement類上面的。也就是說大部分的控件上都會有自己的DataContext的。那么我們一般只有在最外層設置DataContext屬性。為了更加清楚的了解DataContext綁定。筆者做了一個簡單的例子。筆者給最外面的Window設置了DataContext值。同時也給他的內部的Grid也設置了DataContext值。但是他們倆個不是同一個對象類型只是屬性相同而以。如下

<Window x:Class="Wpf.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:aomi="http://aomiwpf.com/ModernUI"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local ="clr-namespace:Wpf"
        Title="MainWindow" Height="350" Width="525">

    <Window.DataContext>
        <local:WindDataContext />
    </Window.DataContext>
    <Grid>
        <Grid.DataContext>
            <local:GridDataContext />
        </Grid.DataContext>
        <TextBlock Text="{Binding  TestName}"></TextBlock>
    </Grid>
</Window>

執行結果：

實驗可以證明標准的綁定方式的目標元素是DataContext。他會去找當前綁定元素最接近的DataContext。我們在來一個假設——如果GridDataContext類里面屬性TestName換成TestName1的話，又是什么樣子呢？如下

public class GridDataContext : NotifyPropertyChanged
    {
        private string _testName1 ="GridDataContext";

        public string TestName1
        {
            set
            {

                if (this._testName1 != value)
                {
                    this._testName1 = value;
                    OnPropertyChanged("TestName1");
                }
            }
            get { return this._testName1; }
        }
    }

執行結果：

不好意思！筆者以為他會去找Window的DataContext的屬性TestName。顯然他不會。又說明了一點，他只會去接近的DataContext里面找。不會一個直一個的往上面去找。

值得注意的是如果上面只是寫{Binding}的話，那就是把當前的DataContext綁定過來。而不是他的屬性。

在開發過程中，我們往往希望某個元素能跟另一個元素上面的屬性進行綁定。只要另一個元素屬性改變就會通知某個元素一起改變。這個時候就是不得不用下面的方式來了。

{Binding ElementName=SomeThingName, Path=Text} 

ElementName：表示元素的名稱。

Path：表示元素對象的屬性。

事實上我們可以想到一個問題。綁定是不是只能一方影響一方呢。這就是綁定的里面要用到的模式。如下

{Binding ElementName=SomeThindName, Path=Text,Mode=TwoWay}

TwoWay：導致對源屬性或目標屬性的更改可自動更新對方。

OneWay： 當綁定源（源）更改時，更新綁定目標（目標）屬性。

OneTime：當應用程序啟動或數據上下文更改時，更新綁定目標。

OneWayToSource：當目標屬性更改時更新源屬性。

以上的用法算是比較常用的。也是比較簡單的。不如讓我們看一下開源項目里面的一個綁定表達式吧。如下

<Button Command="{Binding Source={x:Static SystemCommands.MinimizeWindowCommand}}" ToolTip="{x:Static modernui:Resources.Minimize}" Style="{StaticResource SystemButton}">
   <Button.Content>
      <Grid Width="13" Height="12" RenderTransform="1,0,0,1,0,1">
         <Path Data="M0,6 L8,6 Z" Width="8" Height="7" VerticalAlignment="Center" HorizontalAlignment="Center"
                  Stroke="{Binding Foreground, RelativeSource={RelativeSource Mode=FindAncestor, AncestorType=Button}}" StrokeThickness="2"  />
      </Grid>
  </Button.Content>
</Button>

不知道大家看得明不明白。上面的意思是從父節點Button的Foreground和當前Path的Stroke綁定在一起。主要的關鍵在AncestorType。用於指定父親的類型。Mode是一個RelativeSourceMode類型。他有四個值。如下。

PreviousData: 用於數據列表，意指以前的數據項。即是數據集合上面的顯示。不包括控件。

TemplatedParent:用於模板上的綁定。

Self:元素自己本身上的屬性相綁定。

FindAncestor:用於查找父級元素。

只要這樣子一講解就可以理解RelativeSource用於指定相對的源元素。即是目標元素。

事實上，上面的表達式還有一種可能用到的寫法。即是多出了一個用於限制父級的深度(AncestorLevel)。如下

{Binding RelativeSource={RelativeSource FindAncestor, AncestorType={x:Type ItemsControl}, AncestorLevel=2}, Path=Name}

注意：如果想對綁定的值進行修改的話，要用轉化器。如下

{Binding ElementName=SomeThindName, Path=Text,Mode=TwoWay,Converter=XXXConverter}

在開發自定義控件的時候，我們會經常用到一個表達式。如下

  Width="{TemplateBinding Width}"

上面的寫法只是一種縮寫。完整的如下

 Width="{Binding RelativeSource={RelativeSource TemplatedParent}, Path=Width}"

可以說上面的內容是筆者最常用到的。接下來讓我們在去看一些綁定其他的內容點。即是那些不常見的內容。

1.StringFormat的功能。相當於string.format功能一樣子。舉個列子。如果我們要在金額的前加上“￥”的時候，可以用一下。如下 

 <TextBlock Text="{Binding MoneyText, StringFormat=￥{0}}" />

如果不是這樣子做的話，你就不得不給“￥”一個TextBlock來顯示，或是MoneyText變成string類型，然后設置值里面加上￥。但是筆者這里卻是double類型的。所以用StringFormat的功能有就可以完美的決解了顯示“￥”的問題。

執行結果：

2.TargetNullValue的功能，用於綁定目標是一個null值的時候，要顯示的內容。如下筆者給NullName賦null。

 <TextBlock Text="{Binding NullName, TargetNullValue=aomi}" />

執行結果：

3.FallbackValue的功能，用於綁定目標是發生錯誤的時候，要顯示的內容。如下

<TextBlock Text="{Binding NullName, FallbackValue=aomi}" />

執行結果筆者就不貼了。

文章最后。在來說明一個不常用的功能——PriorityBinding。這個功能筆者不好說。只能讓讀者們自行體會吧。他主要用於在加載時間比較多的時候，要顯示的信息。比如顯示“正在加載中...”。筆者做了例子吧。

Xaml:

<Window x:Class="Wpf.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:aomi="http://aomiwpf.com/ModernUI"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:local ="clr-namespace:Wpf"
        Title="MainWindow" Height="350" Width="525">

    <Window.DataContext>
        <local:MainViewModel />
    </Window.DataContext>
    <Grid>
        <TextBlock>
            <TextBlock.Text>
                <PriorityBinding>
                    <Binding Path="UserName" IsAsync="True"></Binding>
                    <Binding Path="LoadingName"></Binding>
                </PriorityBinding>
            </TextBlock.Text>
        </TextBlock>
    </Grid>
</Window>

ViewModel:

 public class MainViewModel : NotifyPropertyChanged
    {
        private string _userName ="Haya";
        private string _loadingName = "正在加載中...";
        public string UserName
        {
            set
            {

                if (this._userName != value)
                {
                    this._userName = value;
                    OnPropertyChanged("UserName");
                }
            }
            get {
                Thread.Sleep(7000);
                return this._userName;
            }
        }

        public string LoadingName
        {
            set
            {

                if (this._loadingName != value)
                {
                    this._loadingName = value;
                    OnPropertyChanged("LoadingName");
                }
            }
            get { return this._loadingName; }
        }
    }

執行結果：

七秒后：

本章的內容比較簡單。筆者只是講述了常用的一些知識點。但是必不是說就這些了。例如Binding還關系到Xml的綁定和集合的綁定功能。讀者們可以自行去找一下資料。