WindowPhone---數據綁定之DataContext

 

DataContext

Silverlight中提供了另外一種設置數據源的方式，及通過UI元素的數據上下文Data Context屬性來指定數據源。這是一種上下文有關的確定綁定源的方案。一旦為一個UI元素指定了DataContext屬性，則其所有子元素都將繼承該屬性，與其子元素關聯的所有數據綁定在沒有另行制定Souce 和DataContext的情況下，都將默認使用該屬性指定的對象作為綁定源。

　這樣，在進行數據綁定時，對於某UI元素指定DataContext后就可以在其所有下級UI元素中使用以該DataContext為綁定源的綁定。實際上在通常情況下的用法是，先用DataContext屬性指定高層UI元素的數據上下文，然后對於特殊的子元素再另行指定綁定源。

在最后的方法中，我們討論了數據綁定元素級別如何完成。讓我們來添加一些 CLR 對象並使用 DataContext 鏈接數據綁定元素和CLR 對象中的屬性

1 新建一個工程 Ch1_Recipe2.

在這里，讓我們創建一個簡單的應用程序，以配合與 CLR 對象數據元素。數據類只是創建兩個屬性，然后初始化為一些測試數據。然后，它被分配到數據上下文。

1. Right-click on Ch1_Recipe2 and Add | Class.

2．創建一個類DataClass然后添加Name和Notes兩個屬性。

namespace Recipe2

{

public class DataClass

{

public string Name { get; set; }

public string Notes { get; set; }

}

}

 

   3.打開Mainpage.xaml按照下面源碼的方法修改ApplicationTitle和PanelTitle

 <StackPanel x:Name="TitlePanel" Grid.Row="0" Grid.ColumnSpan ="2">>

<TextBlock x:Name="ApplicationTitle" Text="Phone7 Recipes" Style="{StaticResource PhoneTextNormalStyle}"/>

<TextBlock x:Name="PageTitle" Text="Object Bindings" Style="{StaticResource PhoneTextTitle1Style}"/>

</StackPanel>

 

 

4要顯示兩列和三行，我們應該改變Grid ColumnDefinition 和 RowDefinition，如下所示

XAML 代碼段：

<Grid x:Name="LayoutRoot" Background="Transparent">

<Grid.RowDefinitions>

<RowDefinition Height="Auto"/>

<RowDefinition Height="50"/>

<RowDefinition Height="*"/>

</Grid.RowDefinitions>

<Grid.ColumnDefinitions>

<ColumnDefinition Width="74*"></ColumnDefinition>

<ColumnDefinition Width="406*"></ColumnDefinition>

</Grid.ColumnDefinitions>

 

5 . 讓我們添加兩個 TextBlock 控件以顯示名稱和說明。這里名稱和注釋所指的對象的 DataClass 屬性。添加四個 TextBlock元素內的 ContentPanel 網格;在這里我們將添加到綁定信息顯示元素 tbNameContent 和 tbNoteContent。綁定對象領帶不知道它來自何處、，如下所示的控制對象的名稱

<Grid x:Name="ContentPanel" Grid.Row="1" Grid.RowSpan="2" Grid.ColumnSpan="2" Margin="0,0,0,-16">

<TextBlock x:Name ="tbName" Text ="Name:" Grid.Row="1" Grid.Column ="0"/>

<TextBlock x:Name ="tbNameContent" Text ="{Binding Name}" Margin="74,0,6,567" /> <TextBlock x:Name ="tbNotes" Text ="Notes:" Height="43" VerticalAlignment="Top" Margin="0,85,412,0" />

<TextBlock x:Name ="tbNotesContent" Text ="{Binding Notes}" Margin="74,85,0,16" />

</Grid>

7.打開 MainPage.xaml.cs 文件。第一，為 DataClass 創建私有變量之前的MainPage的構造函數。MainPage構造函數中初始化DataClass 對象使用的對象初始值設定項，如中所示的示例數據

下面的代碼片斷。最后，為 myData 對象分配給 DataContext，其中數據更新的文本塊。

public partial class MainPage : PhoneApplicationPage
    {
        // 構造函數
        private DataClass myData;
      
        public MainPage()
        {
            InitializeComponent();
            // 初始化dateClass
            myData = new DataClass()
            {
                Name = "Name 1",
                Notes = "Note 1"
            };
            // 將Dataclass綁定到Datacontext上
            LayoutRoot.DataContext = myData;
        }

    }