Silverlight WCF RIA服务(二十七)Silverlight 客户端 8

演练:在Silverlight商业应用程序中显示数据
在本演示中,我们将创建一个显示数据的Silverlight商业应用程序。Visual Studio提供了几个设计时工具来帮助我们创建SL商业应用程序。这个演练将展现如何使用DataSources窗口在RIA中创建与数据一起工作的用户界面。
演示将会满足下面的任务:
1. 创建SL商业应用程序,它包含SL客户端和ASP.NET Web应用两个项目。
2. 通过更改应用程序名字来修改应用程序资源,它存贮为资源字符。
3. 创建一个AdventureWorksClassLibrary示例数据库的实体数据模型。
4. 创建一个向客户端公开实体数据模型中数据的域服务。
5. 在域服务中添加和修改自定义查询。
6. 创建额外的SL页面来向用户显示数据。
7. 在默认的导航栏中添加按钮来访问SL中的页面。
8. 通过从Data Sources窗口向Silverlight设计器中拖拽条目来配置SL页面显示数据。
9. 排序和分页数据。
10. 配置用户界面来接受查询参数。

这个演练是在VS2010中进行的,如果是其他版本会有不同。

创建SL商业应用程序

1. 打开文件->新建->项目
2. 展开Visual c#或Visual Basic,并选择Silverlight。
3. 选择Silverlight Business Application
4. 在名字文本框内,输入AdventureWorksApp并点击OK。
这个解决方案包含两个项目:一个AdventureWorksApp客户端项目和一个AdventureWorksApp.Web Web应用项目。

命名和测试应用程序
Silverlight Business Application有内置功能。默认的,它有一个主页,一个关于页,一个导航栏,以及注册功能。提供了一个资源字符来作为默认的应用程序名字,我们可以更改它。
1. 在客户端解决方案资源管理器中,展开Resources文件夹。(VS2008中打开Assets文件夹下的Resources文件夹)
2. 双击ApplicationStrings.resx,打开资源编辑器。
3. 把资源字符串ApplicationName的值改为Adventure Works Application.
4. 保存并关闭ApplicationStrings.resx文件。
5. 运行应用程序。
主页会打开并显示默认的设计,包括已经更改过的应用程序名称。

为应用程序创建一个数据模型

1. 在解决方案资源管理器中,右键点击AdventureWorksApp.Web,并添加一个新项。
2. 在"添加新项"对话框中,选择ADO.NET Entity Data Model项。
3. 命名为AdventureWorksEDM.edmx,然后点击添加。实体数据模型向导会打开。
4. 在"选择模型内容"的页面上,点击"从数据库生成",然后点击"下一步"。
5. 在"选择数据连接"的页面上,选择或创建对AdventureWorks数据库的链接。
6. 确保选择了"Save entity connection settings in Web.Config as"选项,然后点击"下一步"。
7. 在"选择数据库对象"的页面上,重新命名模型命名空间Model为AdventureWorksDataModel。
8. 展开"表"节点,选择Customer表。
9. 点击"完成"。
10. 生成解决方案。

创建域服务

一个域服务会把数据模型中的数据实体和操作公开给客户端。它是添加在服务端项目中的。
1. 在"解决方案资源管理器"中,右键点击AdventureWorksApp.Web,并添加一个新项。
2. 在"添加新项"对话框中,选择"Domain Service Class"。
3. 命名为AdventureWorksService。
4. 点击"添加"。 "添加新项"对话框出现。
5. 选择下面的复选框:
. Enable client access
. Customer 和 Enable editing
. Generate associated classes for metadata.
6. 点击OK
7. 生成解决方案。

更改域服务的查询

域服务提供默认的操作,我们应该为我们特定的应用而修改它们。这个演练中,我们更改默认的查询,来返回按CustomerID排序的客户。

1. 在"解决方案资源管理器"中,双击AdventureWorksSercice.cs或AdventureWorksService.vb.
2. 更改GetCustomers方法,如下:
 

?
1
2
3
4
5
6
public IQueryable<CUSTOMER> GetCustomer()
        {
            return this.ObjectContext.Customer.OrderBy(c=>c.CustomerID);
        }


3. 生成解决方案。

创建Silverlight页面来显示数据
从Customer表返回的数据显示在自己的页面上,不显示在应用程序的首页上。

1. 在"解决方案资源管理器"中,右键点击客户端项目中的Views文件夹,并添加新项。
2. 在"添加新项"对话框中,选择Silverlight Page项。
3. 更改名字为CustomerList.xaml,并点击"添加"。
4. 从工具栏拖拽一个TextBlock放在CustomerList.xaml页面的顶部。
5. 把Text属性改为Customer List。
6. 保存CustomerList.xaml页面。

在首页上添加导航按钮
我们在应用程序的首页上添加一个导航到CustomerList页面的按钮。

1. 在"解决方案资源管理器"中,双击MainPage.xaml.
2. 在XAML视图里,在行下面添加如下代码:
 

?
1
2
3
4
5
<RECTANGLE x:Name="Divider3" />
 
<HYPERLINKBUTTON x:Name="Link3" <br Content="Customers" />NavigateUri="/CustomerList" TargetName="ContentFrame"/>


3. 运行应用程序,确认Customers按钮显示在导航栏上,并点击的时候显示CustomerList页面。

在CustomerList页面上显示客户数据
在DataGrid中显示客户数据。下面,我们就创建和配置一个DataGrid来显示客户数据,需要从Data Sources窗口拖拽一个Customer实体到设计窗口内。

