好久没来写博客了,这期间经历了春节,也因为忙于一个项目,所以博客被疏忽了。最近一段时间一直在用silverlight做项目,从来一开始的不熟悉渐渐的开始上手。今天记录一下自己学习prism的一些samplecode。

silvierlight目前的主流架构是Silverlight+MVVM+WCF RIA,说来惭愧本人做项目的时候对设计模式不是很了解。MVVM设计模式是指模型(Model)-视图(View)-视图模型(ViewModel),MVVM设计模式能够将程序的UI设计和逻辑设计分开,这样能够节省开发人员的大量时间,也可以使代码更容易维护和升级等。View是指UI,是用来展示的,Model可以定义一些数据访问的实体类,ViewModel是连接model层和view层的桥梁,它是中间层,主要用来一些业务逻辑的设计,这里包括与数据库的交互。

Prism是微软提供的一个用于Silverlight和WPF开发的框架。

下面重点讲讲Prim+MVVM的实现。

1.需要新建一个Silverlight应用程序,分为Silverlight服务端和客户端两部分,需要在Silverlight客户端添加View、Model、ViewModel几个文件夹,分别对应MVVM设计模式。

2.在Model中添加类Questionnaire

     /// <summary>
/// 定义Model,如果需要监听属性的变化,需要继承INotifyPropertyChanged类
/// </summary>
public class Questionnaire:INotifyPropertyChanged
{
private string favoriteColor;
public Questionnaire()
{
}
public event PropertyChangedEventHandler PropertyChanged; public string Name { get; set; } public int Age { get; set; } public string Quest { get; set; } public string FavoriteColor
{
get
{
return this.favoriteColor;
} set
{
//监听颜色属性的变化
if (value != this.favoriteColor)
{
this.favoriteColor = value;
if (this.PropertyChanged != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs("FavoriteColor"));
}
}
}
}
private string getText;
public string GetText
{
get { return getText; }
set
{
//监听字符的变化
if (value != this.getText)
{
this.getText = value;
if (this.PropertyChanged != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs("GetText"));
}
}
}
}
}

Model

3.添加在modelview文件夹中添加questionnaireviewmodel类

   /// <summary>
/// 定义viewModel
/// </summary>
public class QuestionnaireViewModel
{
private readonly Questionnaire questionnaire; public QuestionnaireViewModel()
{
this.questionnaire = new Questionnaire();
this.AllColors = new[] { "Red", "Blue", "Green" }; this.SubmitCommand = new DelegateCommand<object>(this.OnSubmit);//实例化一个command,DelegateCommand引用类库 Microsoft.Practices.Prism.Commands }
/// <summary>
/// 定义Model的属性
/// </summary>
public Questionnaire Questionnaire
{
get { return this.questionnaire; }
} public IEnumerable<string> AllColors { get; private set; }
/// <summary>
/// 定义一个command,可以绑定到控件上
/// </summary>
public ICommand SubmitCommand { get; private set; } private void OnSubmit(object obj)
{
questionnaire.GetText = this.BuildResultString().ToString(); } private string BuildResultString()
{
StringBuilder builder = new StringBuilder();
builder.Append("Name: ");
builder.Append(this.questionnaire.Name);
builder.Append("\nAge: ");
builder.Append(this.questionnaire.Age);
builder.Append("\nQuestion 1: ");
builder.Append(this.questionnaire.Quest);
builder.Append("\nQuestion 2: ");
builder.Append(this.questionnaire.FavoriteColor);
return builder.ToString();
}
}

4.在view文件夹中添加QuestionView,用来显示

