[Silverlight][Expression Blend]我也不用写程序 - 透过ChangePropertyBehavior动态改变DataTemplate中数据的呈现方式

http://www.dotblogs.com.tw/ouch1978/archive/2011/07/01/sl-changepropertyaction.aspx

 

 

[WPF]真的不用写程式也能藉由资料改变外观-利用DataTemplate.Triggers一文中,我们可以透过DataTemplate.Triggers在WPF中动态的改变系结的资料的呈现方式,那么,在Silverlight里也能依样画葫芦吗??
如果是行动派的朋友,真的去建个Silverlight专案,并且试着在DataTemplate下想去存取它的Triggers属性时,应该会发现–咦!!!? Silverlight的DataTemplate里没有Triggers这个属性可以用!!!!

先别太灰心~Silverligt 4里还是有替代方案可以做到一模一样的效果的啦!!只是,这次要使用到的元件,属于Expression Blend SDK for Silverlight里的Conditional behaviors ,所以用Blend来操作,会比较顺手许多喔!!

废话不多说,马上来和大家分享作法~

首先请自行透过Blend建立Silverlight 4.0专案,并且建立好Sample Data,并且将它系结至ListBox中(做法可以参考小猴子点部落零元学Expression Blend 4 - Chapter 31看如何简单的把SampleData绑进ListBox里 )。

我自己建立的资料如下(用来显示学生国文、英文、数学三个科目的成绩):

而我将ListBox的ItemsTemplate修改如下:

隱藏程式碼

前置作业到此算告一段落,接着我想做的是:三个科目的成绩如果不及格,则分数以红色显示 , 及格则以绿色显示 ,另外, 如果三科都及格,则会显示出All Pass 。

接着就轮到这次的主角ChangePropertyAction出场啦!!ChangePropertyAction可以在Assets面版中的Behaviors分类中找到,因为我们想要依照分数来决定文字的颜色,且分为及格与不及格,所以请直接以滑鼠拖拉一个ChangePropertyAction到用来显示分数的TextBlock控制项里。

下一步,请先点选刚刚加入的ChangePropertyAction,并且移动注意力到它的Properties面版,会看到如下的预设值:

接着我们就要来处理当分数及格的时候,分数要改以绿色显示的部份;因为我们需要透过值的内容改变当作触发条件,我们必需把预设的EventTrigger改为DataTrigger,请点选TriggerType右方的New按钮,并且选取DataTrigger后,按下Ok按钮。

接着请按下Binding栏位右方的Data bind图示,并且选取要用来当作Trigger的系结属性 (以我的例子来讲,现在要处理的系结属性是Grades.Chinese,直接选取它,并且按下Ok钮即可)。

因为及格的是大于等于六十分,所以我们得在Trigger分类中Comparison下拉选单中把预设的Equal改为GreaterThanOrEqual ,并且把Value的值改为60

接着我们要来设定当条件符合时要修改的属性值,在Common Properties分类中的PropertyName下拉选单中选取ForegroundValue则利用颜色选取器选取绿色 ,到这边为止,我们完成了第一组的设定 。

再来我们得处理不及格的部份,可以简单的将刚刚设定好的ChangePropertyAction复制一份,贴回同一个控制项中,并且修改Trigger分类下的Comparison 值为 LessThan ,接着把Common Properties分类下的Value改为红色

重复以上的流程,处理好另外两个分数的部份之后,接着就是另一个重点啦~如果三个分数都及格的话,得显示All Pass的字样;一样,我们得为txtPass也加入ChangePropertyAction。 不过这次不一样的是,我们这次要透过EventTrigger来控制它~而且我希望在该控制项被戴入时就去进行判断,所以我们得把Trigger分类中的EventName改为Loaded

接着请打开Conditions分类的面版,并且保持一颗清醒的头脑,因为接下来的动作比较复杂喔!!打开Conditions分类面版后,按下右上方的Add Condition图示。

接着要进行的动作跟之前设定DataTrigger的部份很相似,我们得针对三个分数的系结分别做设定:如下图,点选Advanced options图示->于下拉选单中点选Data Binding.. .并且选取要用来判断的系结属性。

再来一样是老样子,我们得把Equal改成GreaterThanOrEqual ,并把下面的Value值输入为60 ,并且重复以上步骤,直到针对三个分数的系结都完成设定( 请注意Conditions分类面版中有个Match下拉选单,可以用来决定要所有条件都符合才会触发,还是任一条件符合就触发ChangePropertyAction ) 。

再来,当三个条件都成立的话,我们就得让All Pass显示出来,所以我们要修改的是Visibility属性。

Ok,到这边为止,我们完成的All Pass显示与否的一半了,再来一样把刚刚设定好的ChangePropertyAction复制一份到txtAllPass下。

接着要修改的部份可得小心仔细喔!!再来我们要针对刚才复制好的ChangePropertyAction做以下的修改:将Match下拉选单的值改为any (因为任何一科不及格就不是All Pass啦~)、将三组ComparisonCondition的比较条件改为LessThan ,最后将Visibility的值改为Collapsed

Ok~做到这边,就大功告成啦!!赶快来看看成果吧!!(有跟着做的同学们,有没有很有成就感啊!?)

