Silverlight強大的DataGrid組件

1、.Silverlight強大的DataGrid組件1說明：DataGrid組件是Silverlight數(shù)據(jù)組件中最為常用并且是功能最為強大的數(shù)據(jù)組件。因此，對開發(fā)者而言，深入了解其特性是十分有必要的。本文先介紹該組件的基本特性，接著通過幾個簡單實例來說明該組件的基本數(shù)據(jù)操作過程。組件所在命名空間：System.Windows.Controls組件常用方法：BeginEdit：使DataGrid進入編輯狀態(tài)。CancelEdit：取消DataGrid的編輯狀態(tài)。CollapseRowGroup：閉合DataGrid的行分組。CommitEdit：確認DataGrid的編輯完成。ExpandRow

2、Group：展開DataGrid的行分組。GetGroupFromItem：從具體Item中得到分組。ScrollIntoView：滾動DataGrid視圖。組件常用屬性：AlternatingRowBackground：獲取或設(shè)置一個筆刷用來描繪DataGrid奇數(shù)行的背景。AreRowDetailsFrozen：獲取或設(shè)置一個值用來判斷是否凍結(jié)每行內(nèi)容的詳細信息。AreRowGroupHeadersFrozen：獲取或設(shè)置一個值用來判斷是否凍結(jié)分組行的頭部。AutoGenerateColumns：獲取或設(shè)置一個值用來判斷是否允許自動生成表列。CanUserReorderColumns：獲取

3、或設(shè)置一個值用來判斷是否允許用戶重新排列表列的位置。CanUserSortColumns：獲取或設(shè)置一個值用來判斷是否允許用戶按列對表中內(nèi)容進行排序。CellStyle：獲取或設(shè)置單元格的樣式。ColumnHeaderHeight：獲取或設(shè)置列頭的高度。ColumnHeaderStyle：獲取或設(shè)置列頭的樣式。Columns：獲取組件中包含所有列的集合。ColumnWidth：獲取或設(shè)置列寬。CurrentColumn：獲取或設(shè)置包含當(dāng)前單元格的列。CurrentItem：獲取包含當(dāng)前單元格且與行綁定的數(shù)據(jù)項。DragIndicatorStyle：獲取或設(shè)置當(dāng)拖曳列頭時的樣式。DropLoca

4、tionIndicatorStyle：獲取或設(shè)置呈現(xiàn)列頭時的樣式。FrozenColumnCount：獲取或設(shè)置凍結(jié)列的個數(shù)。GridLinesVisibility：獲取或設(shè)置網(wǎng)格線的顯示形式。HeadersVisibility：獲取或設(shè)置行頭及列頭的顯示形式。HorizontalGridLinesBrush：獲取或設(shè)置水平網(wǎng)格線的筆刷。HorizontalScrollBarVisibility：獲取或設(shè)置水平滾動條的顯示樣式。IsReadOnly：獲取或設(shè)置DataGrid是否為只讀。MaxColumnWidth：獲取或設(shè)置DataGrid的最大列寬。MinColumnWidth：獲取或設(shè)置

5、DataGrid的最小列寬。RowBackground：獲取或設(shè)置用于填充行背景的筆刷。RowDetailsTemplate：獲取或設(shè)置被用于顯示行詳細部分的內(nèi)容的模板。RowDetailsVisibilityMode：獲取或設(shè)置一個值用以判定行詳細部分是否顯示。RowGroupHeaderStyles：獲取呈現(xiàn)行分組頭部的樣式。RowHeaderStyle：獲取或設(shè)置呈現(xiàn)行頭的樣式。RowHeaderWidth：獲取或設(shè)置行頭的寬度。RowHeight：獲取或設(shè)置每行的高度。RowStyle：獲取或設(shè)置呈現(xiàn)行時的樣式。SelectedIndex：獲取或設(shè)置當(dāng)前選中部分的索引值。Selecte

