一、利用Visual Studio 2010创建第一个基于服务和数据驱动的Silverlight应用程序

 

 

（1）、打开VisualStudio 2010,新建一个Silverlight应用程序项目，如下图：

 

 

 

选择Silverlight应用程序，如图

 

点击确定按钮，选择在新网站中承载Silverlight应用程序

Visual Studio 2010为我们创建好的界面如下：

 

 

（2）、接下来我们就来通过添加代码实现我们的第一个Silverlight应用程序。

      首先在用来承载Silverlight应用程序的Chapter01.Web中添加一个DataContract（数据契约）类，我们命名为：ProvinceCaptial

 

 

 

 

 

Province.cs代码如下：

using System; using System.Collections.Generic; using System.Linq; using System.Web; //需要手动添加的命名空间 using System.Runtime.Serialization; namespace Chapter01.Web { [DataContract] public class Province { [DataMember] public string ProvinceName { get; set; } [DataMember] public string ProvinceCaptal { get; set; } } }

 

接下来，我们来添加一个启用了Silverlight的WCF服务ProvinceCaptialService.svc文件

 

 

 

ProviceCaptialService.svc.cs代码如下：

using System; using System.Linq; using System.Runtime.Serialization; using System.ServiceModel; using System.ServiceModel.Activation; //手动添加命名空间 using System.Collections.Generic; namespace Chapter01.Web { [ServiceContract(Namespace = "")] [AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)] public class ProvinceCaptialService { [OperationContract] public void DoWork() { // 在此处添加操作实现 return; } // 这里我们添加一个GetProviceCaptial()方法 [OperationContract] public List<Province> GetProviceCaptial() { return new List<Province> { new Province {ProvinceName="安徽省",ProvinceCaptal="合肥市"}, new Province {ProvinceName="河南省",ProvinceCaptal="郑州市"}, new Province {ProvinceName="江西省",ProvinceCaptal="南昌市"}, new Province {ProvinceName="湖北省",ProvinceCaptal="武汉市"}, new Province {ProvinceName="山西省",ProvinceCaptal="太原市"}, new Province {ProvinceName="浙江省",ProvinceCaptal="杭州市"}, new Province {ProvinceName="江苏省",ProvinceCaptal="南京市"}, new Province {ProvinceName="四川省",ProvinceCaptal="成都市"} }; } } }

做完以上工作后，一定要首先编译我们的Chapter01.Web项目，目的是Silverlight应用程序能够发现我们的WCF服务。

 

接下来就是在Silverlight应用程序中添加服务引用

 

 

OK，现在我们来在MainPage.xaml文件中拖ComBox、Grid及TextBlock等控件来进行简单的布局用来展示：

 

 

 

MainPage.xaml以及MainPage.xaml.cs文件代码如下：

<UserControl x:Class="Chapter01.MainPage" 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" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="400" Loaded="UserControl_Loaded"> <Grid x:Name="LayoutRoot" Background="White"> <ComboBox Height="23" x:Name="cb_province" DisplayMemberPath="ProvinceName" HorizontalAlignment="Left" Margin="119,35,0,0" VerticalAlignment="Top" Width="120" SelectionChanged="cb_province_SelectionChanged" /> <TextBlock Height="23" HorizontalAlignment="Left" Margin="86,39,0,0" Name="textBlock1" Text="省份:" VerticalAlignment="Top" /> <Grid Height="100" HorizontalAlignment="Left" Margin="41,68,0,0" Name="grid1" VerticalAlignment="Top" Width="200"> <Grid.ColumnDefinitions> <ColumnDefinition Width="0.5*"></ColumnDefinition> <ColumnDefinition Width="0.5*"></ColumnDefinition> </Grid.ColumnDefinitions> <TextBlock Grid.Column="0" Text="省会城市:" HorizontalAlignment="Center" VerticalAlignment="Center"/> <TextBlock Grid.Column="1" Text="{Binding ProvinceCaptal}" Foreground="Red" HorizontalAlignment="Center" VerticalAlignment="Center"/> </Grid> </Grid> </UserControl>

 

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; using System.Windows.Shapes; //添加服务引用所在的命名空间 using Chapter01.ProvinceCaptialServiceReference; namespace Chapter01 { public partial class MainPage : UserControl { public MainPage() { InitializeComponent(); } private void cb_province_SelectionChanged(object sender, SelectionChangedEventArgs e) { //设置Grid控件数据源 this.grid1.DataContext = (sender as ComboBox).SelectedItem as ProvinceCaptialServiceReference.Province; } void client_GetProviceCaptialCompleted(object sender, GetProviceCaptialCompletedEventArgs e) { //获取结果的List集合绑定到Combox控件上 this.cb_province.ItemsSource = e.Result; } private void UserControl_Loaded(object sender, RoutedEventArgs e) { ProvinceCaptialServiceClient client = new ProvinceCaptialServiceClient(); client.GetProviceCaptialCompleted += new EventHandler<GetProviceCaptialCompletedEventArgs>(client_GetProviceCaptialCompleted); client.GetProviceCaptialAsync(); } } }

 

最终实现的效果如下：

 

下拉框发生变化时，内容也发生变化：

===========================================================================

如果觉得对您有帮助，微信扫一扫支持一下：