none
XAML开发入门之附加属性和绑定属性 RRS feed

  • 常规讨论

  • XAML开发入门之附加属性和绑定属性
    发布于:2008-06-05 16:08:45 作者:轩辕南宫 来源:天极开发 访问:16次 文字:
      有极少数的XAML元素存在下面所描述的情况,就是其自身的属性大多数情况下是在其它的元素中进行声明和使用的,该元素本身却很少使用这些属性。这些在其它元素中声明和使用的属性我们称为附加属性。一般来说,附加属性是用于在一个父元素定位其它元素布局的。就像Grid和DockPanel元素就包含附加属性。Grid使用附加属性来指定包含子元素的特定行和列,而DockPanel使用附加属性是来指定子元素应该停靠在面板中的何处位置。

      提示:我们可以在所有的由DependencyObject派生出的元素中设置附加属性。而DependencyObject又是由UIElement派生的,所以绝大多数的XAML元素都可以使用附加属性。

      我们说过附加属性是在另外一个元素中进行声明的,而其本身是属于所引用的元素。为此它在XAML中的声明语法为:属性提供元素名.属性名。例如,Grid有两个附加属性:Row和Column。如果我们要将某个元素包含在Grid的特定区域中,你可以在该元素中使用Grid.Row和Grid.Column两个属性附加属性指定确切的行和列。下面的代码描述了上述的实现:

    01 <Page xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    02 WindowTitle="GridSample">
    03 <Grid VerticalAlignment="Top" HorizontalAlignment="Left" ShowGridLines="True"
    04 Width="250" Height="100">
    05 <Grid.ColumnDefinitions>
    06 <ColumnDefinition />
    07 <ColumnDefinition />
    08 <ColumnDefinition />
    09 </Grid.ColumnDefinitions>
    10 <Grid.RowDefinitions>
    11 <RowDefinition />
    12 <RowDefinition />
    13 <RowDefinition />
    14 <RowDefinition />
    15 </Grid.RowDefinitions>
    16
    17 <TextBlock FontSize="20" FontWeight="Bold" Grid.ColumnSpan="3" Grid.Row="0">
    18 2005 Products Shipped
    19 </TextBlock>
    20 <TextBlock FontSize="12" FontWeight="Bold" Grid.Row="1" Grid.Column="0">
    21 Quarter 1
    22 </TextBlock>
    23 <TextBlock FontSize="12" FontWeight="Bold" Grid.Row="1" Grid.Column="1">
    24 Quarter 2
    25 </TextBlock>
    26 <TextBlock FontSize="12" FontWeight="Bold" Grid.Row="1" Grid.Column="2">
    27 Quarter 3
    28 </TextBlock>
    29 <TextBlock Grid.Row="2" Grid.Column="0">50000</TextBlock>
    30 <TextBlock Grid.Row="2" Grid.Column="1">100000</TextBlock>
    31 <TextBlock Grid.Row="2" Grid.Column="2">150000</TextBlock>
    32 <TextBlock FontSize="16" FontWeight="Bold" Grid.ColumnSpan="3" Grid.Row="3">
    33 Total Units: 300000
    34 </TextBlock>
    35 </Grid>
    36 </Page>

      最终的呈现效果如下:

    点击放大此图片


      绑定属性

      在ASP.NET中,我们通常使用<%# 数据表达式%>这样的语法创建服务器控件属性和数据源之间的绑定。那么要在WPF中创建一个XAML元素的属性和数据源之间的绑定应该怎么实现呢?为此我们引入了一种新的概念-绑定属性。我们可以在一个元素中使用绑定属性去引用原本属于其它元素的属性值,这个包含绑定属性的元素称为目标元素,而被引用的那个元素称为源元素。注意,绑定属性必须和目标元素的从属属性相关联。 我们在目标元素中使用绑定属性来绑定源元素的相应属性值,如果源元素中的相应属性值在程序运行时发生了变化,那么目标元素中的从属属性的属性值也将做出同样改变。也就说绑定属性会自动解析所绑定的属性值是否发生了变化,并将发生的改变马上反馈到从属属性中。在学习C#时,我们通常会使用如下的代码来说明赋值的意义:

    37 int a = 1;
    38 int b;
    39 b = a;

      其中变量a就相当于我们上述的源元素那样,其值为1,而变量b就相当于目标元素那样,通过语句"b=a"将值1"绑定"到b,使得变量b的值现在也为1。但是它和实际的WPF程序中的绑定语法不同的是,当a的值发生改变后,b的值是不会发生改变的,依然为1。

      而WPF中的绑定语法会根据源元素的属性值改变做出同样的响应,这种关联是一直持续的。在XAML中是使用Binding关键字来维续它们的一致性。

      Binding元素的语法如下:

    01 <Binding ElementName[元素名]=" …" Path[属性名]="…"/>

      我们用Binding关键字来表明这是一个绑定表达式语法,使用这种语法的实现都会在运行阶段进行实时的解析,以获得源元素的当前值。

      在前面我们曾经创建了一个实例,就是你点击了多少次按钮,就会在按钮上的文本进行呈现。现在我们来使用绑定属性来扩展这个示例。我们可以为该页面添加一个TextBox元素,使得文本框中文本和一个TextBlock元素上的文本一致,也就是说将TextBox元素的Text属性和TextBlock元素的Text属性进行绑定,当你点击按钮时,就使得上述的两个文本信息同时发生变化,并且文本信息会显示改变的次数。

    01 <Window
    02 xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    03 xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    04 x:Class="SDKSample.Window1"
    05 Width="460"
    06 Height="200"
    07 Title="BindDPtoDP">
    08
    09 <DockPanel Background="White">
    10
    11 <Button Click="btnChangeSource" Width="150" Height="30"
    12 DockPanel.Dock="Top">Change Source Property</Button>
    13
    14 <TextBlock Name="Text1" DockPanel.Dock="Top" FontSize="12"
    15 Height="30" Foreground="Green">
    16 <TextBlock.Text>
    17 Click the Button to Change this Initial Text Value in this Source Element
    18 </TextBlock.Text>
    19 </TextBlock>
    20
    21 <TextBox DockPanel.Dock="Top" Height="30" Foreground="Blue">
    22 <TextBox.Text>
    23 <Binding ElementName="Text1" Path="Text"/>
    24 </TextBox.Text>
    25 </TextBox>
    26
    27 </DockPanel>
    28
    29 </Window>

      在第23行代码处,可以看到我们在<TextBox.Text>从属属性中使用了绑定表达式语法来绑定TextBlock元素的Text属性.

      对应的代码后置文件

    01 using System;
    02 using System.ComponentModel;
    03 using System.Windows;
    04 using System.Windows.Controls;
    05 using System.Windows.Documents;
    06 using System.Windows.Data;
    07 using System.Windows.Media;
    08
    09 namespace SDKSample
    10 {
    11 /// <summary>
    12 /// Window1: This is the class that encapsulates the code
    13 /// "behind" the Window1.Xaml page.
    14 /// </summary>
    15 public partial class Window1 : Window
    16 {
    17 static int iCount = 0;
    18
    19 void btnChangeSource(object sender, RoutedEventArgs e)
    20 {
    21 iCount++;
    22 Text1.Text = string.Format("New Text. Count={0}", iCount);
    23 }
    24 }
    25 }

      效果下图所示,只要你点击按纽, TextBox元素的Text属性值和TextBlock元素的Text属性值都将发生变化.


    My blog: http://blog.csdn.net/dotfun http://dotfun.cnblogs.com

    My contact: QQ:372900288 E-mail:372900288@qq.com msn:sellnet007@hotmail.com

    2009年3月11日 7:28
    版主