【Win10】UAP/UWP/通用 開發之 x:Bind

[Some information relates to pre-released product which may be substantially modified before it's commercially released. Microsoft makes no warranties, express or implied, with respect to the information provided here.]

[涉及某信息預發佈的版本可能在它的商業版本大幅修改。對於這裏提供的信息,微軟不作任何擔保。]

在MSDN中,Windows 10 SDK 的東東上,都會聲明這一句話,我也引過來吧啦,他不擔保,我也保不了。

 

正文

  在Win10 UWP開發中,新加入了一個關鍵字 x:Bind. 它好在哪?爲什麼要用他。

  build大會視頻資源:http://www.microsoftvirtualacademy.com/training-courses/a-developers-guide-to-windows-10-preview?prid=ch9courselink

一、x:Bind 好在哪?

從這兩張畫可以看出來,x:Bind的性能要優於Binding。爲什麼?

這個綁定被稱爲 "compiled data bindings", 從字面上看 編譯的數據綁定。

我們以前常用的Binding,是運行時(Run Time)的綁定,而這個 在編譯時(Build Time)就已經決定。

好處就是效率高,速度快,綁定的錯誤在編譯時就會提示出來,方便調試。

二、x:Bind

x:Bind 主要的幾點:

1. 強類型

2.上下文爲page 或 UserControl

3.綁定的默認Mode爲OneTime

我們用Binding的時候,有的時候可以不用去考慮類型,因爲有好多默認的轉換(如,TypeConverter),但是使用x:Bind時,如果類型不匹配編譯時,就會出錯。

例如:

<CheckBox IsChecked="{x:Bind}" />

我們把當前的上下文綁定到 IsChecked(bool?) 上

Invalid binding path '' : Cannot bind type 'BindDemo.MainPage' to 'System.Nullable(System.Boolean)' without a converter

結果就會這樣子。當然,如果你綁到String類型的屬性上是不會錯的,他會幫你ToString()地。

而綁定的上下文,現在看來就是當前的類的本身了,就是繼承自Page和UserControl的本身。

對於在初學的同學,再也不怕找不到對象了,也不用設置DataContext。

對於熟悉MVVM的同學,要用x:Bind 就要把ViewModel寫到CodeBehand中一個,真心怪怪的說,好多框架可能也得調整啦。

三、小試牛刀

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <TextBlock Text="{x:Bind}"
                   VerticalAlignment="Center"
                   HorizontalAlignment="Center" />
    </Grid>

CodeBehand不做任何代碼啦.

結果:

 

從這結果也可以看出來,他的上下文,是當前的這個頁。

咱們在CodeBehand里加一Title的屬性。

    public sealed partial class MainPage : Page
    {
        public string Title { get; set; } = "Bind Demo";

        public MainPage()
        {
            this.InitializeComponent();
        }
    }
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <TextBlock Text="{x:Bind Title}"
                   VerticalAlignment="Center"
                   HorizontalAlignment="Center" />
    </Grid>

這裏,熟悉MVVM的人就要想了,我們怎麼綁定ViewModel呢。其實就是把ViewModel的對象,寫在CodeBehand裏一個就好啦。

    public class MainViewModel
    {
        public string Name { get; set; } = "Bind";

        public string Content { get; set; } = "Demo";
    }
    public sealed partial class MainPage : Page
    {
        public string Title { get; set; } = "Bind Demo";

        public MainViewModel ViewModel { get; set; } = new MainViewModel();

        public MainPage()
        {
            this.InitializeComponent();
        }
    }
    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <StackPanel HorizontalAlignment="Center">
            <TextBlock Text="{x:Bind Title}" />
            <TextBlock Text="{x:Bind ViewModel.Name}" />
            <TextBlock Text="{x:Bind ViewModel.Content}" />
        </StackPanel>
    </Grid>

結果

四、數據模板中使用

因爲x:Bind 是強類型,所以你在使用DataTemplate的時候,要指定x:DataType,我們改寫一下上面的例子。

CodeBehand的代碼不用變,我們直接變Xaml中的。加一個Key爲TestDataTmpleate的數據模板,爲了區別,我們給一個背景色,把順序也換一下.

<Page x:Class="BindDemo.MainPage"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:local="using:BindDemo"
      xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
      xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
      mc:Ignorable="d">
    <Page.Resources>
        <DataTemplate x:Key="TestDataTemplate"
                      x:DataType="local:MainViewModel">
            <StackPanel Background="Orange">
                <TextBlock Text="{x:Bind Content}" />
                <TextBlock Text="{x:Bind Name}" />
            </StackPanel>
        </DataTemplate>
    </Page.Resources>

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}">
        <StackPanel HorizontalAlignment="Center">
            <TextBlock Text="{x:Bind Title}" />
            <ContentControl ContentTemplate="{StaticResource TestDataTemplate}"
                            Content="{x:Bind ViewModel}" />
        </StackPanel>
    </Grid>
</Page>

結果:

如果,我們不設置x:DataType呢。他就會告訴我們這個Error。

 

五、綁定事件到方法

x:Bind 是支持事件綁定到方法的,例如我給MainViewModel 加一個Test方法。然後在數據模板中加一個Button。

Click這個不用想都支持,我就隨便試了一個PointerEntered事件啦。

綁定的這個方法,可以不寫參數,也可以把事件的參數寫全。

        <DataTemplate x:Key="TestDataTemplate"
                      x:DataType="local:MainViewModel">
            <StackPanel Background="Orange">
                <TextBlock Text="{x:Bind Content}" />
                <TextBlock Text="{x:Bind Name}" />
                <Button  PointerEntered="{x:Bind Test}" />
            </StackPanel>
        </DataTemplate>

完美進入斷點。

六、總結

  現在Binding也是可以一同使用的,至少不帶表x:Bind可以全完替代Binding,至少在動態類型的綁定上,x:Bind是玩不轉的。而且使用x:Bind 多少打亂一些我們已習慣的MVVM的結構。

  但是x:Bind所帶來的性能的提升,真心讓人心動,可以的話,可以儘量的使用這個。

 

本文只是我的x:Bind的初步理解,也沒找到什麼文檔,如果有不對的地方,請大家指出來。謝謝。

本文地址:http://www.cnblogs.com/gaoshang212/p/4534138.html

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章