20个常用Expression Blend设计开发技巧

微软Expression Blend是一款优秀的用户界面设计工具，该工具可被用于Silverlight，WPF和Windows Phone 7应用UI设计，其内置SDK类库包含大量代码帮助设计人员无需输入任何后台代码实现动态交互效果。如果您对Expression Blend还不熟悉，推荐阅读以下几本专业教程书籍：

Microsoft Expression Blend 4 Unleashed

Microsoft Expression Blend 4 Step by Step

Pro Expression Blend 4

另外推荐阅读以下Expression Blend中文教程：

Expression Blend知识锦分享

Expression Blend实例中文教程系列

本文将汇总介绍20个常用Expression Blend设计开发技巧，希望能够帮助大家提高设计和开发效率。

技巧1：所有属性窗口可被隐藏或显示在设计界面

在实际项目设计中，设计人员可以随时关闭或者隐藏各个属性窗口，或者使属性窗口浮动显示在设计界面，这样可以为主设计界面提供更大的视图以及代码设计空间。

技巧2： "Resource“属性窗口 - 快捷访问和修改模板样式

Silverlight项目模板样式以及资源信息都保存在Styles.xaml文件中，该文件不支持视图模式，只能通过代码模式进行修改。而在Blend设计平台，可以通过”Resource“资源属性窗口访问和修改模板样式或者资源信息，不需要阅读大量的Xaml代码，提高开发效率。

技巧3：控件内部导航栏的使用

Expression Blend允许开发人员使用视图模式编辑修改Silverlight/WPF/Windows Phone控件模板以及样式，修改时Blend提供控件内部导航栏，设计人员可以轻松的跳转到控件内部各个部件中，或者跳回到父控件或者其他控件模板。

技巧4：笔刷工具栏和渐变效果工具栏

笔刷和渐变效果工具栏，允许设计人员在视图模式下轻松添加和修改页面以及控件样式效果。

技巧5：行为 - Behaviors

为了方便设计人员，Expression Blend提供一个”Behaviors“行为功能，无需设计人员编写动态代码即可实现动态交互效果。

更多Behaviors行为中文教程，请访问。

技巧 6： F6快捷键实现页面设计视图和动画设计视图工作台切换

根据个人经验而言，F6快捷键非常实用，特别是在动画效果较多的页面设计时，会被频繁使用。

技巧 7：手性拖动工具实现视图拖动效果

使用手性拖动工具，在设计视图界面，点击某控件或者页面按住不放进行拖动布局摆放操作，使界面设计方便快捷。

技巧 8：双击手性拖动工具，设计视图窗口将自动将所选对象放置在窗口中心处

技巧 9：项目资源快速搜索

在工具栏中Assets中，提供快速搜索功能，设计人员可以快速定位项目控件，样式，行为等资源。

技巧 10： ALT功能键允许重定位对象到布局控件

在页面中编辑控件位置时，选中需要拖动的控件对象，按着”ALT“功能键进行拖动，可以将控件对象移动到布局控件内部。

技巧 11：事件属性窗口的使用

Expression Blend提供事件属性窗口，方便设计人员为控件添加事件响应方法。在添加事件的过程中，设计人员仅需为事件命名，双击创建后，Blend会自动创建后台事件代码。

技巧 12：布局以及容器控件锁定

Expression Blend中，布局控件或者具有容器功能的控件提供激活锁定功能（Pin Active Container），在激活锁定时，在设计页面创建任何控件都会自动分配到该布局或者容器控件中。例如：

鼠标右键点击布局控件，选中”Pin Active Container“

选中后，会看到该布局控件在属性列表中被黄色框选中，

而在视图设计页面，该布局控件同时被黄色框选中，表示当前控件被激活锁定，

这时可以尝试添加控件，会发现，添加任何控件都会自动被分配到当前激活锁定的布局控件中。

技巧 13：取色器工具扩展

在项目美工设计中，取色器的用处非常广泛， Expression Blend针对设计人员的需求，对传统取色器功能进行扩展，不仅仅允许提取设计工具内部颜色，同时允许提取应用外部颜色。例如，如果设计人员同时打开两个设计工具窗口，一个是Blend，另外一个是PhotoShop，设计人员可以轻松的使用Blend提取PhotoShop中设计效果的颜色值。

技巧 14：布局控件类型快速切换

设计人员可以通过鼠标快速切换布局控件类型，不需要手工修改源代码。

技巧 15：快速清除布局控件

使用”Ungroup“功能，清除当前布局控件，其中子元素不会被清除，子元素会作为独立控件保存在页面。

技巧 16：为对象自动创建Grid布局快捷键 - Ctrl+G

Expression Blend提供一种快捷的方式创建布局控件同时自动修正其子元素的位置。使用Ctrl + G快捷键Blend将创建一个Grid控件，然后Blend将自动放置选中的一个或者多个子元素到Grid布局控件，并且自动设置边距。

技巧 17: 转换元素到控件功能

在实际项目中，设计人员需要将不同的元素对象转换成控件，使项目更加个性化，例如，设计人员在PhotoShop中设计一个图形按钮，导入Blend中，希望能够作为按钮控件使用，则可以使用”元素转换到控件“的功能实现这个需求。

在”Make Into Control..“后，会列出当前允许被转换生成的控件列表，选中后，Blend将自动生成代码，并且完成元素到控件的转换。

对于项目美工而言，这个功能非常实用和重要。更详细的学习，请看Blend中文教程。

技巧 18: 演示数据源的自动生成

Expression Blend为了方便设计人员对项目进行测试，提供自动创建演示数据源功能，该功能在项目设计时很常用。