Silverlight2 边学边练 之八 数据绑定

junwong 发布于 2012/03/09 12:41
阅读 58
收藏 0

本篇介绍SL2的数据绑定功能,在Silverlight2中数据绑定有3中模式: 
  * 单向模式(OneWay):源数据更新时目标数据也随之更新。 
  * 双向模式(TwoWay):源数据或目标数据更新时,彼此相互更新。 
  * 一次模式(OneTime):只将源数据显示到目标,不用于更新。
单向模式为SL2默认的绑定模式,首先演示一个简单的OneTime模式:

XAML Code:

< UserControl  x:Class ="DataBinding.Page"
    xmlns
="http://schemas.microsoft.com/winfx/2006/xaml/sentation"  
    xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml"
    Width
="300"  Height ="150"  Loaded ="Page_Loaded" >
    
< Grid  x:Name ="gridUser"  Background ="White" >
        
< Grid.RowDefinitions >
            
< RowDefinition  Height ="40" ></ RowDefinition >
            
< RowDefinition  Height ="40" ></ RowDefinition >
            
< RowDefinition  Height ="40" ></ RowDefinition >
        
</ Grid.RowDefinitions >
        
< Grid.ColumnDefinitions >
            
< ColumnDefinition  Width ="80" ></ ColumnDefinition >
            
< ColumnDefinition  Width ="*" ></ ColumnDefinition >
        
</ Grid.ColumnDefinitions >
        
< TextBlock  Grid.Row ="0"  Grid.Column ="0"  Text ="Name"  
                   FontSize
="20"  Margin ="5,5,5,5" ></ TextBlock >
        
<!-- 绑定姓名数据 -->
        
< TextBox  Margin ="5,5,5,5"  BorderBrush ="Orange"
                 Grid.Row
="0"  Grid.Column ="1"  FontSize ="20"
                 Text
=" {Binding Name} " ></ TextBox >

        
< TextBlock  Grid.Row ="1"  Grid.Column ="0"  Text ="Age"  
                   FontSize
="20"  Margin ="5,5,5,5" ></ TextBlock >
        
<!-- 绑定年龄数据 -->
        
< TextBox  Margin ="5,5,5,5"  BorderBrush ="Orange"
                 Grid.Row
="1"  Grid.Column ="1"  FontSize ="20"
                 Text
=" {Binding Age} " ></ TextBox >
        
</ Grid >
</ UserControl >


创建User Class:

using  System;
using  System.Windows;
using  System.Windows.Controls;
using  System.ComponentModel;

namespace  DataBinding
{
    
public   class  User
    {
        
private   string  name;
        
public   string  Name
        {
            
get  {  return  name; }
            
set  { name  =  value; }
        }

        
private   string  age;
        
public   string  Age
        {
            
get  {  return  age; }
            
set  { age  =  value; }
        }
    }
}

主程序:
using  System;
using  System.Collections.Generic;
using  System.Windows;
using  System.Windows.Controls;
using  System.Windows.Documents;

namespace  DataBinding

    
public   partial   class  Page : UserControl
    {
        
public  Page()
        {
            InitializeComponent();
        }

        
private   void  Page_Loaded( object  sender, RoutedEventArgs e)
        {
            User user 
=   new  User();
            user.Name 
=   " Petter " ;
            user.Age 
=   " 20 " ;

            gridUser.DataContext 
=  user;
        }
    }
}


运行效果:

2009-8-5-16.44.13

下面上一个OneWay模式(也适用于TwoWay),XAML Code:

< UserControl  x:Class ="DataBinding.Page"
    xmlns
="http://schemas.microsoft.com/winfx/2006/xaml/sentation"  
    xmlns:x
="http://schemas.microsoft.com/winfx/2006/xaml"
    Width
="400"  Height ="300"  Loaded ="Page_Loaded" >
    
< Grid  x:Name ="gridUser"  Background ="White" >
        
< Grid.RowDefinitions >
            
< RowDefinition  Height ="40" ></ RowDefinition >
            
< RowDefinition  Height ="40" ></ RowDefinition >
            
< RowDefinition  Height ="40" ></ RowDefinition >
        
</ Grid.RowDefinitions >
        
< Grid.ColumnDefinitions >
            
< ColumnDefinition  Width ="80" ></ ColumnDefinition >
            
< ColumnDefinition  Width ="*" ></ ColumnDefinition >
        
</ Grid.ColumnDefinitions >
        
< TextBlock  Grid.Row ="0"  Grid.Column ="0"  Text ="Name"  
                   FontSize
="20"  Margin ="5,5,5,5" ></ TextBlock >
        
<!-- 绑定姓名数据 -->
        
< TextBox  Margin ="5,5,5,5"  BorderBrush ="Orange"
                 Grid.Row
="0"  Grid.Column ="1"  FontSize ="20"
                 Text
=" {Binding Name, Mode=OneWay} " ></ TextBox >
        
        
< TextBlock  Grid.Row ="1"  Grid.Column ="0"  Text ="Age"  
                   FontSize
="20"  Margin ="5,5,5,5" ></ TextBlock >
        
<!-- 绑定年龄数据 -->
        
< TextBox  Margin ="5,5,5,5"  BorderBrush ="Orange"
                 Grid.Row
="1"  Grid.Column ="1"  FontSize ="20"
                 Text
=" {Binding Age, Mode=OneWay} " ></ TextBox >
        
<!-- 点击更新数据 -->
        
< Button  Grid.Row ="2"  Grid.Column ="1"  Width ="100"  Height ="30"
                Content
="Update Data"  Click ="Button_Click" ></ Button >
    
</ Grid >
</ UserControl >


User Class 也需要更新,这里要用到接口:INotifyPropertyChanged

using  System;
using  System.Windows;
using  System.Windows.Controls;
using  System.ComponentModel;

namespace  DataBinding
{
    
public   class  User : INotifyPropertyChanged
    {
        
public   event  PropertyChangedEventHandler PropertyChanged;
        
public   void  OnPropertyChanged(PropertyChangedEventArgs e)
        {
            
if  (PropertyChanged  !=   null )
                PropertyChanged(
this , e);
        }

        
private   string  name;
        
public   string  Name
        {
            
get  {  return  name; }
            
set
            {
                name 
=  value;
                OnPropertyChanged(
new  PropertyChangedEventArgs( " Name " ));
            }
        }

        
private   string  age;
        
public   string  Age
        {
            
get  {  return  age; }
            
set
            {
                age 
=  value;
                OnPropertyChanged(
new  PropertyChangedEventArgs( " Age " ));
            }
        }
    }
}


主程序:

using  System;
using  System.Collections.Generic;
using  System.Windows;
using  System.Windows.Controls;
using  System.Windows.Documents;

namespace  DataBinding

    
public   partial   class  Page : UserControl
    {
        
public  Page()
        {
            InitializeComponent();
        }

        
private   void  Page_Loaded( object  sender, RoutedEventArgs e)
        {
            User user 
=   new  User();
            user.Name 
=   " Petter " ;
            user.Age 
=   " 20 " ;

            gridUser.DataContext 
=  user;
        }

        
private   void  Button_Click( object  sender, RoutedEventArgs e)
        {
            User user 
=  (User)gridUser.DataContext;
            user.Name 
=   " Jone " ;
            user.Age 
=   " 28 " ;
        }
    }
}


Demo展示:

本例参考自《Pro Silverlight 2 in C# 2008》CHAPTER 14  DATA BINDING

::源代码下载::


原文链接:http://www.cnblogs.com/gnielee/archive/2009/08/05/silverlight2-learning-data-binding.html
加载中
返回顶部
顶部