 d:DesignHeight="" d:DesignWidth="">
<!--绑定ViewModel,获取上下文消息,这里面一般包括需要绑定的字段、类、方法等-->
<UserControl.DataContext>
<vm:QuestionnaireViewModel></vm:QuestionnaireViewModel>
</UserControl.DataContext>
<Grid x:Name="LayoutRoot" Background="White">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height=""/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
<ColumnDefinition Width="Auto"/> </Grid.ColumnDefinitions> <ScrollViewer Grid.Row="" Grid.ColumnSpan="" VerticalAlignment="Stretch">
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions> <Border Grid.Row="" >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="Auto" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="Auto" />
<ColumnDefinition Width="Auto" />
</Grid.ColumnDefinitions> <TextBlock Grid.Column="" Grid.Row="" VerticalAlignment="Bottom"><Run Text="Name"/></TextBlock>
<TextBox x:Name="NameTextBox" Grid.Column="" Grid.Row="" Text="{Binding Questionnaire.Name, Mode=TwoWay}" Width="" Margin="" /> <TextBlock Grid.Column="" Grid.Row="" VerticalAlignment="Bottom"><Run Text="Age"/></TextBlock>
<TextBox x:Name="AgeTextBox" Grid.Column="" Grid.Row="" HorizontalAlignment="Left" Text="{Binding Questionnaire.Age, Mode=TwoWay}" MaxLength="" Width="" Margin="" /> </Grid>
</Border> <Grid Grid.Row="" Margin="" >
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions> <TextBlock Grid.Row="" Text="What is your quest?" Style="{StaticResource QuestionLabelStyle}" />
<TextBox x:Name="Question1Response" Grid.Row="" Text="{Binding TestClass.Quest, Mode=TwoWay}" />
</Grid> <Grid Grid.Row="" Margin="">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"/>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="Auto"/>
</Grid.RowDefinitions> <TextBlock Grid.Row="" Style="{StaticResource QuestionLabelStyle}">
<Run Text="What is your favorite "/><Run x:Name="ColorRun" Text="color" Foreground="{Binding Questionnaire.FavoriteColor, TargetNullValue=Black}"/><Run Text="?"/>
</TextBlock> <Border Grid.Row="" Style="{StaticResource BorderBrush}">
<ListBox x:Name="Colors" IsTabStop="False" ItemsSource="{Binding AllColors}" Margin=""
SelectedItem="{Binding Questionnaire.FavoriteColor, Mode=TwoWay}">
</ListBox>
</Border>
</Grid>
</Grid>
</ScrollViewer>
<TextBlock Grid.Row="" Grid.Column="" Text="{Binding Path=Questionnaire.GetText,Mode=TwoWay}" HorizontalAlignment="Left" VerticalAlignment="Top" Width="" Height=""></TextBlock>
<Button x:Name="SubmitButton" Command="{Binding SubmitCommand}" Grid.Row="" Grid.Column="" Content="Submit" Height="" HorizontalAlignment="Right" Width=""/>
</Grid>

View

设计前台,并未控件绑定数据。其中Button控件绑定了无参数的ICommand命令,后台为DelegateCommand。通过Button控件 我们可以获取到数据源的变化,并将它显示到页面上。。

5.在MainPage主页面添加已经设计好的页面。

 <UserControl xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="SilverlightApplication4.MainPage"
xmlns:view="clr-namespace:SilverlightApplication4.View"
xmlns:viewModel="clr-namespace:SilverlightApplication4.ViewModel"
Width="" Height="">
<Grid x:Name="LayoutRoot" Background="White" >
<view:QuestionnaireView></view:QuestionnaireView>
<!--<view:PersonViewList DataContext="myele"></view:PersonViewList>-->
</Grid>
</UserControl>

Main

这样就玩一个了基本的Silverlight应用程序,本程序未设计到与数据库的交互,下一篇将会有所涉及。

最新文章

  1. Spring-test使用JUnit时,测试类autowired报错,create bean error
  2. django的前后的结合,search搜索功能案例
  3. Tomcat安装及配置
  4. mysql命令行操作
  5. (转)iOS消息推送机制的实现
  6. 1Android系统移植与驱动开发概述
  7. HDU 1540 Tunnel Warfare 线段树区间合并
  8. Lazy evaluation
  9. php缓存生成及更新实现参考哦
  10. hdu3081 Marriage Match II
  11. Ubuntu下安装pytorch(GPU版)
  12. AutoIt介绍
  13. JavaScript性能优化小知识总结
  14. Django-项目配置
  15. Ubuntu服务器的anaconda环境修复办法(自动进入base环境怎么办?)
  16. 20170617xlVBA调查问卷基础数据分类计数
  17. spring的jar包以及相关的API文档的下载方式
  18. ambassador 学习一基本试用
  19. Hash表及hash算法的分析
  20. Metabase 从 H2 迁移到 MySQL 踩坑指南

热门文章

  1. kaggle之旧金山犯罪
  2. Error &#39;Cannot add or update a child row: a foreign key constraint fails故障解决
  3. 【欧拉函数】【HDU1286】 找新朋友
  4. IE 中创建 子窗口 传值 与接收值 【window.showModalDialog】
  5. WinForm实现窗体最小化后小图标在右边任务栏下
  6. 【27前端】在线css三角
  7. sql 事务和回滚
  8. 初识nginx+tomcat
  9. Path Sum,Path Sum II
  10. CDZSC_2015寒假新人(1)——基础 b