该Demo是使用Silverlight Business Application的框架来通过WCF Ria Service来读取一个表里的数据后,显示到Silverlight页面里。
1) 新建项目的时候选则新建"Silverlight Business Application",该项目模板会自动启动WCF RIA Service,项目名称“RiaServiceDemo”。
2) 在该项目中的Web子项目"RiaServiceDemo.Web"中,在App_Data文件目录下Attach上一个现有的数据库,以备我们当做项目的数据库使用。
3)下一步我们进行数据建模阶段,新建“ADO.NET Entity Data Model”,为该DataModel命名为“EventManagerDBModel.edmx”。接下来指定到我们刚刚Attached上的数据库中的几个表。
4) 创建DomainService服务:在创建DomainService之前要编译一下该项目,然后在Services文件夹下新建一个DomainService - “EventManagerDomainService”,指定该DomainService服务的几个表。
5) 打开RiaServiceDemo -> Views -> Home.xaml 来进行数据的绑定创建工作。打开后,在左侧的Data Srouce中找到我们添加的数据源中的“Event”表后,把该表拖拽到Home.xaml的设计页面里来,这样就会自动生成一个针对于该表的DataGrid来。
6) 运行该项目就能看到从数据库中读取Event表后,显示的数据结果。
这里我们只是妥妥拽拽就显示出来一个把一个数据库中表的数据读取到Silverlight页面中来。这里我们需要分析一下源代码来学习:
首先是Home.xaml源代码:
<navigation:Page
x:Class="RiaServiceDemo.Home"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480"
Style="{StaticResource PageStyle}"
xmlns:riaControls="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.DomainServices"
xmlns:my="clr-namespace:RiaServiceDemo.Web.Services"
xmlns:my1="clr-namespace:RiaServiceDemo.Web"
xmlns:sdk="http://schemas.microsoft.com/winfx/2006/xaml/presentation/sdk">
<Grid x:Name="LayoutRoot">
<ScrollViewer x:Name="PageScrollViewer" Style="{StaticResource PageScrollViewerStyle}">
<StackPanel x:Name="ContentStackPanel" Style="{StaticResource ContentStackPanelStyle}">
<!--这里的Binding到的是App.xaml里的x:key为“ApplicationResources”的类->ApplicationResources类的Strings属性(该属性代码:
namespace RiaServiceDemo
{
using System;
using System.ComponentModel;
using System.Globalization;
using System.Windows.Browser;
public sealed class ApplicationResources
{
private static readonly ApplicationStrings applicationStrings = new ApplicationStrings();
private static readonly ErrorResources errorResources = new ErrorResources();
public ApplicationStrings Strings
{
get { return applicationStrings; }
}
public ErrorResources Errors
{
get { return errorResources; }
}
}
}
这里可以看出Strings属性get到的是ApplicationStrings类,也就是ApplicationStrings.resx资源文件类的Name为HomePageTile的Value
)-->
<TextBlock x:Name="HeaderText" Style="{StaticResource HeaderTextStyle}"
Text="{Binding Path=Strings.HomePageTitle, Source={StaticResource ApplicationResources}}"/>
<!--DomainDataSource来指定当前xaml页面中的数据源为EventManagerDomainContext
并且使用该DomainContext中的GetEventQuery来查询数据-->
<!--下面指定了当前的DomainService为哪个-->
<riaControls:DomainDataSource AutoLoad="True" d:DesignData="{d:DesignInstance my1:Event, CreateList=true}" Height="0" LoadedData="eventDomainDataSource_LoadedData" Name="eventDomainDataSource" QueryName="GetEventQuery" Width="0">
<riaControls:DomainDataSource.DomainContext>
<my:EventManagerDomainContext />
</riaControls:DomainDataSource.DomainContext>
</riaControls:DomainDataSource>
<!--把DataGrid的ItemsSource Binding到上面的DomainDataSource上去-->
<sdk:DataGrid AutoGenerateColumns="False" Height="200" ItemsSource="{Binding ElementName=eventDomainDataSource, Path=Data}" Name="eventDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" Width="640">
<!--上面进行datacontext数据查询等同于后台代码里代码如下:-->
<!--<sdk:DataGrid AutoGenerateColumns="False" Height="200" Name="eventDataGrid" RowDetailsVisibilityMode="VisibleWhenSelected" Width="640">-->
<!--
public Home()
{
InitializeComponent();
this.Title = ApplicationStrings.HomePageTitle;
EventManagerDomainContext _eventManagerDomainContext = new EventManagerDomainContext();
this.eventDataGrid.ItemsSource = _eventManagerDomainContext.Events;
_eventManagerDomainContext.Load(_eventManagerDomainContext.GetEventQuery());
}
-->
<sdk:DataGrid.Columns>
<sdk:DataGridTextColumn x:Name="eventDescriptionColumn" Binding="{Binding Path=EventDescription}" Header="Event Description" Width="SizeToHeader" />
<!--这里使用了DataTemplate来生成一个DatePicker的列,可以显示并且选择日期-->
<sdk:DataGridTemplateColumn x:Name="eventEndDateColumn" Header="Event End Date" Width="SizeToHeader">
<sdk:DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<sdk:DatePicker SelectedDate="{Binding Path=EventEndDate, Mode=TwoWay, NotifyOnValidationError=true, ValidatesOnExceptions=true}" />
</DataTemplate>
</sdk:DataGridTemplateColumn.CellEditingTemplate>
<!--这里在一个Column里使用了两个DataTemplate,这样的话就可以正常显示Date日期,并且在双击TextBlock的时候,显示DatePicker进行日期选择-->
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=EventEndDate, StringFormat=\{0:d\}}" />
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
<sdk:DataGridTextColumn x:Name="eventIDColumn" Binding="{Binding Path=EventID, Mode=OneWay}" Header="Event ID" IsReadOnly="True" Width="SizeToHeader" />
<sdk:DataGridTemplateColumn x:Name="eventStartDateColumn" Header="Event Start Date" Width="SizeToHeader">
<sdk:DataGridTemplateColumn.CellEditingTemplate>
<DataTemplate>
<sdk:DatePicker SelectedDate="{Binding Path=EventStartDate, Mode=TwoWay, NotifyOnValidationError=true, ValidatesOnExceptions=true}" />
</DataTemplate>
</sdk:DataGridTemplateColumn.CellEditingTemplate>
<sdk:DataGridTemplateColumn.CellTemplate>
<DataTemplate>
<TextBlock Text="{Binding Path=EventStartDate, StringFormat=\{0:d\}}" />
</DataTemplate>
</sdk:DataGridTemplateColumn.CellTemplate>
</sdk:DataGridTemplateColumn>
<sdk:DataGridTextColumn x:Name="eventTitleColumn" Binding="{Binding Path=EventTitle}" Header="Event Title" Width="SizeToHeader" />
<sdk:DataGridTextColumn x:Name="eventVenueNameColumn" Binding="{Binding Path=EventVenueName}" Header="Event Venue Name" Width="SizeToHeader" />
<sdk:DataGridCheckBoxColumn x:Name="isLiveColumn" Binding="{Binding Path=IsLive}" Header="Is Live" Width="SizeToHeader" />
</sdk:DataGrid.Columns>
</sdk:DataGrid>
</StackPanel>
</ScrollViewer>
</Grid>
</navigation:Page>