1、1Blend 经典入门教程1 开篇 随着计算机软件开发分工细节化，微软对已有的产品线进行了调整，在保持原有经典开发工具 Visual Studio 基础上，又推出了一套新的设计开发工具系列，Expression Studio。 Expression Studio 设计工具系列包含四项主要产品： ? Expression Blend Expression Blend（下称 Blend） ，是一款用于设计桌面和 Web 应用用户界面的可视化工具。用户可以通过拖拉控件方式创建用户交互界面；另外 Blend 中，包含一款软件原型建模工具 SketchFlow， 该工具允许用户快速开发出专业的项目原型，
2、创建设计原型后，以丰富的界面效果展示给客户，该工具将在后文详细讲述。 ? Expression Design Expression Design（下称 Design） ，是一款专业2的图形图像设计编辑工具，主要是为项目美工设计人员准备，如果你对 Photoshop，Fireworks 或者 Illustrator 熟悉，可以把 Design 看做同类产品，其中使用原理大部分都是相同的，而 Design 的优势是可以和Blend 完美无缝结合，创建图形后，可以直接转换成为XAML，供 Blend 调用，由于本系列教程是讲述 Blend，这里就不再对 Design 过多描述，在后文用到时，我们将详
3、细讲述。 ? Expression Encoder Expression Encoder（下称 Encoder）是一款专业的视频编辑工具，开发人员可以使用该工具编辑视频项目，并发布到 Web 服务器，Silverlight 项目可以在应用中进行高质量播放调用。 由于本系列教程是讲述 Blend，这里就不再对 Encoder 过多描述，在后文用到时，我们将详细讲述。 ? Expression Web Expression Web（下称 Web） ，是一款专业的Web 页面设计工具。如果您对 Dreamweaver 熟悉，可以把 Web 看做同类产品。Web 允许开发人员通过即见即所得的模式，设计
4、和开发符合 Web 标准的网站。由于本系列教程是讲述 Blend，这里就不再对 Web 过多描述，在后文用到时，我们将详细讲述。 3既然本系列文章讲述 Blend，我想我们应该多了解一些Blend 方面的知识。我们一直在说 Blend 强大，具体它强大在哪里呢？ 首先作为交互性设计工具，Blend 解决了传统开发中开发人员和设计人员配合不容易协调的瓶颈。无论是桌面应用还是 Web 应用，越来越注重用户体验性，而程序代码设计和美工设计也逐渐被细分化，而两者在项目中的配合是至关重要的，相信有不少开发人员都有过相同的经历和感触，程序开发人员和美工设计人员一遍又一遍的修改框架希望能够达到完美匹配。Bl
5、end 正是针对该问题推出了一系列的解决方案，例如，在 Blend 中编辑 Silverlight 或 WPF项目 UI 代码的同时，也会直接绑定到 Visual Studio 中，实现双向修改代码功能； 在 Blend 中，可以快速导入PhotoShop 图形和 Illustrator 矢量图，方便项目 UI 设计。 其次，Blend 是一款通用的设计工具，支持设计跨平台跨浏览器的 Silverlight 和 WPF 应用项目，为了简化设计人员的工作量，Blend 支持一个简单的可重复利用的元素叫做行为（Behaviors） ，设计人员可以直接应用不同的行为到项目中，无需编写任何代码，例如，
6、可以直接应用拖拉行为到项目，让项目支持拖拽控件。 在微软 Expression 官方网站，有大量的行为（Behaviors）代码下载，免费使用。 最后是快捷方便的设计方式，以及软件项目原型设计工4具 SketchFlow。 在 Silverlight中, VisualStateManager 的编辑是很复杂的，如果仅靠Visual Studio 进行代码编辑，是非常浪费时间和精力的事情，如果使用 Blend 进行编辑，会大大的提高效率。 另外，使用 Blend 进行控件的样式和模板设计也是非常方便的，我们将在后文详细描述。 值得一提的是 SketchFlow，该项目是现在为数不多的优秀建模工具
7、之一。使用该工具，开发人员可以快速的建立项目原型，以 Silverlight 的方式展示给客户或者项目团队成员，我们将在后文详细描述。 通过以上的描述，我们可以清楚明白，从事 Silverlight和 WPF 项目开发，Blend 是必不可少的设计工具，学会了Blend 会在开发过程中达到事半功倍的效果。 也正式以上的原因，才会有了本系列文章教程，本系列教程旨在为了让更多的开发人员了解和学习 Expression Blend 的使用，希望能够让更多的开发人员加入到 Silverlight 和 WPF 开发行列。 2 界面快速入门 上一篇主要介绍 Expression 系列产品，另外概述了Ble
8、nd 的强大功能，本篇将用 Blend 3 创建一个新Silverlight 项目，通过创建的过程，对 Blend 进行快速入门学习。 5在开始使用 Blend 前，首先需要进行 Silverlight 的开发环境搭建，在银光中国网（SilverlightChina.Net）有篇“轻松建立 Silverlight 开发环境 ”，其中列出了建立 Silverlight 开发环境的几个步骤，另外，我在过去发布过一篇“Silverlight开发工具集合”文章，也列出了 Silverlight 项目开发必装工具软件，这里对于开发环境的搭建，我就不再赘述。 Silverlight 开发环境搭建成功后，我
9、们将通过实例介绍Blend 入门操作，我使用的 Blend 是英文版本，我将对照翻译成中文。 首先使用 Blend 按照以下步骤创建一个新的 Silverlight 项目， 1. 点击左上角的“File - New Project”，这时会弹出一个新建项目窗口，如下图 在上图可以看到 Blend 支持创建两个类型的项目，一个是 Silverlight，另一个是 WPF，本系列主要讨论Silverlight，所以，我们选择 “Project Type -Silverlight”，在选中 Silverlight 类型后，在弹出窗口右边会出现四个项目模板， （1） Silverlight 3 App
10、lication + Website 该选项是“创建 Silverlight 3 客户端应用其中包含6Website 项目 ”，选择该选项后， Blend 会自动创建 Web 项目在同一个解决方案下，编译后运行，会在 Web 项目中产生测试页面，在客户端显示 Silverlight 客户端。 （2） Silverlight 3 Application 该选项是“创建 Silverlight 3 客户端应用”，选择该选项后，Blend 仅创建 Silverlight 客户端，编译后，自动生成一个测试页面。 （3） Silverlight 3 Control Library 该选项是“创建 Sil
11、verlight 控件类库”，选择该选项后，Blend 会创建 Silverlight 空白类库，主要用于创建Silverlight 自定义控件。 （4） Silverlight 3 SketchFlow Application 该选项是“创建 Silverlight 3 SketchFlow 应用”，选择该选项后，Blend 会创建 Silverlight 3 SketchFlow 应用。 在项目模板窗口下，是创建项目的名称，项目路径和项目后台语言支持。 本文将创建一个 Silverlight 3 Application + Website + C# 完整项目，方便以后解释项目细节。 创建新项目后，可以在 Blend 看到当前工作去，我将重要的几个部分添加了标识，下面详细描述各个部分的作用：7A 部分: 是菜单选项； B 部分：是 DockPanel 菜单，鼠标点击后，会弹出对应的窗口，例如“对象和时间线”或者“项目管理”等； C 部分：是工具面板菜单 D 部分：项目面板 百度搜索“就爱阅读”,专业资料、生活学习,尽在就爱阅读网 ,您的在线图书馆!