6、dItem：獲取或設(shè)置與當(dāng)前被選中行綁定的數(shù)據(jù)項。SelectedItems：獲取與當(dāng)前被選中的各行綁定的數(shù)據(jù)項們的列表（List）。SelectionMode：獲取或設(shè)置DataGrid的選取模式。VerticalGridLinesBrush：獲取或設(shè)置垂直網(wǎng)格線的筆刷。VerticalScrollBarVisibility：獲取或設(shè)置垂直滾動條的顯示樣式。組件常用事件：BeginningEdit：發(fā)生于一個單元格或行進入編輯模式之前。CellEditEnded：發(fā)生于一個單元格編輯已被確認或取消。CellEditEnding：發(fā)生于一個單元格正在結(jié)束編輯時。CurrentCellChang

7、ed：發(fā)生于一個單元格成為當(dāng)前單元格時。PreparingCellForEdit：發(fā)生于在DataGridTemplateColumn下的單元格進入編輯模式時。SelectionChanged：發(fā)生于當(dāng)SelectedItem或SelectedItems屬性值改變時。實例：為DataGrid提供數(shù)據(jù)源的常用類型主要有兩類：List和ObservableCollection。前者一般用于普通數(shù)據(jù)綁定，而后者則常用于進行數(shù)據(jù)的雙向綁定來保證數(shù)據(jù)的同步性。下面就分別給出這兩種DataProvider的例子：List1）最簡單的綁定效果圖：MainPage.xaml文件代碼：<UserContr

8、ol     xmlns="     xmlns:x="     xmlns:d=" xmlns:mc="/markup-compatibility/2006"     mc:Ignorable="d" xmlns:data="clr-namespace:System.Windows.Contr

9、ols;assembly=System.Windows.Controls.Data" x:Class="SilverlightClient.MainPage"     Width="640" Height="480">     <Grid x:Name="LayoutRoot" Background="White" Width="640" Height="480&q

10、uot;>         <data:DataGrid x:Name="dgEmployee" Height="188" HorizontalAlignment="Left" Margin="18,19,0,0" VerticalAlignment="Top" Width="302"/>     </Grid> </Us

11、erControl>MainPage.xaml.cs文件代碼using .System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Windows; using System.Windows.Controls; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Animation; us

12、ing System.Windows.Shapes;   namespace SilverlightClient .     public partial class MainPage : UserControl     .         public MainPage()         .    

13、60;        InitializeComponent();             this.Loaded += new RoutedEventHandler(MainPage_Loaded);                  &

14、#160; void MainPage_Loaded(object sender, RoutedEventArgs e)         .             string dataSource = "H e l l o !"            &#

15、160;string sp = . " " ;             dgEmployee.ItemsSource = dataSource.Split(sp, StringSplitOptions.None).ToList();               2）使用業(yè)務(wù)對象效果圖：MainPage.xaml文件代碼：<UserC

16、ontrol     xmlns="     xmlns:x="     xmlns:d=" xmlns:mc="/markup-compatibility/2006"     mc:Ignorable="d" xmlns:data="clr-namespace:System.Windows.C

17、ontrols;assembly=System.Windows.Controls.Data" x:Class="SilverlightClient.MainPage"     Width="640" Height="480">     <Grid x:Name="LayoutRoot" Background="White" Width="640" Height="4

18、80">         <data:DataGrid x:Name="dgEmployee" Height="188" HorizontalAlignment="Left" Margin="18,19,0,0" VerticalAlignment="Top" Width="302"/>     </Grid> <

19、;/UserControl>MainPage.xaml.cs文件代碼：using .System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Windows; using System.Windows.Controls; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Animatio

20、n; using System.Windows.Shapes;   namespace SilverlightClient .     /定義數(shù)據(jù)類     public class Employees     .         public int EmployeeID . get; set;       

21、0; public string EmployeeName . get; set;         public int EmployeeAge . get; set;           public Employees()         .        

22、;   public Employees(int employeeid, string employeename, int employeeage)         .             EmployeeID = employeeid;           

23、60; EmployeeName = employeename;             EmployeeAge = employeeage;                     public partial class MainPage : UserControl  