最后奉上专案原始码,请自行取用:

 

 

 
 

时间: 2024-08-30 18:18:38

[Silverlight][Expression Blend]我也不用写程序 - 透过ChangePropertyBehavior动态改变DataTemplate中数据的呈现方式的相关文章

Silverlight:使用 XAML 和 Expression Blend 创建动画

原文使用 XAML 和 Expression Blend 创建动画                                        Lawrence Moroney                                                                                                           本文将介绍以下内容:                                            

分批读取文件中数据的程序流程及其C代码实现

一.概述 在实际的软件开发项目中,经常需要处理大量的文件.某些文件中包含了相当多的数据记录数,如作者本人参与过的项目中,一个文件中有好几十万条记录.如果一次性将多条记录读入,则会花费大量的处理时间,且占用大量的内存. 为此,要求对于包含大量数据记录的文件进行分批读取操作,即每一轮读取一定数目的数据记录,待将这些记录处理完成之后,再读取下一批数据.本文介绍分批读取文件中数据的程序流程,并给出了C程序实现. 二.总体程序流程 实现分批读取文件中数据的程序流程如图1所示. 图1 实现分批读取文件中数据

vc 如何创建服务-VC 开机自动启动。不用写注册表的方法。想写一个服务来启动这个程序。

问题描述 VC 开机自动启动.不用写注册表的方法.想写一个服务来启动这个程序. 有个EXE程序想要它开机自动启动.我不想用写注册表的方法启动.看能不能够写一个服务来启动这个程序.如果可以麻烦大家能够提供源码.谢谢!!!!! 解决方案 创建服务,CreateService()

Hello,Expression Blend 4 (含Demo教程和源码)

前言 这段时间的开发不会用到Blend,到年底才会大量用到,本来打算到时候在写Blend相关的笔记,不过看到一些朋友还比较感兴趣,所以这里提前整理了一下. 首先,我希望你记住下面几点: 1. Blend并不完全是为Designer设计的,玩得最好的一定是Programmer 2.必须了解Behavior,Blend很多特性基于Behavior Expression Blend 的技术发展历史 2007 Blend的第一个版本就可以进行基本的动画设计.它通过提供一个Object and Timei

一起谈.NET技术,Expression Blend实例中文教程(2) - 界面快速入门

上一篇主要介绍Expression系列产品,另外概述了Blend的强大功能,本篇将用Blend 3创建一个新Silverlight项目,通过创建的过程,对Blend进行快速入门学习. 在开始使用Blend前,首先需要进行Silverlight的开发环境搭建,在银光中国网(SilverlightChina.Net)有篇"轻松建立Silverlight开发环境",其中列出了建立Silverlight开发环境的几个步骤,另外,我在过去发布过一篇"Silverlight开发工具集合&

Expression Blend实例中文教程(9)

在Blend强大的设计功能支持下,设计人员和开发人员可以无代码实现Silverlight/WPF动画效果,例 如上文介绍的 StoryBoard,就是一个典型例子,设计人员和开发人员仅需提供必要元素,即可实现简单 动画.通常来说,在一个项目中会经常出现重复的动画或者相似的动画,如果每次都创建一个新的 StoryBoard,这样显着项目代码十分臃肿,而且有时还会影响项目运行效率.另外在多个项目中都会用到 一个相同的动画效果,如果能把这个动画效果编译成通用类提供调用,也就可以达到事半功倍的效果.为

Silverlight & Blend动画设计系列一:偏移动画(TranslateTransform)

用户界面组件.图像元素和多媒体功能可以让我们的界面生动活泼,除此之外, Silverlight还具备动画功能,它可以让应用程序"动起来".实际上,英文中Animation这 个单词的意思是给某物带来生命.在界面中添加动画效果,给人以印象深刻可视化提示,可 以让用户的注意力集中到我们想让他们关注的地方. 动画主要是通过计时器来完成,在Silverlight中开发动画程序通常是使用微软主推的设 计工具Microsoft Expression Blend,Silverlight 中提供了优秀

silverlight:手写板/涂鸦/墨迹/InkPresenter示例程序

这种应用现在已经比较常见了,比如论坛回贴中的手写功能 ,IM聊天中的个性化手写文字,个性签名等,在Silverlight中要实现该功能其实非常简单,只要一个InkPresenter控件即可 使用要点: 1.要合理设置裁剪区,否则手写时可能笔划会写到你不希望出现的地方.2.处理好MouseLeftButtonDown,MouseMove,LostMouseCapture这三个事件. 演示代码: 前端Xaml部分: by 菩提树下的杨过 http://yjmyzz.cnblogs.com/ <Use

微软Expression Blend基础教程系列

微软Expression Blend基础教程系列 公司准备大力的开展Silverlight方面的产品研发,我为公司的设计师以及动画师制作了一系列的PPT教程.Demo等资料培训,使得设计师能更好的和程序员配合,现将这些资料整理成文,希望对大家在公司内部推广Silverlight有所帮助. 本系列教程基于Microsoft Expression Blend 3中文版进行讲解,不涉及后台编码操作. Blend基础-项目与层次 Blend基础-布局控件 Blend基础-控件与用户控件 Blend基础-