数字媒体系统开发中基于WPF的行为的应用
2020-09-15霍晓钢
摘要:为了培养数字媒体专业的学生把专业知识技能与计算机应用程序设计结合,在教学过程中引入了WPF程序设计。通过美工板上绘制形状、路径和控件,然后设置其属性、动画和行为等,使学生轻松地设计出自己的应用程序,有效地训练没有编程知识的媒体专业的学生完成应用程序的制作。文章试图以介绍WPF行为的应用,来展示不用编程完成应用程序的设计与制作过程,达到学习WPF抛砖引玉的作用。
关键词:WPF;行为;数字媒体;编程
中图分类号:TP319 文献标识码:A 文章编号:1006-8228(2020)08-61 -04
0 引言
在计算机数字媒体专业,学生在大一及大二时,重点学习平面设计、视频制作、动画设计等课程,但没有开设专门的计算机程序设计课程,导致数字媒体专业的学生没法利用所学的知识与技能开发出自己的应用程序,如此便失去了计算机数字媒体专业的计算机专业的特色。如何把所学的平面设计、视频制作、动画设计等合成一个有实用价值的应用程序系统是当前计算机数字媒体专业的一个急待解决的问题。
WPF(Windows Presentation Foundation,直译为:窗口展示平台)是微软新一代矢量图形系统,用于为不同用户界面提供统一的显示系统,使程序人员与美工人员明确分工,美工人员可以使用ExpressionStudio中套装工具可视化的设计界面,程序人员仅负责数据处理,不再需要自己设计页面。WPF有着灵活、易扩展的动画机制,接口设计非常直观,使开发工具能可视化编辑[5]。这样的设计刚好符合计算機数字媒体专业的定位与需求,学生们可以在完全没有编程基础的条件下设计出高质量的图形/图像界面,为今后更广的就业打下基础。
在这个“看脸”的时代,为提高界面设计效率与美观,微软开发了Expression Studio套装工具可视化的设计界面中的Expression Blend,自Visual Studi02013以后全部集成安装在开发系统中。所写的目标代码适用于微软支持的所有平台,制作精美复杂的UI(用户界面设计)再也无需编写大量的程序代码。
在Expression Blend中,通过美工板上绘制形状、路径和控件,再修改其外观、动画和行为,能够直观地设计应用程序。也可以通过导入图像、视频和声音,只需修改其属性就可以对项目对象进行有效地控件,大大方便没有程序设计基础地制作人员。在近几年的数字媒体专业教学过程中,利用这一软件大大提高了学生开发基于windows平台的数字媒体系统的效率。本文通过介绍Expressionblend中行为的应用,展示不用编写程序代码或较少地编写程序代码,对数字媒体控制的方法。
1 Blend行为的设置
1.1 Blend工作区界面布局简介
Microsoft Expression Blend中的工作区包含所有可视界面元素。这些元素包括美工板、面板、“工具”面板、工作区配置、创作视图和菜单[2],如图1所示。
1.2 Expression Blend内置行为
Expression Blend中的行为是一些可重用的封装代码段,将这些代码段拖动到控件对象上后,仅通过更改其行为属性进行微调,不需要编写任何代码[4],就可向应用程序添加交互、动画等功能,设计出所需的应用程序响应的方式[6]。在Expression Blend中内置的行为有十几个,这里例举几个常见的内置行为,见表1。
1.3 添加控件对象的行为
在Expression Blend中,添加应用程序的交互性,只需从“资产”面板中将行为拖到应用程序中的控件对象上,并设置该行为的属性调整即可完成。
例如,想要用一个按钮( Button)对象来控制动画( Storyboard)对象的播放、暂停、停止等,就可以将“控制故事面板( ControIStoryboardAction)”行为拖到按钮Button对象上,然后,在属性面板中选择播放(Play)、暂停( Pause)、停止(Stop)(如图2所示)。
在“控制故事面板( ControIStoryboardAction)”行为可设置下列属性。
(1)源名称( SourceName)属性
设置控制动画播放的对象。如果将行为拖到Button对象上,可以将SourceName属性设置为Button对象的名称,默认情况下,SourceName被设置为父对象(行为施加的对象)。
(2)事件名称(EventName)属性
此属性设置触发行为的事件名称。本例中,Button对象的将按钮按下(Click)事件来触发行为的操作。
(3)控制面板选项( ControIStoryboardOption)属性
设置行为触发的故事面板动画( Storyboard)的操作,包括播放( Play)、暂停(Pause)、停止(Stop)。
(4)故事面板(StoWBoard)属性
设置单击按钮时播放的故事面板的对象的名称。
以下通过实例进一步说明在Expression Blend中行为的实际应用。
2 行为应用实例
2.1 音频视频的控制 一般来说,制作一个音视频控制软件需要编写很多代码来控制控件,下面的实例并不需要编写代码,就能完成对音视频元素的控制[1]。即:当点击“播放”按钮,音视频播放;按下“暂停”音视频暂停播放等。制作过程如下。
(1)直接从文件窗口中拖入一个音视频文件作为故事面板动画播放或加入一个故事面板动画,并加入四个按钮控件,分别为播放(btnplay)、暂停(btnpause)、继续(btnresume)、停止(btnstop),如图3所示。
(2)从“资产”一“行为”中找到“ControIStoryboar-dAction”行为拖入到按钮btnplay(播放)下方(如图4)。
(3)设置ControIStoryboardAction行为属性如图。
①触发器属性
TriggerType:事件触发(ExentTrigger)
SouceObject:播放按钮(btnplay)
EventName:事件名称(Click)
②公共属性
ControIStoryboardOption:控件故事面板选项(Play)
Storyboard:故事面板动画名称(如图5)。
(4)剩下的三个按钮:暂停(btnpause)、继续(btn-resume)、停止(btnstop),用同样的方法加入Control-StoryboardAction行为修改其ControIStoryboardOption(控件故事面板选项)属性设置成:Pause、Resume和Stop。然后运行调试。按下播放按钮开始播放影片,按其他按钮可以控制音视频的播放(如图6所示)。
2.2 图片大小的控制
在数字媒体展示时,能够使用户自己改变图片的大小来适应于自我观看的设计也需要大量的技巧与程序代码[3],但下面利用行为,也是连一行代码不需要编写就能完成这一设计任务。
如图7所示,当点击“图片放大”按钮时,图片逐步放大;当点击“图片缩小”时,图片逐渐缩小。制作过程如下:
(1)在窗口中加入如图8所示放置所需控件。
①一个Image控件,命名为:img01,宽、高都设置为200。
②二个按钮控件,分别命名为:btnfangda(图片放大)和btnsuoxiao(图片缩小)。
(2)在控件img01下加入三个ChangePropertyAction分别命名为:加边距、加宽、加高,然后分别设置其属性。
(3)“加边距”属性设置如图9所示。
①触发器类型( TriggerType)为:EvertTrigger,源对象( SourceObject)选择为按钮控件btnfagda,事件名称( Click);
②公共属性中:目标对象( TargetObject)为图像文件img01,选择增量(Increment)为可用,属性名称(PropertyName)选择Margin(白边),并把向右(→)、向下(↓)的值分别设置为5。
加宽、加高的行为除属性名称( PropertyName)选择为Withen(宽),值设置为5、Height(高)值设置为5外,其余与“加边距”行为的属性相同。
图片缩小的方法与前面放大图片的方法一致,只是把参数值由5改为-5。
运行程序,当点击按钮“图片放大”时,图片img01就会以5pt的增量放大。
3 结束语
通过几年的教学实践,在数字媒体专业采用WPF教授《数字媒体技术的案例开发》课程取得了较好的效果。在教学过程中,我们以Microsoft ExpressionBlend4为设计平台,从矢量图形设计、动画设计、控件控制和简单编程等方面着手,训练没有程序设计编程基础的数字媒体专业的学生开发出Windows下有一定价值的应用程序。其中,利用WPF行为仅为控件控制应用的一个项目。本文是说明非专业程序设计人员不写代码或少写代码来实现自己编写应用程序的一种方法,与有同样想法与经验的同仁相互交流。
参考文献(References):
[1]张洪定,郭早早.WPF和Silverlight教程[M].南开大学出版社,2012.
[2]张洪定,孟冬梅主编.基于Expression Blend 4中文版WPF和Silverlight项目设计基础[M].清华大学出版社,2011.
[3]张洪定i编.WPF和Silverlight项目设计实例[M].清华大学出版社.2012.
[4]微软.Microsoft Expression Blend4行为的使用[DB/CD],2017.10.
[5]百度百科.Microsoft Expression Blend詞拳[DB/CD].百度,1996.
[6]微软.Microsoft Expression Blend4帮助[DB/CD],2017.10.
作者简介:霍晓钢(1963-),男,陕西西安人,工程硕士,副教授,主要研究方向:数字媒体制作与数据库。