Silverlight Blend 动画设计与实例
Silverlight几种常用动画的制作(简单实用)
</EventTrigger.Actions>
</EventTrigger>
</Rectangle.Triggers>
</UserControl>
using System;
using System.Collections.Generic;
using System.Linq;
using ;
using System.Windows;
using System.Windows.Controls;
1.嵌入到控件内部的动画(其实是给控件注册Loaded事件并执行动画)
<Rectangle Fill="Red" x:Name="xp" Height="200" Width="200">
Байду номын сангаас <Rectangle.Triggers>
<EventTrigger RoutedEvent="Rectangle.Loaded">
//设置宽度动画
DoubleAnimation dawb1 = new DoubleAnimation();
dawb1.From = 0;
dawb1.To = Application.Current.MainWindow.Width;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
Silverlight入门系列]使用MVVM模式(6):使用Behavior
Behavior把一些常用的行为封装成可重复使用的组件(Component),在理想状况下,Designer(设计师)或domain expert(特定领域的专家,例如财会人员、HR人员、或MIS)甚至可以完全不需要具备程序设计的观念,只需要了解基础的事件(Event)观念,就可以顺利的开发出一套系统,若需要实现特定的功能时,可商请developere为他们开发所需要的Behavior,designer只需要取得这些Behavior并使用即可。
例如,界面设计人员可以使用Expression Blend把一个Behavior拖到一个界面元素上,比如右键点击以后启动一段动画这个行为,这个界面元素就会自动执行,岂不是很清爽!(当然,执行函数还是要编程人员编写),来个例子:界面xaml:1<UserControl2xmlns="/winfx/2006/xaml/presentation"3xmlns:x="/winfx/2006/xaml"4xmlns:d="/expression/blend/2008"5 xmlns:mc="/markup-compatibility/2006"6xmlns:wm="clr-namespace:AsycValidation"7 xmlns:i="/expression/2010/interactivity" xm lns:ei="/expression/2010/interactions" x:Class="A sycValidation.MainPage"8mc:Ignorable="d"9 x:Name="MyUserControl"10 d:DesignHeight="300" d:DesignWidth="400">1112<Grid x:Name="Layout">13<TextBlock Height="32"HorizontalAlignment="Left" Margin="41,53,0,0" x:Name=" textBlock1" Text="Company:"VerticalAlignment="Top" Width="66"/>14<TextBox Height="31"HorizontalAlignment="Left" Margin="120,45,0,0" x:Name="t extBox1" Text="{Binding CompanyName, Mode=TwoWay, NotifyOnValidationError=Tru e}"VerticalAlignment="Top" Width="119"/>15<TextBox Height="30"HorizontalAlignment="Left" Margin="120,104,0,0" x:Name=" textBox2" Text="{Binding CompanyID, Mode=TwoWay, NotifyOnValidationError=True} "VerticalAlignment="Top" Width="119"/>16<Button Content="Button" Height="36"HorizontalAlignment="Left" Margin="120,156,0,0" x:Name="button1"VerticalAlignment="Top" Width="81">17<i:Interaction.Triggers>18<i:EventTrigger EventName="Click">19<ei:CallMethodAction MethodName="button1_Click"TargetObject="{Binding Elemen tName=MyUserControl}"/>20</i:EventTrigger>21<i:EventTrigger>22<ei:CallMethodAction MethodName="button1_loaded"TargetObject="{Binding Eleme ntName=MyUserControl}"/>23</i:EventTrigger>24</i:Interaction.Triggers>25</Button>26</Grid>27</UserControl>界面xaml.cs:1using System;2using System.Collections.Generic;3using System.Linq;4using ;5using System.Windows;6using System.Windows.Controls;7using System.Windows.Documents;8using System.Windows.Input;9using System.Windows.Media;10using System.Windows.Media.Animation;11using System.Windows.Shapes;1213namespace AsycValidation14{15publicpartialclass MainPage : UserControl16 {17public MainPage()18 {19InitializeComponent();2021CompanyModel m1 = new CompanyModel() { CompanyID = 1, CompanyName = "abc" }; 2223companyViewModel = new CompanyViewModel(m1);24this.DataContext = companyViewModel;2526 }2728publicvoid button1_Click()29 {30MessageBox.Show("ok");31 }3233publicvoid button1_loaded()34 {35MessageBox.Show("loaded");3637 }3839public CompanyViewModelcompanyViewModel { get; set; }4041 }42}注意给这个button定义了两个CallMethodAction的behavior:一个是点击事件,一个是加载Loaded事件。
使用 Expression Blend 或 Visual Studio 创建 Silverlight 时钟
演练:使用Expression Blend 或Visual Studio 创建Silverlight 时钟在Silverlight 中,您可以使用可扩展标记语言创建用户界面(UI) 元素。
若要编写XAML,您可以使用可视化设计工具(如Expression Blend),也可以使用Visual Studio。
本演练向您说明如何通过使用Expression Blend 和Visual Studio 在Silverlight 中创建简单的时钟。
下图所示为您将创建的时钟。
如果您使用Expression Blend,则可以在设计器中直观地创建图形。
如果您使用Visual Studio,则可以通过在XAML 中键入内容来创建图形。
在创建了组成时钟外观的图形之后,您就可以添加使时钟工作所需的动画和逻辑。
使用Expression Blend 创建时钟Expression Blend 可以提高创建Silverlight 应用程序的效率,对于设计图形和布局更是如此。
在本节中,您将通过使用Expression Blend 来创建时钟。
该时钟由下图中所示的图形元素组成。
这些图形是通过将简单元素排列在Grid 上创建成的。
包括时钟的表盘、外边缘、斜边和阴影在内的所有圆形图形都是通过Ellipse 元素创建的,而时钟指针是通过Rectangle 元素创建的。
在 Expression Blend 中创建新的 Silverlight 应用程序项目1.启动Expression Blend。
如果显示启动窗体,则单击“关闭”。
2.在“文件”菜单上,单击“新建项目”。
将显示“新建项目”对话框。
3.在“项目类型”窗格中,选择“Silverlight”。
4.在项目列表中,选择“Silverlight 应用程序”。
5.在"名称"框中键入SilverlightClock。
6.在“语言”列表中,选择“Visual Basic”或“Visual C#”。
C-开发WPFSilverlight动画及游戏系列教程1
//创建X轴方向动画
DoubleA nimatio n doubleA ni mati on = new DoubleA nimatio n(
Can vas.GetLeft(rect),
p.X,
new Durati on( TimeSpa n.F romMillisec on ds(500))
开发的FLASH。
转入正题,网上已经有很多关于如何创建WPF/Silverlight动画的教程,但是均为使用Blend工具 制作,或直接写在xaml代码内的动画,这样往往造成很多朋友误以为其实WPF/Silverlight不就是MS
的Flash?诚然,如果您真的像那些教程里说的去开发WPF/Silverlight程序,我个人觉得一点意义都没
</ Window>
这段代码我创建了一个名叫Carrier的Canvas(画布)容器布局控件,并设置它的尺寸为800*600,
背景银色,最后注册一个鼠标在它上面点击的事件。那么为什么要选择Canvas作为容器呢?因为Canvas
可以实现它内部的控件任意的绝对定位,可以很方便的处理物体的移动。
界面容器元素布局好了,那么接下来就动态创建物体对象了:
一条绝对可行的思路,至于如何处理这些复杂的算法,那是仁者见仁,智者见智了,或许您写的算法比
我的更好呢。
多余的话不多说了,最后来句发自肺腑的话吧:本系列教程的书写编辑花费作者很多心血,没有
功劳也有苦劳哇,所以请需要转载的朋友们用突出的字体或颜色标明在您的文章开头,您的大力支持是
鼓励我不断写下去的动力。
//创建Y轴方向动画
doubleA ni mati on = new DoubleA ni mati on(
基于Silverlight的网页动画开发研究
基于Silverlight的网页动画开发研究摘要:Silverlight是微软近年推出的Web前端技术。
讨论了Silverlight 的特点和开发技术,以及XAML语言;在此基础上对基于Silverlight 技术进行网页动画开发进行了分析;重点探讨了基于Silverlight对页面元素进行二维和三维应用变换的方法。
关键词:Silverlight ; XAML;动画;变换1Silverlight概述WPF是微软近年推出的展示层开发框架,Silverlight的前身代号是“WPF/E”,也就是其Everywhere版本。
微软从2007-2010年发布了Silverlight的4个版本。
它作为一个浏览器插件,可以显示矢量图形、动画和视频。
要运行Silverlight就必须安装Microsoft 发布的插件。
Silverlight是一种跨浏览器、跨平台的技术。
它能够在常见的Web 浏览器中运行,包括IE、Firefox、Apple Safari,并可以在Windows 和Apple Mac平台上运行。
Silverlight是类似于Flash的解决方案。
Silverlight和Flash的主要区别是:一个Silverlight程序并不是传递给Flash播放器的一个编译好的二进制文件。
相反,所有的代码都是基于标准的,且图像使用了XAML。
Silverlight最值得关注之处在于,实际上就是它创建出的UI质量,它是真正以XAML格式进行数据传输,到用户前端后再解析为具体图像,文本的大小是非常小的,所以不会占用太多带宽。
Silverlight在安全边界(沙盒)中运行,无法采用与传统的.NET应用程序相同的方式访问文件系统和其它的系统资源。
默认情况下,限制对承载Silverlight插件的HTML页的访问。
2Silverlight技术框架Silverlight平台作为一个整体,由两个主要部分以及一个安装程序和更新组件组成。
silverlight开发实例讲解
silverlight动画设计-飞船打子弹动画设计
shipLocation.X -= shipSpeed.X;//减小距离左边界的距离
break;
case Key.Right:
shipLocation.X += shipSpeed.X;//
break;
case Key.Up:
shipLocation.Y -= shipSpeed.Y;//
break;
一个动画有很多帧组成,在每帧中都可以执行判断或操作
2021/7/13
4
新建项目MyGame
新建文件夹UserControls 把矢量图转换成的xaml文件拷贝入文件夹
UserControls 把xaml文件修改正确的namespace,再包
含到项目中(这两步不能反了,因为只要包 含到项目中就会生成cs文件) 如下格式
Bullet bullet;
private Point bulletLocation = new Point(0, 0);
private Point bulletSpeed = new Point(0, 20);
这里子弹要动态产生,要被多个事件使用
2021/13
13
在按下空白键事件中加代码
case Key.Space:
private void myKeyDown(object sender, KeyEventArgs e)
{
switch (e.Key)
{
case Key.Left:
shipLocation.X -= shipSpeed.X;
break;
case Key.Right:
shipLocation.X += shipSpeed.X;
<RotateTransform x:Name="myRotate" CenterX="48.6" CenterY="32"/>
silverlight之Blend教程
o子对象在其父对象内部
o拥有同一父对象的对象为兄弟关系
就好像俄罗斯娃娃一样,一层一层的嵌套在一起。
一个活生生的例子,族谱
族谱
爷爷
爸爸
你
你的儿子
你的孙子
实际的例子:
具体在Blend中的操作
新建
在左侧的工具栏中双击控件就可将其添加到场景中。这里先添加上几个控件。并且给控件启好名字。
现在能看到在LayoutRoot外侧有一个蓝色的高亮边缘。代表了“将要在哪里添加控件”那个元素选中,新添加的控件就将曾为当前选中的子控件。
现在很多新闻的详情页面都有文字大小的选择。这里就以这个应用为例来进行说明。
先把需要的控件放入舞台。
这里我想用slider控件来控制文本的大小。在这里先设置好slider控件的最大值、最小值、以及最小变化。
选中文本框,对齐文本字体的大小进行绑定。
选择Slider控件的Value值。
F5编译运行效果:
数据的双向绑定
数据的双向绑定就是无论是数据的那一方发送改变另一方也跟着变化。
以上一个例子做基础演示说明。
在新增一个输入文本框控件,将控件的Text属性与Slider控件的value属性绑定。
这里就全新的创建一个模板。
再填出的对话框中为新的模板起好名字。
这里我们就得到了一个空的模板。
在Grid布局控件中可以制作上自己想要的按钮的样子。
编辑好后点击窗口左上角的标签返回舞台查看效果。
可以发现舞台上的按钮发声了变化
在这里,你可以再在舞台上添加其他的按钮,在为其指定模板。
最终的效果如下:
用户控件
简单的编辑一下属性。
到此,搜索框控件就制作完成了。
Silverlight学习之动画
在Silverlight中,动画可以通过添加移动和交互性来增加图形的创建效果。
通过对背景色进行动画处理或应用动画Transform,我们可以创造出生动的屏幕过渡效果或提供有帮助的视觉提示。
●动画简介:动画是快速播放一系列图像(其中每个图像与下一个图像略微不同)给人造成的一种幻觉。
大脑感觉这组图像是一个变化的场景。
在电影中,摄像机每秒钟拍摄许多照片(帧)),便可使人形成这种幻觉。
用投影仪播放这些帧时,观众便可以看电影了。
在Silverlight 中,通过对对象的个别属性应用动画,可以对对象进行动画处理。
例如,若要使UIElement增大,需对其Width和Height属性进行动画处理。
若要使UIElement逐渐从视野中消失,可以对其Opacity 属性进行动画处理。
可以对Silverlight 中许多对象的属性进行动画处理。
注意:在Silverlight中,我们只能对值类型为Double、Color或Point的属性执行简单的动画处理。
此外,还可以使用ObjectAnimationUsingKeyFrames对其他类型的属性进行动画处理,但是这需要使用离散内插(从一个值跳到另一个值),而多数人认为这不是真正的动画。
●使UIElement逐渐进入视野并从视野中逐渐消失:来演示一个示例。
这个例子演示如何使用Silverlight 动画通过对属性值进行动画处理,使Rectangle逐渐进入视野并从视野中逐渐消失。
本示例使用DoubleAnimation(一种生成Double值的动画类型)对Rectangle的Opacity 属性进行动画处理。
因此,Rectangle将逐渐进入视野并逐渐从视野中消失。
示例第一部分在StackPanel中创建一个Rectangle元素。
<StackPanel><Rectangle MouseLeftButtonDown="Mouse_Clicked" x:Name="MyAnimatedRectangle" Width="100" Height="100" Fill="Blue" /></StackPanel>如果要创建动画并将其应用于矩形的Opacity属性,请执行以下操作:∙创建 DoubleAnimation∙创建 Storyboard∙开始 Storyboard 以响应事件1.创建DoubleAnimation由于 Opacity 属性的类型是 Double,因此需要一个生成 Double 值的动画。
在Silverlight中制作路径动画
在Silverlight 中制作路径动画Silverlight 不像WPF 一样能够支持基于路径的动画,想要在Silverlight 中制作路径动画,必须基于关键帧,Silverlight 提供了DoubleAnimation 、PointAnimation 、ColorAnimation 来实现内插关键帧动画,相应地,Silverlight 还提供了DoubleAnimationUsingKeyFrames 、PointAnimationUsingKeyFrames 、ColorAnimationUsingKeyFrames 来进行多个值之间的内插动画处理。
1、简单介绍:DoubleAnimation :在两个Double 值(元素的一维属性,如X、Y 、Angle 、Width 、Length 等)之间做线性内插动画处理;PointAnimation :在两个Point 值(元素的二维属性,如几何图形的Center 等)之间做线性内插动画处理;ColorAnimation :在两个Color (元素的颜色)值之间做线性内插动画处理。
DoubleAnimationUsingKeyFrames :在一组KeyFrame 中所设置的多个Double 值之间做动画处理;PointAnimationUsingKeyFrames :在一组KeyFrame 中所设置的多个Point 值之间做动画处理;ColorAnimationUsingKeyFrames :在一组KeyFrame 中所设置的多个Color 值之间做动画处理。
2、通用属性:TargetName:目标名称TargetProperty:目标属性From :开始值To:结束值Duration :间隔时间3、基本方法:Lin ear :线性内插Discrete :离散内插Spl ine:样条内插这里我们利用DoubleAnimation 来实现路径动画,其基本思路是将DoubleAnimation 中的TargetProperty 指向运动目标的X 和Y 坐标,通过线性地改变坐标值来使之按路径运动。
Silverlight动画设计
AnimationBase
• 在实现时对 <类型> 值进行动画处理的抽象类。只有在想要创建自己的自定义动 类型> 画时,才必须直接处理这些类。
应用和启动动画
若要使用 XAML 启动演示图板,应将其与 EventTrigger 关联。
若要使用代码启动 Storyboard,可以使用Storyboard 类的 Storyboard,可以使用Storyboard Begin 方法。
下面的 XAML 示例演示了小标记在创建作为 UI 一部分的按钮时的必要性。创建的按钮通过主题 样式获得默认的可视化表示形式,通过其类设计 获得默认的行为。
形式与逻辑的分离
WPF 样式设置模型的另一个功能是实现表示形式与逻辑 的分离。这意味着,在开发人员使用 C# 进行逻辑编程时, 设计人员只需使用 XAML 即可设计程序的外观。 绑定到图像列表的 ListBox 控件。 控件。
动画制作过程
找一个对象做动画 创建一个 EventTrigger 创建一个 Storyboard 和一个动画 动画的叠加 动画效果参数调整
动画案例
偏移动画(TranslateTransform) 偏移动画(TranslateTransform) 旋转动画(RotateTransform) 旋转动画(RotateTransform) 缩放动画(ScaleTransform) 缩放动画(ScaleTransform) 倾斜动画(SkewTransform 倾斜动画(SkewTransform) SkewTransform)
AnimationUsingKeyFrames
• 关键帧动画的功能比“From/To/By”动画的功能更强大,因为您可以指定任意多个 关键帧动画的功能比“From/To/By” 目标值,甚至可以控制它们的插值方法。某些类型的内容只能用关键帧动画进行 动画处理。关键帧动画概述中详细描述了关键帧动画。
silverlight 项目案例
"Silverlight 项目案例:深度解析与实践探讨"一、Silverlight 项目案例简介Silverlight 是一个基于 .NET Framework 的应用程序框架,它可以用来开发和部署互联网应用程序。
在本文中,我们将会深入探讨Silverlight 项目案例,以便更好地理解其深度和广度。
二、Silverlight 项目案例的开发过程1. Silverlight 项目案例的背景和需求在进行深入探讨之前,首先来看一下一个典型的 Silverlight 项目案例的背景和需求。
通常,一家企业需要一个在线视频播放器来展示其产品宣传视频,并且希望用户能够在网页上直接观看视频或者下载。
这个需求将会是我们在探讨中不断提及的重要主题。
2. 技术选型与开发架构在开发一个 Silverlight 项目案例时,我们需要考虑的技术选型和开发架构非常重要。
我们可能会选择使用 MVVM 模式来构建 Silverlight应用程序,或者使用 Entity Framework 来管理数据。
3. UI 设计与交互在Silverlight 项目案例中,良好的UI 设计和交互体验是至关重要的。
我们可能会涉及到设计响应式布局、实现动画效果、以及优化用户交互体验的主题。
三、Silverlight 项目案例的实际应用与价值1. 实际应用场景与案例分析通过对实际应用场景的分析,我们可以更直观地理解 Silverlight 项目案例的实际应用价值。
我们可以探讨该在线视频播放器是如何满足企业宣传需求的,以及其在用户体验和功能上的优势。
2. 技术实现与解决方案借助 Silverlight 项目案例,我们可以深入探讨其涉及的技术实现和解决方案。
我们可以分析该在线视频播放器是如何实现视频流的加载和播放的,以及如何处理各种格式的视频文件。
这些内容将会是我们在文章中多次提及的重要主题。
3. 成果展示与用户反馈我们可以共享该 Silverlight 项目案例的成果展示,并对用户反馈进行总结。
第7章 动画放飞创意(理论)
时间线
RepeatBehavior:指定时间线的重复播放行为,可以采用3种不同类型 的值:
hh:mm:ss格式的时间,在指定的时间内重复演示动画,重复的次数不确定 指定值为“Forever”,动画不断重复播放 指定值为带有x的离散重复数,则按照指定数字的次数重复播放。例如,指 定值为5x,则动画重复播放5次
2.2 DoubleAnimation动画 动画
针对Double类型的属性进行动画处理。包括对象的宽、高、透明度等都 属于Double类型的值,都可以使用DoubleAnimation来进行动画处理
<Storyboard BeginTime="0:0:5" FillBehavior="Stop" RepeatBehavior="0:0:30" > <DoubleAnimation Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(Canvas.Left)" Duration="0:0:10" To="400"/> <DoubleAnimation Storyboard.TargetName="ellipse" Storyboard.TargetProperty="(Canvas.Top)" From="200" To="300" Duration="0:0:10" /> </Storyboard>
时间线在事件触发3秒钟后 才开始执行
时间线在事件触发后看到的是 已经执行到2秒钟的动画,后 续只能再演示整个动画剩下的 3秒
4.动画 Silverlight
Blend基础-动画
基础动画
在动画中最简单的就是逐帧动画了,现在常见的gif动画就是逐帧动画。
他是由一系列的序列图片组成再逐一播放的。
在Blend中他提供了一个关键帧动画,你不必去制作、指定每一帧的动画图片,只要设置好关键的几个位置,Blend会自动帮你实现动画效果。
具体做法
把要制作动画的图片放入舞台中。
点击“对象和时间线”面板右侧的“+”新建立一个动画。
在弹出来的对话框中为动画起名字。
这时你会发现“对象和时间线”面板发声了变化。
按键“F6”或者从菜单中进行选择来切换工作区视图。
这样可以把时间线变长,便于操作。
在面板中先选中图片,在点击右侧的“+”,为这个图片创建一个关键帧。
向后移动黄色指针,黄色指针上方的数字是以秒为单位的,代表过去了多少时间。
这里我移动到1秒的位置,并且在1秒位置的时候改变图片的坐标属性。
循环动画,在面板中选中动画。
这时右侧的属性面板会出现这个动画的各种属性,是否循环、循环多少次、自动回放...
点击上方的播放按钮进行预览。
这样一个最基础的位移动画就制作完成了。
扩展
想要做更加的复杂的动画也是一样的,请扩展阅读以下两篇文章。
- 1、下载文档前请自行甄别文档内容的完整性,平台不提供额外的编辑、内容补充、找答案等附加服务。
- 2、"仅部分预览"的文档,不可在线预览部分如存在完整性等问题,可反馈申请退款(可完整预览的文档不适用该条件!)。
- 3、如文档侵犯您的权益,请联系客服反馈,我们会尽快为您处理(人工客服工作时间:9:00-18:30)。
Silverlight & Blend动画设计与实例前言: (2)偏移动画(TranslateTransform) (4)旋转动画(RotateTransform) (7)缩放动画(ScaleTransform) (11)倾斜动画(SkewTransform) (16)故事板(StoryBoards)和动画(Animations) (19)动画技巧(Animation Techniques)之对象与路径转化、波感特效 (29)模糊效果(BlurEffect)与阴影效果 (34)拖放(Drag-Drop)操作与拖放行为 (38)动画(Animation)与视图状态管理 (45)坐标系统(Coordinate System)与向量(Vector)运动 (51)沿路径动画 (54)三角函数(Trigonometry)动画之自由旋转(Free-form rotation) (58)三角函数(Trigonometry)动画之飘落的雪花(Falling Snow) (64)前言:Microsoft Expression Blend作为一款功能齐全的专业设计工具,可用来针对基于 Microsoft Windows 和基于 Microsoft Silverlight 1.0 的应用程序制作精美复杂的用户界面。
Expression Blend 可让设计人员集中精力从事创作,而让开发人员集中精力从事编程工作。
Expression Blend 的工作原理在 Expression Blend 中,您可以在美工板上绘制形状、路径和控件,然后修改其外观和行为,从而直观地设计应用程序。
您可以导入图像、视频和声音。
在基于 Windows 的应用程序中,还可以导入和更改三维对象。
您可以创建用于动态显示设计的可视元素或音频元素的 Storyboard,并可以选择在用户与应用程序进行交互时触发这些 Storyboard。
在处理基于 Windows 的应用程序时,您可以重新设计已应用于基本控件的模板,使应用程序具有独特的外观和行为。
在处理应用程序时,您可以随时使用编程人员正在处理的代码隐藏文件或自定义控件文件来更新您的项目。
与 Expression Blend 结合使用的其他工具您可以将 Microsoft Expression Design 2 生成的图形和可扩展应用程序标记语言 (XAML) 资源导入到 Expression Blend 2 项目中。
您还可以导入在 Microsoft Expression Encoder 2 中创建的 Silverlight 1.0 媒体项目,以将新的功能或可视元素添加到项目中,或者修改可在Expression Encoder 2 中重用的媒体播放器模板。
您可以将 Silverlight 1.0 导入到 Microsoft Expression Web 2 项目中,以添加更多 Web 内容或发布站点。
Microsoft Visual Studio 2008 可以与 Expression Blend 2 完美地结合使用,以在您指定要侦听的事件时自动更新项目中的代码隐藏文件。
从 Expression Blend 2 的“项目”面板中,可以打开各个代码隐藏文件或整个项目。
还可以使用 Visual Studio 2008 的部署工具来部署您的应用程序。
Expression Blend 生成的内容Expression Blend 将生成 Windows Presentation Foundation 应用程序,这意味着,所显示的设计方案是由 XAML 来表示的。
正如 HTML 是Web 应用程序标记语言一样,XAML 是 Windows Presentation Foundation (WPF) 的标记语言。
有关 XAML 和 WPF 的详细信息,请参阅 XAML 编辑和学习资源和社区资源。
Expression Blend 附带的功能Expression Blend 2 包括以下功能:全套矢量绘图工具,包括文本工具和三维 (3D) 工具;易于使用且新颖的可视界面,带有可停靠的面板和面向对象的上下文菜单;实时动画;三维和媒体支持,可增强用户体验;先进、灵活且可重用的自定义和外观选项,适用于各种常用控件;强大的数据源和外部资源集成点;实时的设计和标记视图;从 Expression Design 2 导入作品的功能;从 Expression Encoder 2 导入站点的功能;可以与 Visual Studio 2008 交互使用,从而帮助设计人员和开发人员更紧密、更有效地进行团队协作。
目标应用程序类型Expression Blend 2 已经过优化,可以生成以下类型的应用程序:生产类应用程序有助于提高广大客户的生产力及效率的应用程序以及行业应用程序,如 Microsoft Office。
消费类应用程序媒体播放器、安全工具和桌面小工具等应用程序。
游戏简单的娱乐性桌面或联机游戏。
信息查询终端在信息查询终端上运行的应用程序,用户可与其交互以获取信息、查看产品目录、在机场办理登机手续等。
IT 专业工具专门针对特定的公司或客户需要执行小型作业的工具(如错误跟踪工具)。
最佳实践有些设计创意非常好,因为它们能够提高易用性。
下面是一些借助Expression Blend 2 和 Microsoft .NET Framework 3.5 提高易用性的常用方法:按照现实世界建模:可以使用自定义的可视效果和交互功能,使特定控件的外观和行为均与其现实世界的对应物类似。
如果用户熟悉现实世界的对象并且现实世界的方法是完成该任务的最佳、最有效方法,这种技术就是最佳选择。
例如,简单的工具(如计算器)按照现实世界的对应物进行建模就很有效。
展示而不是解释:可以使用动画和过渡来展示关系、原因和效果。
此技术最适用于提供需要通过额外的文字来解释内容以免用户误解的信息。
例如,幼儿书籍可以动态显示翻页,以展示控件的工作方式。
提高功能可见性:功能可见性是指对象直观表明其使用方式的特性(而不是使用标签来解释)。
可以使用自定义控件的可视效果和动画功能,直观表明如何使用非标准的控件。
使用自然对应:自然对应是用户要完成的任务与完成任务的方法之间的一种清晰联系。
在标准的常用控件不能提供自然对应时,可以使用自定义外观和交互功能来建立自然对应。
降低知识门槛:可以使用自定义交互功能,限制执行某项操作的方式并降低执行某项任务所需的知识门槛。
改进反馈:可以使用自定义控件的可视效果和动画功能来提供反馈,以显示用户的操作是否正确或者显示操作进度。
例如,Windows Vista 的Internet Explorer 中的地址栏会在背景中显示加载页面的进度。
使对象更容易交互: 称为费茨法则的人类动作模型指出,单击目标所需的努力与目标的距离成正比,而与目标的大小成反比。
例如,可以使用动画使得指针在靠近对象时变大,而在远离对象时变小。
这样做,就更容易单击对象。
此外,还可使对象变小,从而更有效地利用屏幕空间。
聚焦:可以使用丰富的布局和自定义可视效果,突出显示任务必需的屏幕元素,或者淡化次要元素。
Expression Blend 3 Plus SketchFlow:设计与构建桌面和Web程序的视觉化工具。
现已有RC候选版可下载。
偏移动画(TranslateTransform)用户界面组件、图像元素和多媒体功能可以让我们的界面生动活泼,除此之外,Silverlight还具备动画功能,它可以让应用程序“动起来”。
实际上,英文中Animation这个单词的意思是给某物带来生命。
在界面中添加动画效果,给人以印象深刻可视化提示,可以让用户的注意力集中到我们想让他们关注的地方。
动画主要是通过计时器来完成,在Silverlight中开发动画程序通常是使用微软主推的设计工具Microsoft Expression Blend,Silverlight 中提供了优秀的动画系统,我们可以通过Microsoft Expression Blend 快速的完成动画元素的设计制作,然后通过Visual Studio 作为编码环境进行后面的管理动画定时器和刷新用户界面的工作。
当使用Microsoft Expression Blend 时,可以用拖拽的方式在时间线中进行动画的定义,这样可以很容易快速定义负责的动画,因为 Microsoft Expression Blend 将自动生成对应的XAML代码。
Silverlight中的偏移动画和Flash中的补间动画基本一样,其实很好理解,也就是一个动画元素(组件)从一个位置移动到另一个位置,这个过着中有三个关键点:动画起点、动画终点和动画时间。
这三点可以理解为一个动画元素从始点坐标向终点坐标偏移的缓冲时间是多少。
当我们定义好了动画元素后,可以直接通过Blend中的对象和时间线面板来为动画元素添加动画容器时间线(Storyboard),如下图所示:当动画容器时间线创建好后,只需要选中需要进行创建动画的元素,然后再属性面板下进行可视化属性设置就可以完成动画的创建,如下图示为创建元素darkMoon的偏移动画。
通过上面的一系列操作设置后切换到XAML视图,可以发现在XAML编码文件里Blend自动生成了如下代码片段,其作用就是为名为“darkMoon”的动画元素创建两个方向(X,Y)的偏移动画。
<Storyboard x:Name="Storyboard1"><DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="darkMoon"Storyboard.TargetProperty="(UIElement.RenderTransform). (TransformGroup.Children)[3].(TranslateTransform.X)"><EasingDoubleKeyFrame KeyTime="00:00:01"Value="280"/></DoubleAnimationUsingKeyFrames><DoubleAnimationUsingKeyFrames BeginTime="00:00:00" Storyboard.TargetName="darkMoon"Storyboard.TargetProperty="(UIElement.RenderTransform). (TransformGroup.Children)[3].(TranslateTransform.Y)"><EasingDoubleKeyFrame KeyTime="00:00:01"Value="-245"/></DoubleAnimationUsingKeyFrames>< /Storyboard>上图为动画执行过程截图,在某些情况下要实现一些动画效果是不能预先确定的,这就需要在程序编码中去动态的创建动画效果。