在Windows或者ASP.NET Web应用程序中,我们经常可以看到在Grid控件上通过Load-on-demand的方式来提高系统性能,提升用户体验。
所谓Load-on-demand就是在最初表格数据加载时只加载当前表格中用户可以看到的行数,当用户向下滚动或拖拽纵向滚动条时,再将需要显示的数据通过某种方式动态加载进来。
那么对于Silverlight,我们可以使用DataGrid通过WCF RIA Service来实现这个功能。
1. WCF RIA Service
我们将会使用WCF Service来提供数据,并且将这个WCF Service host到ASP.Net应用程序中。
- 定义数据对象
[DataContract]
public
class
Employee
{
[DataMember]
public
int
ID {
get
;
set
; }
[DataMember]
public
string
Name {
get
;
set
; }
[DataMember]
public
string
Department {
get
;
set
; }
[DataMember]
public
double
Salary {
get
;
set
; }
}
|
使用DataContract和DataMember来标识数据对象以及对象属性,这样就可以通过WCF Service来传递这个数据结构了,注意需要添加System.Runtime.Serialization.dll。
- 添加Silverlight enabled WCF Service
在WebApplciation工程中添加一个新的Item,选取”Silverlight enabled WCF Service”,命名为”EmployeeService.svn”.
在PepoleService.svn.cs中添加如下代码:
[OperationContract]
public
List<Employee> GetEmployeeData(
int
startRow,
int
endRow)
{
List<Employee> employees =
new
List<Employee>();
for
(
int
i = startRow; i < endRow; i++)
{
employees.Add(
new
Employee()
{
ID = i,
Name =
string
.Format(
"Name {0}"
, i),
Department =
string
.Format(
"Department {0}"
, i),
Salary = i * 100.0
});
}
return
employees;
}
|
注意在上面一步添加完WCF Service后,会在Web.config文件中添加关于Service的配置信息:
<
system.serviceModel
>
<
behaviors
>
<
serviceBehaviors
>
<
behavior
name
=
"Silverlight.Web.EmployeeServiceBehavior"
>
<
serviceMetadata
httpGetEnabled
=
"true"
/>
<
serviceDebug
includeExceptionDetailInFaults
=
"false"
/>
</
behavior
>
</
serviceBehaviors
>
</
behaviors
>
<
serviceHostingEnvironment
aspNetCompatibilityEnabled
=
"true"
/>
<
services
>
<
service
behaviorConfiguration
=
"Silverlight.Web.EmployeeServiceBehavior"
name
=
"Silverlight.Web.EmployeeService"
>
<
endpoint
address
=
""
binding
=
"basicHttpBinding"
contract
=
"Silverlight.Web.EmployeeService"
/>
<
endpoint
address
=
"mex"
binding
=
"mexHttpBinding"
contract
=
"IMetadataExchange"
/>
</
service
>
</
services
>
</
system.serviceModel
>
|
关于如何Host WCF Service到IIS,可以参考MSDN文章:Hosting and Consuming WCF Services。
2. Load-on-demand数据加载
- 在Silverlight工程中添加Service引用
如下图通过给Silverlight工程添加Service reference来操作WCF Service:
- 从WCFService中获取数据
将WCF Service引入后,IDE会自动生成EmployeeServiceClient类,通过这个代理我们就可以使用Service上的方法了。
通过如下代码可以从WCF Service获得Employee数据:
public
partial
class
Page : UserControl
{
private
ObservableCollection<Employee> _employees;
private
void
GetData(
int
startRow,
int
endRow)
{
EmployeeServiceClient proxy =
new
EmployeeServiceClient();
proxy.GetEmployeeDataCompleted +=
new
EventHandler<GetEmployeeDataCompletedEventArgs>(proxy_GetDataCompleted);
proxy.GetEmployeeDataAsync(startRow, endRow);
}
private
void
proxy_GetDataCompleted(
object
sender, GetEmployeeDataCompletedEventArgs e)
{
foreach
(Employee employee
in
e.Result)
{
this
._employees.Add(employee);
}
}
}
|
- 在DataGrid上实现数据的Load-on-demand
Silverlight DataGrid提供了一个事件:LoadingRow,该事件会在某一个Row第一次被显示的时候被触发。通过这个事件我们就可以实现数据的按需加载,在这个事件中我们可以拿到该Row的RowIndex,如果发现当前将要显示的Row已经接近末尾(当前定义为距离末尾小于5),那么就需要向服务器端请求数据。
示例代码:
private
void
Page_Loaded(
object
sender, RoutedEventArgs e)
{
this
._startRowIndex = 0;
this
._employees =
new
ObservableCollection<Employee>();
this
.peopleDataGrid.ItemsSource = _employees;
GetData(
this
._startRowIndex,
this
._pageSize);
}
private
void
peopleDataGrid_LoadingRow(
object
sender, DataGridRowEventArgs e)
{
if
(
this
._isLoading ||
this
._employees.Count < _pageSize)
{
return
;
}
if
(
this
._employees.Count - 5 < e.Row.GetIndex())
{
this
.GetData(
this
._startRowIndex,
this
._startRowIndex +
this
._pageSize);
}
}
|
运行程序,拖动ScrollBar到底部,你会发现DataGrid会自动加载数据。
您可以通过这里下载全部示例代码。
该程序中不满意的地方就是ScrollBar的Thumb button会随着加载数据的增多而变小,如果您有更好的方式我们可以继续探讨。
本文转自 powertoolsteam 51CTO博客,原文链接:http://blog.51cto.com/powertoolsteam/449304,如需转载请自行联系原作者