24、60;  .         List em = new List();                 public MainPage()         .         &

25、#160;   InitializeComponent();             this.Loaded += new RoutedEventHandler(MainPage_Loaded);                    void MainPage_Loa

26、ded(object sender, RoutedEventArgs e)         .             em.Clear();             em.Add(new Employees(1, "張三", 23);   

27、;          em.Add(new Employees(2, "李四", 24);             em.Add(new Employees(3, "王五", 25);              

28、; dgEmployee.ItemsSource = em;               ObservableCollection注：要實現(xiàn)數(shù)據(jù)同步的雙向綁定，則業(yè)務(wù)對象一定要實現(xiàn)INotifyPropertyChanged接口。效果圖： MainPage.xaml文件代碼：<UserControl     xmlns="     xmlns:x="

29、    xmlns:d=" xmlns:mc="/markup-compatibility/2006"     mc:Ignorable="d" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data" x:Class="SilverlightClient

30、.MainPage"     Width="640" Height="480">     <Grid x:Name="LayoutRoot" Background="White" Width="640" Height="480">         <data:DataGrid x:Na

31、me="dgEmployee" Height="188" HorizontalAlignment="Left" Margin="18,19,0,0" VerticalAlignment="Top" Width="302"/>          <ListBox x:Name="lbSynchronization" HorizontalAlignment="

32、Left" Margin="18,231,0,71" Width="302"/>     </Grid> </UserControl>MainPage.xaml.cs文件代碼：using .System; using System.Collections.Generic; using System.Collections.ObjectModel; using System.Linq; using System.Net; using System.Windows; using

33、System.Windows.Controls; using System.Windows.Documents; using System.Windows.Input; using System.Windows.Media; using System.Windows.Media.Animation; using System.Windows.Shapes; using System.ComponentModel;   namespace SilverlightClient .     public class Employees :

34、INotifyPropertyChanged     .         private string name;         public string  EmployeeName         .        

35、0;  get  . return name;           set            .             if( value != name)     

36、0;       .               name  = value;               onPropertyChanged(this, "EmployeeName");  

37、0;                                       public event PropertyChangedEventHandler PropertyChanged;    

38、60;      private void onPropertyChanged(object sender, string propertyName).           if(this.PropertyChanged != null)         .         &#

39、160;  PropertyChanged(sender,new PropertyChangedEventArgs(propertyName) ;                         public Employees()         .    

40、       public Employees(string employeename)         .             EmployeeName = employeename;             &#

41、160;       public partial class MainPage : UserControl     .         ObservableCollection getEmployeesCollection()         .        

42、60;    ObservableCollection rVal = new ObservableCollection();               rVal.Add(new Employees . EmployeeName = "Tim" );             rV

43、al.Add(new Employees . EmployeeName = "Mary" );             rVal.Add(new Employees . EmployeeName = "John" );                   &#

44、160;     return rVal;                    public ObservableCollection em;           public MainPage()      

45、0;  .             InitializeComponent();             this.Loaded += new RoutedEventHandler(MainPage_Loaded);            

46、        void MainPage_Loaded(object sender, RoutedEventArgs e)         .             em = getEmployeesCollection();        &#

47、160;    dgEmployee.ItemsSource = em;             lbSynchronization.ItemsSource = em;             lbSynchronization.DisplayMemberPath = "EmployeeName"

48、              在上一篇中，我們討論了DataGrid的基礎(chǔ)數(shù)據(jù)綁定的有關(guān)知識。在今天的教程中，我將為大家介紹怎樣使用ADO.NET Entity Framework來與數(shù)據(jù)庫進行基本的交互。概覽為了能夠使事情變得簡單易做，這里我先為大家講解怎樣從數(shù)據(jù)庫檢索數(shù)據(jù)并返回至DataGrid。這個例子將為我們展示如下的功能：1）點擊Get Data按鈕向后臺發(fā)送獲取數(shù)據(jù)消息2）后臺數(shù)據(jù)庫將得到的相關(guān)數(shù)據(jù)傳回至DataGrid。這里，如果用的測試數(shù)據(jù)的量較大的話可以觀測到

49、明顯的延時現(xiàn)象（這就是異步操作帶來的效果）。簡單的準(zhǔn)備工作為了能使ADO.NET Entity Framework正常工作，請為你的VS2008打上SP1服務(wù)包。附SP1下載地址：中文版：英文版：創(chuàng)建項目點擊菜單File->New->Project.,打開New Project對話框。在Project types中選擇Web，在右側(cè)的Templates中選擇ASP.NET Web Application，輸入項目名為testDataGrid，點擊OK按鈕，完成創(chuàng)建。（見圖1）  圖1：創(chuàng)建ASP.NET Web Application接著，右擊Solution

50、Explorer中Solution 'testDataGrid'根文件夾，依次點擊菜單選項Add->New Project.。在Project types中選擇Silverlight，在右側(cè)的Templates中選擇Silverlight Application，輸入項目名為SilverlightClient，點擊OK按鈕，完成創(chuàng)建。（見圖2和圖3）圖2：新建Silverlight項目圖3：添加新項目在彈出的對話框中，按下圖進行設(shè)置，然后點擊OK按鈕。圖4：新建Silverlight應(yīng)用程序創(chuàng)建數(shù)據(jù)庫為了加快實驗速度，我們使用SQL Server Express 2008

51、作為后臺數(shù)據(jù)庫。按如下步驟建立數(shù)據(jù)庫及數(shù)據(jù)表：1）右擊testDataGrid文件夾下的App_Data文件夾，依次點擊菜單選項Add->New Item.。在彈出的對話框中，輸入數(shù)據(jù)庫名為Employees.mdf，點擊Add按鈕。圖5：創(chuàng)建數(shù)據(jù)庫Employees雙擊Employees.mdf，打開Server Explorer窗口。按下兩圖所示添加新數(shù)據(jù)表，將該表命名為Employee。圖6：添加新數(shù)據(jù)表圖7：Employee表設(shè)置輸入一些測試數(shù)據(jù)。圖8：輸入一些測試數(shù)據(jù)創(chuàng)建ADO.NET Entity數(shù)據(jù)庫實體模型右擊testDataGrid文件夾，點擊菜單選項Add->N

52、ew Item.。按下圖進行操作，將數(shù)據(jù)庫實體命名為EmployeeModel.edmx,點擊Add按鈕。圖9：新建實體模型在彈出對話框中選Generate from database，點擊Next按鈕。按下圖進行操作，直到Finish為止。圖10：從數(shù)據(jù)庫生成模型圖11：選擇數(shù)據(jù)鏈接圖12：選擇數(shù)據(jù)庫對象這樣數(shù)據(jù)模型就建立完畢。建立ADO.NET Data Service數(shù)據(jù)通訊服務(wù)右擊testDataGrid文件夾，依次點擊Add->New Item.。然后按下圖操作，將ADO.NET Data Service服務(wù)命名為EmployeeInfoService.svc。 圖1

53、3：創(chuàng)建ADO.NET Data Service修改EmployeeInfoService.svc.cs代碼如下：using .System; using System.Collections.Generic; using System.Data.Services; using System.Linq; using System.ServiceModel.Web; using System.Web; namespace testDataGrid . public class EmployeeInfoService : DataService . public static void Initi

54、alizeService(IDataServiceConfiguration config) . config.SetEntitySetAccessRule("*", EntitySetRights.All); config.SetServiceOperationAccessRule("*", ServiceOperationRights.All); 右擊剛才創(chuàng)建的EmployeeInfoService.svc,選擇菜單選項View in Browser(如下圖)，配置成功的話會出現(xiàn)下圖所示的頁面。按Ctrl+Shift+B進行整個項目的編譯（非常重要，

55、不然數(shù)據(jù)服務(wù)引用會出錯！）圖14：查看Web Service配置圖15：配置成功時出現(xiàn)的頁面右擊SilverlightClient項目文件夾下的References，選擇Add Service References.。接著，在彈出的對話框中點擊Discover按鈕，Services中出現(xiàn)剛才我們創(chuàng)建的EmployeeInfoService.svc，點擊其左邊的“+”展開符號，之后出現(xiàn)服務(wù)搜尋，結(jié)束后將Namespace改為EmployeeServiceReference。（見下圖）。圖16：添加服務(wù)引用這樣，建立ADO.NET Data Service數(shù)據(jù)通訊服務(wù)的過程就此結(jié)束。創(chuàng)建Silve

56、rlightClient界面及組件代碼MainPage.xaml代碼：<UserControl xmlns=" xmlns:x=" xmlns:d=" xmlns:mc="/markup-compatibility/2006" mc:Ignorable="d" xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"

57、x:Class="SilverlightClient.MainPage" d:DesignWidth="640" d:DesignHeight="480"> <Grid x:Name="LayoutRoot" Background="White" Width="320" Height="220"> <data:DataGrid x:Name="dgEmployee" Height="150"

58、Margin="8,8,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="304"/> <Button x:Name="btnGetData" Height="28" HorizontalAlignment="Left" Margin="8,171,0,0" VerticalAlignment="Top" Width="

59、98" Content="Get Data"/> </Grid> </UserControl>MainPage.xaml.cs代碼：using .System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Windows; using System.Windows.Controls; using System.Windows.Documents; using System.Windows.Input; using

60、 System.Windows.Media; using System.Windows.Media.Animation; using System.Windows.Shapes; using System.Data.Services.Client;/引入System.Data.Services.Client命名空間 using SilverlightClient.EmployeeServiceReference;/引入數(shù)據(jù)服務(wù)所在命名空間 namespace SilverlightClient . public partial class MainPage : UserControl . pu

61、blic MainPage() . InitializeComponent(); /注冊事件觸發(fā)處理 this.btnGetData.Click += new RoutedEventHandler(btnGetData_Click); void btnGetData_Click(object sender, RoutedEventArgs e) . EmployeesEntities proxy = new EmployeesEntities(new Uri("EmployeeInfoService.svc", UriKind.Relative); var query =

62、from c in proxy.Employee select c; DataServiceQuery userQuery = (DataServiceQuery)query; userQuery.BeginExecute(new AsyncCallback(OnLoadComplete), query);/異步調(diào)用 void OnLoadComplete(IAsyncResult result) . DataServiceQuery query = (DataServiceQuery)result.AsyncState; dgEmployee.ItemsSource = query.EndE

63、xecute(result).ToList();/將最終結(jié)果傳給DataGrid 最終效果圖最后，按F5鍵進行編譯測試。 在上一篇中，我們討論了怎樣使用ADO.NET Entity Framework+ADO.NET Data Service與數(shù)據(jù)庫進行交互的例子。本教程將使用另一常見的數(shù)據(jù)模型工具Linq to SQL Class+Silverlight-enabled WCF Service來與數(shù)據(jù)庫進行交互。準(zhǔn)備工作1）測試項目的建立2）創(chuàng)建測試用數(shù)據(jù)庫強大的DataGrid組件3_數(shù)據(jù)交互之Linq to SQL由于在上一篇中我已進行詳細的介紹，這里就不在贅述。創(chuàng)建Linq

64、to SQL 數(shù)據(jù)模型類右擊testDataGrid文件夾，點擊菜單選項Add->New Item.。按下圖進行操作，將數(shù)據(jù)庫實體命名為EmployeeModel.dbml,點擊Add按鈕。圖1：新建Linq to SQL數(shù)據(jù)實體模型打開Server Explorer，將Employees數(shù)據(jù)庫中的Employee表拖入Linq to SQL設(shè)計器中，并且將設(shè)計器中的Employee改為Employees。（如下圖）圖2：設(shè)計數(shù)據(jù)模型接著，對EmployeeModel.dbml的屬性進行設(shè)置。將Context Namespace設(shè)置為EmployeesContext，將Entity Na

65、mespace設(shè)置為EmployeesEntities。圖3：設(shè)置EmployeeModel.dbml的屬性按Ctrl+Shift+B，進行項目的編譯。建立Silverlight-enabled WCF Service數(shù)據(jù)通信服務(wù)右擊testDataGrid文件夾，點擊菜單選項Add->New Item.。按下圖進行操作，將WCF Service命名為EmployeeInfoWCFService.svc,點擊Add按鈕。圖4：新建Silverlight-enabled WCF Service之后，將下述代碼添加至EmployeeInfoWCFService.svc.cs文件中。using

66、 .System;using System.Linq;using System.Runtime.Serialization;using System.ServiceModel;using System.ServiceModel.Activation;using System.Collections.Generic;using System.Text;using EmployeesContext;/引入數(shù)據(jù)庫實體所在命名空間using EmployeesEntities;/引入數(shù)據(jù)表實體所在命名空間namespace testDataGrid.    Se

67、rviceContract(Namespace = "")    AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)    public class EmployeeInfoWCFService    .        /添加要調(diào)用的方法以

68、標(biāo)簽OperationContract開頭        OperationContract        public List GetEmployees()        .            EmployeeModelDataCo

69、ntext db = new EmployeeModelDataContext();            return db.Employees.ToList();             按Ctrl+Shift+B，進行項目的編譯。右擊SilverlightClient項目文件夾下的References，選擇Add Service Refere

70、nces.。接著，在彈出的對話框中點擊Discover按鈕，Services中出現(xiàn)剛才我們創(chuàng)建的EmployeeInfoWCFService.svc，點擊其左邊的“+”展開符號，之后出現(xiàn)服務(wù)搜尋，結(jié)束后將Namespace改為EmployeeWCFServiceReference。（見下圖）。 圖5：添加EmployeeInfoWCFService.svc的引用按Ctrl+Shift+B，進行項目的編譯。這樣，建立Silverlight-enabled WCF Service數(shù)據(jù)通訊服務(wù)的過程就此結(jié)束。創(chuàng)建SilverlightClient界面及組件代碼MainPage.xaml代碼

71、： <UserControl    xmlns="     xmlns:x="    xmlns:d="    xmlns:mc="/markup-compatibility/2006"     mc:Ignorable="d" xmlns:data

72、="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"    x:Class="SilverlightClient.MainPage"    d:DesignWidth="640" d:DesignHeight="480">    <Grid x:Name="LayoutRo

73、ot" Background="White" Width="320" Height="220">        <data:DataGrid x:Name="dgEmployee" Height="150" Margin="8,8,0,0" VerticalAlignment="Top"      

74、;   HorizontalAlignment="Left" Width="304"/>        <Button x:Name="btnGetData" Height="28" HorizontalAlignment="Left" Margin="8,171,0,0"        

75、0; VerticalAlignment="Top" Width="98" Content="Get Data"/>    </Grid></UserControl>MainPage.xaml.cs代碼：using .System;using System.Collections.Generic;using System.Linq;using System.Net;using System.Windows;using System.Windows.Controls;

76、using System.Windows.Documents;using System.Windows.Input;using System.Windows.Media;using System.Windows.Media.Animation;using System.Windows.Shapes;using System.Data.Services.Client;/引入System.Data.Services.Client命名空間using SilverlightClient.EmployeeWCFServiceReference;/引入數(shù)據(jù)服務(wù)所在命名空間namespace Silverl

77、ightClient.    public partial class MainPage : UserControl    .        public MainPage()        .            InitializeC

78、omponent();            /注冊事件觸發(fā)處理              this.btnGetData.Click += new RoutedEventHandler(btnGetData_Click);         

79、0;      void btnGetData_Click(object sender, RoutedEventArgs e)        .            EmployeeInfoWCFServiceClient webClient = new EmployeeInfoWCFServiceClient(); 

80、0;          webClient.GetEmployeesAsync();/異步調(diào)用              webClient.GetEmployeesCompleted += new EventHandler(webClient_GetEmployeesCompleted);