Silverlight中使用MVVM―提高(精选5篇)由网友“江湖骗子乔瑟夫”投稿提供,以下是小编为大家准备的Silverlight中使用MVVM―提高,供大家参考借鉴,希望可以帮助到有需要的朋友。
篇1:Silverlight中使用MVVM―提高
在第一篇文章中的示例中,我们已经简单的了解了应用MVVM模式的流程,我 的本意是你已经了解了一点MVVM的概念,然后又没有一个较好的例子学习,可以 跟着我一起学习MVVM模式,所以这个部分,都是没有理论知识的,当然整个例子 学完后,我们会回过头探讨一下,将其总结出来,
现在我们主要在前面的示例上进行扩展,前面的示例中我们主要是将一个源 对象绑定到DataGrid中的,接下来我们继续使用MVVM模式,将 DataGrid选择行 的变化体现界面中,其实通过这个需求变化,你会发现UI与逻辑分离带来的优势 ,尽管才开始似乎有点不习惯,但是相信你会不自觉的在项目倾向于中使用MVVM 模式。
需求:通过单击DataGrid,将当前的选择行的数据反映到TextBox中。
Model未发生变化,我们还用前面的Person.cs和Persons.cs两个类,那么对 于ViewModel,我们给其增加一个属性
private Person _getOnePerson;
public Person GetOnePerson
{
get { return _getOnePerson; }
set { _getOnePerson = value;
if (PropertyChanged != null)
{
PropertyChanged(this, new PropertyChangedEventArgs(“GetOnePerson”));
}
}
}
因为这里的属性将发生变化,所以我们对PageViewModel类实现了 INotifyPropertyChanged借口
UI层: 这里我们将GetOnePerson属性绑定到DataGrid的SelectedItem属性上
SelectedItem=“{Binding GetOnePerson,Mode=TwoWay}”
Height=“200” Name=“dataGrid1” VerticalAlignment=“Top” />
Name=“textBox1” VerticalAlignment=“Top” Width=“120” />
Name=“textBox2” VerticalAlignment=“Top” Width=“120” />
我们在UI上增加了2个TextBox,用于反映页面上的变化,主要就是注意一下 Binding的对象
这些都完成后,其它部分就不用改动了,我们已经完成了这个功能,我们可 以看看页面的效果:
单击前后的变化
功能虽较为简单,但是刚接触MVVM时, 要很顺利的实现也不算是一件容易的 事情,后面我会在这个例子的基础上,
通过使用Command实现一个较简单的查询,
篇2:Silverlight中使用MVVM―进阶
这篇主要引申出Command结合MVVM模式在应用程序中的使用
我们要做出的效果是这样的
就是提供了一个简单的查询功能将结果绑定到DataGrid中,在前面的基础上 ,这个部分相对比较容易实现了
我们在PageViewModel中添加两个属性
private string _searchText;
//查询关键字
public string SearchText
{
get { return _searchText; }
set { _searchText = value;
if (PropertyChanged != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs(“SearchText”));
}
}
}
private List
_resultText;
//查询结果
public List
ResultText
{
get { return _resultText; }
set { _resultText = value;
if (PropertyChanged != null)
{
this.PropertyChanged(this, new PropertyChangedEventArgs(“ResultText”));
}
}
}
这两个属性我们后面将绑定到View中,下面实现查询方法
//查询方法
public void Searhing
{
List
person = null;
if (!string.IsNullOrEmpty(SearchText))
{
person = new List
();
foreach (Person p in Human)
{
if (p.name.Contains(SearchText))
{
person.Add(p);
}
}
}
if (person != null)
{
ResultText = person;
}
}
我们这里就是通过查询到的集合person赋值给查询结果,这两步比较好理解, 然后我们需要在ViewModel中声明一个Command对象来执行页面的单击事件
private ICommand _cmd;
//声明Command
public ICommand Cmd
{
get { return _cmd; }
}
public PageViewModel()
{
Human = new List
();
Human = new Persons().getPerson();
_cmd = new QueryCommand(this);
}
在构造函数中实例了Command对象,在这里我们仍然有一步工作需要完成,就 是对QueryCommand的实现
public class QueryCommand:ICommand
{
public PageViewModel _pageVM = null;
public QueryCommand(PageViewModel vm)
{
_pageVM = vm;
}
public bool CanExecute(object parameter)
{
return true;
}
public event EventHandler CanExecuteChanged
{
add { }
remove { }
}
public void Execute(object parameter)
{
_pageVM.Searhing();
}
}
你可以看出来Command类是用ViewModel来实例的,自然这里面由Execute()完 成查询这个工作,
最后我们将UI上做点小小的变动
我们将DataGrid的ItemSource属性绑定到ResultText上,对于输入框我们则 将其绑定到SearchText属性上,这样我们就完成了大部分的工作
下面就是将View和ViewModel两者之间如何关联了,因为Sl3中不支持Commnad 这个属性,所以这里我们就在后台进行声明
PageViewModel pageviewmodel=new PageViewModel();
public PageView()
{
InitializeComponent();
this.btnSearch.Click += new RoutedEventHandler (btnSearch_Click);
this.DataContext =pageviewmodel;
}
void btnSearch_Click(object sender, RoutedEventArgs e)
{
pageviewmodel.SearchText = this.textBox1.Text.Trim ();
pageviewmodel.Cmd.Execute(null);
}
这一步完成后,我们就实现了开头的功能,这个功能虽然实现了,但是你可 能会发现一个问题,我们将Searching()的执行写在了QueryCommand.Execute() 中,
在这种情况下我们需要为每一个方法声明一个Command类,自然这不是我们期 望做的事情,所以我们下面将这个问题优化一下:
我们先声明一个RelayCommand类
public class RelayCommand : ICommand
{
private Action _handler;
public RelayCommand(Action handler)
{
_handler = handler;
}
private bool _isEnabled;
public bool IsEnabled
{
get { return _isEnabled; }
set
{
if (value != _isEnabled)
{
_isEnabled = value;
if (CanExecuteChanged != null)
{
CanExecuteChanged(this, EventArgs.Empty);
}
}
}
}
public bool CanExecute(object parameter)
{
return IsEnabled;
}
public event EventHandler CanExecuteChanged;
public void Execute(object parameter)
{
_handler();
}
这里RelayCommand类可以作为一个派生类用于与页面Command的实现,那么 ViewModel中,我们声明一个ICommand属性
private readonly ICommand _searchCommand;
public ICommand SearchCommand
{
get { return _searchCommand; }
}
自然我们需要将构造函数变动一下
public PageViewModel()
{
Human = new List
();
Human = new Persons().getPerson();
_searchCommand = new RelayCommand(Searhing) { IsEnabled = true };
}
通过第3行代码,我们其实就是将ViewModel与Command分离了,最后我们将 button事件代码修改一下
void btnSearch_Click(object sender, RoutedEventArgs e)
{
pageviewmodel.SearchText = this.textBox1.Text.Trim ();
pageviewmodel.SearchCommand.Execute(null);
}
这样的话,看起来似乎优雅了点,关于这部分内容网上资源也比较多,就不 多解释了,
下篇我将结合MVVM与Command实现一个简单的CRUD操作
本文配套源码
篇3:Silverlight中使用MVVM基础
这是我第一篇关于设计模式方面的文章,以前除了对单例模式等几个常用的 模式有所研究之外,对设计模式不是太重视,总觉得要到一定的程度才需要接触 ,最近的项目中使用了MVVM模式,所以这段时间查阅了大量这方面模式的文章, 理论上的东西大家都说的比较好,这里我也不大谈MVVM模式的优势了,只是美中 不足的是大部分给出的示例中,对于一个没有用过MVVM模式的人而言,这些例子 总是给人一种摸不着头绪的感觉,所以我想将我学习MVVM的过程一步步写下来, 希望对于和我一样,刚刚接触MVVM这个模式的人有一点点帮助,
如果你不知道MVVM模式,我建议你先了解一下MVVM模式,至少要知道实现该 模式的意图是什么。
那么我主要通过我认为是已经算是比较简单的例子进行讲解这个模式,当然 后面我们会在这个例子的基础上一步一步的进行扩展。
先来看一看我们的项目架构:
很典型的MVVM的分层方式
我们先来构建Model,首先在Person.cs中简单声明了一个类型
public class Person
{
public int age { get; set; }
public string name { get; set;}
}
类型定义好后,我们在Persons.cs中得到一个Person的集合
public class Persons
{
public List
person;
public List
getPerson()
{
person = new List
()
{
new Person{name = “Tom”, age = 21 },
new Person{name = “Jack”, age = 22 },
new Person{name = “Rose”, age = 23 },
};
return person;
}
}
那么这里我们就简单的完成了Model的工作,下面开始完成ViewModel部分的 工作
public class PageViewModel
{
public List
Human { get; set; }
public PageViewModel()
{
Human = new Persons().getPerson();
}
}
ViewModel也设计的很简单,只是简单的获取了之前定义的集合。
下面就是PageView部分了,这里用DataGrid进行显示数据
这里我们将DataGrid的源设为Human,这样我们就完成了MVVM模式各个层次的 初步构建,关键的问题是怎样将这几个部分有效的联系起来
我们将PageView,PageViewModel引入到MainPage中
xmlns=“schemas.microsoft.com/winfx//xaml/presentation”
xmlns:x=“schemas.microsoft.com/winfx/2006/xaml”
xmlns:d=“schemas.microsoft.com/expression/blend/”
xmlns:mc=“schemas.openxmlformats.org/markup- compatibility/2006”
mc:Ignorable=“d”
xmlns:viw=“clr-namespace:UseMVVMInApp.View”
xmlns:vmmodel=“clr-namespace:UseMVVMInApp.ViewModel”
d:DesignHeight=“300” d:DesignWidth=“400”>
这里的工作就是将PageViewModel声明为一个资源,然后通过页面引用它,这 样就实现了我们所谓的MVVM模式,
当然了,这个例子是很简单的,似乎用MVVM模式未免小题大作,但是实际上 ,页面与逻辑分离的情况下,我们改动其中任何一个部分都是比较清楚的。
好吧,这篇就到这里
篇4:Sharepoint中使用Silverlight的相关问题
Silverlight越来越多的应用到了Web开发环境,在Sharepoint中也不例外,下面是一些关于在Sharepoint 中使用Silverlight的备注事项:
1、IE版本问题:Silverlight的xap文件在64bit的IE里是不能加载的,因此,请用32bit的IE进行加载,
2、Safari浏览器支持问题:Silverlight WebPart不支持Mac机上的Safari浏览器,但在Pc机上的Safari浏览器能加载。
3、Xap文件调用路径问题: 在Sharepoint开发代码中调用xap文件时要使用xap文件的相对路径(Relative Path),因为你某天把现在的Web application扩展到其它区域时,你会使用不同的url来访问你的web,如果你使用的是full path,你的Silverlight WebPart就必然会因为url的改变而加载失败,
4、Xap文件部署位置问题: 至于如何部署你的xap文件,常见的有两种选择,一种是在你的Sharepoint网站上创建一个Document Library,然后在那儿存放你的xap文件。另一种是部署到“layouts”的“ClientBin”目录下,此方法的好处是便于在VS2010环境中对此位置进行操作。
5、WCF与Silverlight结合问题: 在WCF proxy generation与Silverlight的结合时会出现当升级了WCF service后,想进一步升级Silverlight 项目中对此WCF service的引用(reference),而此时你会发现proxy generation失败,项目里也无法创建proxy classes。试着通过reflecting你的Sharepoint网站里已经部署好的WCF service并修改web.config的有关设置来解决此问题。
篇5:学Silverlight 2系列(9):使用控件
本文为系列文章第九篇,主要介绍如何使用控件模板定制控件的观感, Silverlight提供了极其强大的功能,允许用户完全定制控件的外观。
定制控件内容
在Silverlight中,WatermarkedTextBox控件可以为用户的输入提供一段提示 信息,如果只是简单的一点文字信息,有时候未免显得单调,如果加上相应的图 片说明效果会更好,如下图所示的一个简单的用户登录界面:
这样看起来界面显的就生动多了,XAML声明如下:
Width=“320” Height=“48”>
Width=“320” Height=“48” HorizontalAlignment=“Left”>
Width=“120” Height=“48”>
很多控件都有Content或者Text属性,我们完全可以充分发挥自己的想象力去 进行定制,定制后控件仍然具有原来的功能行为,如上面的示例,当输入用户名 控件获得焦点时文字和图片都将消失:
使用控件模板定制控件
前面的示例中我们只是定制了控件的内容,Silverlight允许我们完全对控件 进行定制,而不仅仅是内容,
下面的示例中我们定制一个渐变色的圆角矩形按钮 。首先我们在App.xaml中创建一个RoundButton样式,改写按钮的Template属性 :
其中的渐变等内容在Graphics相关内容里将会写到。现在在XAML中使用该样 式:
Canvas.Top=“80” Canvas.Left=“150”/>
运行后就可以看到下面的效果:
创建模板
上面的示例中,控件的文字以及控件的大小都是固定的,我们希望在开发人 员使用中再设定,可以在控件模板中通过使用 {TemplateBinding ControlProperty} 的标识扩展句法来绑定到控件的属性来实现,使用 ContentPresenter控件可以灵活的设置各个属性。修改RoundButton样式如下所 示:
这样在使用RoundButton时我们可以设定控件的文本及控件的大小:
Canvas.Top=“80” Canvas.Left=“50”
Content=“提 交” FontSize=“26”
HorizontalContentAlignment=“Center”
VerticalContentAlignment=“Center”
Foreground=“White” Width=“200” Height=“60”/>
Canvas.Top=“80” Canvas.Left=“260”
Content=“取 消” FontSize=“26”
HorizontalContentAlignment=“Center”
VerticalContentAlignment=“Center”
Foreground=“White” Width=“100” Height=“100”/>
运行时效果如下:
结束语
本文简单的介绍了如何定制控件的内容以及通过控件模板完全定制控件,你 可以从下载本文示例代码。
本文配套源码
★ 年终总结程序员
★ 程序员年终总结
★ Expression Blend实例中文教程 控件快速入门ControlTempla
★ 软件开题报告
【Silverlight中使用MVVM―提高(精选5篇)】相关文章:
工程硕士选题报告范文2023-10-22
ntlm验证机制学习札记2022-12-12
项目管理工程硕士开题报告2023-10-23
前端架构师的岗位职责2022-12-21
Silverlight游戏设计:(五)面向对象的思想塑造游戏对象2022-11-21
ios项目总结怎么写2022-12-04
图形的变换课件2022-05-24
六年级上册《图形的变换》说课稿2022-09-19
.net面试项目介绍范文2022-11-16
如何屏蔽弹出的广告窗口2022-10-19