1. 双击CustomerList.xaml。
2. 打开Data Sources窗口。可以在Data菜单中,选择Show Data Sources。注意Data Sources窗口已经包含了可用的实体。
3. 从Data Sources窗口中把Customer节点拖到设计器中,在TextBlock下面。
4. 运行应用程序并点击导航栏上的Customers按钮。
5. 核实在CustomerList页面上显示了Customer数据。
(我在VS2008中使用Data source有问题,生成不了数据节点。好像在Silverlight3中没有了ComponentModel.dll,所以直接使用域上下文来查询数据)

在域服务中添加自定义查询

1. 双击AdventureWorksService.cs。
2. 在类中添加如下代码:
 

?
1
2
3
4
5
6
7
8
9
10
11
public IQueryable<CUSTOMER> GetCustomersByTitle()
{
   return this.ObjectContext.Customer.Where(c => c.Title == "Mr.").OrderBy(c => c.CustomerID);
}
 
public IQueryable<CUSTOMER> GetCustomersByLastName(string lastName)
{
  return this.ObjectContext.Customer.Where(c => c.LastName==lastName).OrderBy(c=>c.CustomerID);
}


3. 生成解决方案。

显示自定义查询返回的数据

1. 双击CustomerList.xaml。
2. 在"数据源"窗口,选择Customer并点击下拉菜单。
3. 在查询列表中选择GetCustomersByTitle。
4. 把Customer节点拖拽到已经存在于设计器中的DataGrid。
5. 运行应用程序,并验证只有Title等于Mr.的顾客显示在页面上。

添加排序功能

VS2008中实现如下:
1. 双击CustomerList.xaml。
2. 在XAML视图中,在DomainDataSource控件中,添加SortDescriptors。
3. 设置PropertyPath属性为"LastName"。设置Direction属性为Ascending。
4. 运行应用程序,注意到顾客数据已经按LastName排序了。

添加分页功能

VS2008中实现如下:
1. 双击CustomerList.xaml。
2. 在XAML视图中,在DomainDataSource控件中,添加PageSize属性,并设置为15.添加LoadSize属性,并设置为30.
3. 添加DataPager控件。
 

?
1
2
3
<?xml:namespace prefix = data ns = "http://www.google.com/2005/gml/data" /><data:DataPager Source="{Binding Data, ElementName=source}"></data:DataPager>


4. 运行应用程序,注意到页面装载的速度已经大大加快了。并且可以通过DataPager控件浏览数据。

创建一个页面来根据LastName进行查询

1. 在AdventureWorksApp中的Views文件夹下,添加新项。
2. 在"添加新项"对话框中,选择Silverlight Page项。
3. 命名为CustomerSearchByLastName.xaml,并点击"添加"。
4. 保存这个页面。

在首页中添加一个导航按钮

1. 双击MainPage.xaml。
2. 在XAML视图中,在Link3的HyperlinkButton下面添加如下代码。
 

?
1
2
3
4
5
<RECTANGLE x:Name="Divider4" />
 
<HYPERLINKBUTTON x:Name="Link4" Content="Customer Search" TargetName="ContentFrame" NavigateUri="/CustomerSearchByLastName" />



创建用户界面来运行GetCustomerByLastName查询
VS2008中实现如下:

1. 双击CustomerSearchByLastName.xaml
2. 添加命名空间引用
 

?
1
2
3
4
5
6
xmlns:riaControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Ria"
xmlns:riaData="clr-namespace:System.Windows.Data;assembly=System.Windows.Controls.Ria"
xmlns:domain ="clr-namespace:AdventureWorksApp.Web"
xmlns:data="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Data"


3. 然后在Grid中添加数据源、DataGrid、文本框和按钮(实际代码中不需SL:前缀),如下代码:

 

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
<GRID x:Name="LayoutRoot">
<RIACONTROLS:DOMAINDATASOURCE x:Name="source" LoadSize="30" PageSize="15" AutoLoad="True" QueryName="GetCustomersByLastName">
            <RIACONTROLS:DOMAINDATASOURCE.DOMAINCONTEXT>
                <DOMAIN:ADVENTUREWORKSCONTEXT />
            </RIACONTROLS:DOMAINDATASOURCE.DOMAINCONTEXT>
            <RIACONTROLS:DOMAINDATASOURCE.QUERYPARAMETERS>
                <RIACONTROLS:CONTROLPARAMETER RefreshEventName="LostFocus" PropertyName="Text" ControlName="lastName" ParameterName="lastName" />
            </RIACONTROLS:DOMAINDATASOURCE.QUERYPARAMETERS>
        </RIACONTROLS:DOMAINDATASOURCE>
        <STACKPANEL>
            <TEXTBLOCK Text="Customer Searched By LastName List" />
            <SL:TEXTBOX x:Name="lastName" HorizontalAlignment="Left" Width="200" />
            <SL:BUTTON Content="Load" HorizontalAlignment="Left" Width="50" />
            <DATAC:DATAGRID ItemsSource="{Binding Data, ElementName=source}">
            </DATAC:DATAGRID>
        </STACKPANEL>
 
 </GRID>



测试应用程序

1. 生成解决方案。
2. 运行应用程序。
3. 点击"Customer Search"。
4. 在文本框中输入想要查询的LastName,例如"liu"。
5. 点击Load按钮。
6. 将会显示名为"liu"的客户

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值