没有合适的资源?快使用搜索试试~ 我知道了~
首页microsoft expression blend WPFf教程
microsoft expression blend WPFf教程

1. 什么是Blend? 要了解Blend是什么 需要先了解的是Microsoft的Silverlight和WPF(Windows Presentation Foundation) 来自维基百科的简单介绍 Microsoft Silverlight WPF 这是一个面向设计师的简单教程 关于技术背景方面就不多说了 简单的说,Blend是微软搞出来让设计师为WPF或Silverlight创建用户界面的一个设计工具 个人认为他的最大优点在于 “设计将可原封不动地用于最后的产品中…开发人员不再需要尝试重建它们…” 这让开发人员和设计师都是那么的欣喜若狂啊! 如果和设计师熟悉的Adobe系列作比较,Blend之于WPF(Silerlight)就如Flash之于Flex
资源详情
资源评论
资源推荐

[原创] Expression Blend 2 教程 1-介绍
技术 | 工具 2009-05-28 19:40:23 阅读 323 评论 2 字号:大中小
本来只想写一篇简短的 Blend 介绍,没想到一写就写了一下午。。希望对初学 Blend 的同
学们有所帮助
前面的工具介绍部分,建议直接跳过,看最后那个实例就好了!很多东西要自己摸索一下
就明白了!
1. 什么是 Blend?
要了解 Blend 是什么 需要先了解的是 Microsoft 的 Silverlight 和 WPF(Windows
Presentation Foundation)
来自维基百科的简单介绍 Microsoft Silverlight WPF
这是一个面向设计师的简单教程 关于技术背景方面就不多说了 简单的说,Blend 是
微软搞出来让设计师为 WPF 或 Silverlight 创建用户界面的一个设计工具
个人认为他的最大优点在于 “设计将可原封不动地用于最后的产品中…开发人员不再需
要尝试重建它们…”
这让开发人员和设计师都是那么的欣喜若狂啊!
如果和设计师熟悉的 Adobe 系列作比较,Blend 之于 WPF(Silerlight)就如 Flash 之于
Flex
2. Blend 可以做什么
制作界面是 Blend 的本职工作,但如此强大的工具在手,只要你像叉蓝一样爱动脑筋,
它能起的作用就不只是这些 :P

Blend 可以很轻松的添加事件、增加响应(当然 Flash 也可以做到,但我认为 Blend 更
加易用轻松,可能是由于我并不那么熟悉 Flash…) 所以当受够了 Axure 的折磨时,我突
然意识到如果用 Blend 就可以做出更高保真的应用原型!不再是简单呆板的页面跳转,不
再需要测试人员按固定的路线操作,Blend 可以制作出保真度非常高的原型。
对于大型产品,前期的可用性测试怎么样得到更多的信息,以便对产品进行改进?条件
允许的话,当然是做保真度更高的原型。而又如何快速开发出高保真原型?我认为 Blend
和 Flash 在这方面,具备了应对这个难题的能力。
3. 了解 Blend 界面结构
“wo~ 好酷的界面” 很多同事从我身后走过时,都会有这个反应…
但我并不喜欢 Blend 的界面:
第一,字体是“糊的”,现在知道,这种平滑字体是 Blend 的“特色”。个人认为这将成为中
文应用程序里的一个很大弊端,设计师无法再使用被广大用户接受的 12 点宋体。雅黑成了
退一步的选择。
第二,或许已经用惯了 Adobe 系列,个人认为这种常用的工具型软件,黑乎乎的颜色太
浓厚了,挺累的

界面结构:
1. 最左侧一列和 Adobe 的一样,是一些设计用的工具,如选取工具、拾色器、填充,详细
的下面介绍
2. 第二列上部分是触发器,可以给各个控件增加响应(比如鼠标移上一个按钮时,按钮有
个什么变化)
这块面积虽然不大,但却是 WPF 的核心呀!所有神奇炫丽的响应效果,都是通过这里添
加事件,再制作动画。
3. 第二列下部分,可以理解为类似图层的概念 制作动画的时候,这里会出现类似 Flash
里的时间轴

4. 白色区域即为画布,右上角有三个标签,可以切换三种视图
Design:既是上面截图中的样子
XAML:转到界面的代码,界面所有内容都是用 XAML 定义的,包括画一段路径,都对
应在 XAML 里面的一条代码。设计师一般不需要看 XAML 视图。
Split:视图分两栏,上方是 design,下方是 XAML。当选中设计视图里的元件时,下面
就自动跳至对应该元件的那段。
这个和 dreamweaver 是一样的呀~
5. 最右侧一栏有三个 Tab 分页,分别是
Project:和项目相关的内容,工程的文件结构(在这里可以导入外部的图片资源)
Properties:当在画布绘制了什么元件时,选中该元件后,这里就会显示和这个元件相
关的属性。属性面板是最为常用的一个面板,如果你不想写 XAML,那么整个界面的布局、
对齐方式、描边等等,都可以再属性面板完成设置。(这个和 Flex 的属性面板的功能基本
一致)
Resources:资源面板用到的不多,里面显示了所有的自定义样式。比如我制作了一个
button,buttonStyle 就成为一个资源,我在应用程序里使用到按钮的地方,都可以使用这
个样式。(这个基本就相当于 Flex 里面 CSS 的 Style,不过 Blend 可以完全自由定义一个
元件的外观。而在 Flex 里,可以改变的 CSS 非常有限,除非用 Flash 制作元件再导入成
资源)
4. 工具面板 常用工具介绍
Selection:和 Adobe 的类似,用来 选中图层(组)。选种一个组(例如
Grid),双击后进入这个组的编辑(这 个和 Flash 是一样的,双击后进入编辑
这个元件的视图)。这个工具没办法选中一个组里面的子内容。

Direct Slection:可以直接选中任和 图层(未锁定),即使它被包含在一个
组里面。可以选中路经里的节点,拖动 节点等
Brush Transform:自由变换渐变色, 控制方向、中心点…这个比 PS 好用多了,
PS 里面要拖动渐变只能无数次的尝试, 达到一个好的效果 这个可以随意变换
渐变,很方便
布局:在界面架构里用到
的各种布局。这块内容有
很大学问,这里就不详细
说明了
个人感觉 Blend 的布局,
比 Flex 里的布局类型更
多、更好用一些,每种布
局的特点很明确,控制起
来很方便。
控件:软件应用里常见的
控件都在这里了 ,如果
没有你想要的东西,点下
面的那个“>>” 可以搜出
更多更复杂的控件。
当你使用这些控件时,控
件的皮肤会直接绑定到系
统的主题。不过你可以自
己定制 Style,再把 Style
应用到具体控件实例上。
剩余21页未读,继续阅读















安全验证
文档复制为VIP权益,开通VIP直接复制

评论1