上一篇主要介紹Expression系列產(chǎn)品，另外概述了Blend的強(qiáng)大功能，本篇將用Blend 3創(chuàng)建一個(gè)新Silverlight項(xiàng)目，通過(guò)創(chuàng)建的過(guò)程，對(duì)Blend進(jìn)行快速入門(mén)學(xué)習(xí)。

在開(kāi)始使用Blend前，首先需要進(jìn)行Silverlight的開(kāi)發(fā)環(huán)境搭建，在銀光中國(guó)網(wǎng)（SilverlightChina.NET）有篇“輕松建立Silverlight開(kāi)發(fā)環(huán)境”，其中列出了建立Silverlight開(kāi)發(fā)環(huán)境的幾個(gè)步驟，另外，我在過(guò)去發(fā)布過(guò)一篇“Silverlight開(kāi)發(fā)工具集合”文章，也列出了Silverlight項(xiàng)目開(kāi)發(fā)必裝工具軟件，這里對(duì)于開(kāi)發(fā)環(huán)境的搭建，我就不再贅述。

Silverlight開(kāi)發(fā)環(huán)境搭建成功后，我們將通過(guò)實(shí)例介紹Blend入門(mén)操作，我使用的Blend是英文版本，我將對(duì)照翻譯成中文。

首先使用Blend按照以下步驟創(chuàng)建一個(gè)新的Silverlight項(xiàng)目，

1. 點(diǎn)擊左上角的“File - New Project”，這時(shí)會(huì)彈出一個(gè)新建項(xiàng)目窗口，如下圖

在上圖可以看到Blend支持創(chuàng)建兩個(gè)類(lèi)型的項(xiàng)目，一個(gè)是Silverlight，另一個(gè)是WPF，本系列主要討論Silverlight，所以，我們選擇“Project Type -Silverlight”，在選中Silverlight類(lèi)型后，在彈出窗口右邊會(huì)出現(xiàn)四個(gè)項(xiàng)目模板，

（1） Silverlight 3 Application + Website 

  該選項(xiàng)是“創(chuàng)建Silverlight 3客戶(hù)端應(yīng)用其中包含Website項(xiàng)目”，選擇該選項(xiàng)后，Blend會(huì)自動(dòng)創(chuàng)建Web項(xiàng)目在同一個(gè)解決方案下，編譯后運(yùn)行，會(huì)在Web項(xiàng)目中產(chǎn)生測(cè)試頁(yè)面，在客戶(hù)端顯示Silverlight客戶(hù)端。

（2） Silverlight 3 Application

  該選項(xiàng)是“創(chuàng)建Silverlight 3客戶(hù)端應(yīng)用”，選擇該選項(xiàng)后，Blend僅創(chuàng)建Silverlight客戶(hù)端，編譯后，自動(dòng)生成一個(gè)測(cè)試頁(yè)面。

（3） Silverlight 3 Control Library

  該選項(xiàng)是“創(chuàng)建Silverlight控件類(lèi)庫(kù)”，選擇該選項(xiàng)后，Blend會(huì)創(chuàng)建Silverlight空白類(lèi)庫(kù)，主要用于創(chuàng)建Silverlight自定義控件。

（4） Silverlight 3 SketchFlow Application  

  該選項(xiàng)是“創(chuàng)建Silverlight 3 SketchFlow應(yīng)用”，選擇該選項(xiàng)后，Blend會(huì)創(chuàng)建Silverlight 3 SketchFlow應(yīng)用。

在項(xiàng)目模板窗口下，是創(chuàng)建項(xiàng)目的名稱(chēng)，項(xiàng)目路徑和項(xiàng)目后臺(tái)語(yǔ)言支持。

本文將創(chuàng)建一個(gè)Silverlight 3 Application + Website + C# 完整項(xiàng)目，方便以后解釋項(xiàng)目細(xì)節(jié)。

創(chuàng)建新項(xiàng)目后，可以在Blend看到當(dāng)前工作去，我將重要的幾個(gè)部分添加了標(biāo)識(shí)，下面詳細(xì)描述各個(gè)部分的作用：

A部分: 是菜單選項(xiàng)；

B部分：是DockPanel菜單，鼠標(biāo)點(diǎn)擊后，會(huì)彈出對(duì)應(yīng)的窗口，例如“對(duì)象和時(shí)間線(xiàn)”或者“項(xiàng)目管理”等；

C部分：是工具面板菜單

D部分：項(xiàng)目面板

上圖可以看出在SilverlightBlendDemo解決方案下，有兩個(gè)項(xiàng)目：

1. SilverlightBlendDemo: 該項(xiàng)目是Silverlight客戶(hù)端項(xiàng)目，主要承載Silverlight客戶(hù)端頁(yè)面和控件；

2. SilverlightBlendDemoSite: 該項(xiàng)目是Silverlight服務(wù)器端項(xiàng)目，主要承載服務(wù)器端代碼，例如WCF Service或者DAL數(shù)據(jù)層代碼；

E部分：文檔切換欄, 該欄目顯示所有打開(kāi)的項(xiàng)目文件，可以自由切換；

F部分：主要工作區(qū)，叫做美工板，所有頁(yè)面和控件設(shè)計(jì)都在該區(qū)域；

G部分：視圖和代碼切換欄，該欄目提供三個(gè)選項(xiàng)，第一個(gè)是視圖選項(xiàng)，第二個(gè)是代碼選項(xiàng)，第三個(gè)是視圖和代碼同時(shí)顯示選項(xiàng)；

H部分：屬性和資源選項(xiàng)欄，從這里可以設(shè)置控件屬性和對(duì)應(yīng)項(xiàng)目資源；

I部分：使用該部分縮放F部分美工板，啟動(dòng)動(dòng)畫(huà)效果，設(shè)置控件對(duì)齊選項(xiàng)以及查看文件注釋內(nèi)容；

以上窗口部件是創(chuàng)建項(xiàng)目后，默認(rèn)顯示的幾個(gè)窗口，另外還有幾個(gè)常見(jiàn)的窗口部件，也介紹一下：

1. 首先介紹一下菜單擴(kuò)展部分，當(dāng)你把鼠標(biāo)選中C部分菜單按鈕，會(huì)彈出擴(kuò)展菜單按鈕，功能如下：

2. 在擴(kuò)展菜單中，最后一項(xiàng)是Silverlight資源工具按鈕 ，點(diǎn)擊選中后，會(huì)彈出以下窗口，其中包含所有控件，樣式集合，行為代碼集合以及動(dòng)畫(huà)效果和媒體文件集合。在設(shè)計(jì)的時(shí)候，如果添加新控件，可以從這個(gè)選項(xiàng)進(jìn)行選擇。

3. Object and Timeline - 對(duì)象和時(shí)間線(xiàn)面板，可以使用該面板對(duì)頁(yè)面控件對(duì)象進(jìn)行分層管理，另外也可以對(duì)當(dāng)前對(duì)象進(jìn)行動(dòng)畫(huà)設(shè)計(jì)，詳細(xì)動(dòng)畫(huà)設(shè)計(jì)，將在下文描述。

4. 屬性設(shè)置面板，在上文H部分，我們介紹了屬性和資源選項(xiàng)框，這里我把屬性框單獨(dú)列出來(lái)，在美工面板創(chuàng)建一個(gè)按鈕控件后，選中該按鈕，在屬性面板中顯示各種屬性，例如背景，筆刷等等，從這個(gè)面板可以不用輸入代碼，直接設(shè)計(jì)控件屬性。

5. 控件模板樣式資源面板。從該面板，選擇設(shè)計(jì)控件樣式。

6. 調(diào)試結(jié)果面板，在該面板顯示調(diào)試錯(cuò)誤信息和輸出信息；

今天寫(xiě)到這里了，下次繼續(xù)寫(xiě)，下面是網(wǎng)友經(jīng)常問(wèn)的幾個(gè)Blend問(wèn)題，我做了統(tǒng)一回答，希望能幫到更多朋友。 

如果您在學(xué)習(xí)中遇到問(wèn)題，請(qǐng)留言或者加入QQ群討論。超級(jí)群 22308706， 100844510 (200人滿(mǎn)）

常見(jiàn)的幾個(gè)問(wèn)題：

為什么Blend中沒(méi)有相對(duì)應(yīng)的Silverlight控件？

答：在Blend中沒(méi)有Silverlight控件，需要確認(rèn)是否安裝Silverlight Tools for Visual Studio 2008 Sp1 和 Silverlight Toolkit控件擴(kuò)展包，在Silverlight Tools中包含了基礎(chǔ)控件包，而Silverlight Toolkit是擴(kuò)展控件。

為什么Blend中沒(méi)有智能提示功能？

答：確認(rèn)Blend的版本，在Blend2.5之前的版本，Blend不支持IntelliSense。

為什么Visual Studio 2008 Sp1沒(méi)有Silverlight項(xiàng)目視圖設(shè)計(jì)界面？

答：從Silverlight 3開(kāi)始，微軟屏蔽了Visual Studio 2008 Sp1的Silverlight項(xiàng)目視圖設(shè)計(jì)功能，推薦使用Blend 3進(jìn)行Silverlight項(xiàng)目視圖設(shè)計(jì)。 在Visual Studio 2010中，重新恢復(fù)了Silverlight項(xiàng)目視圖設(shè)計(jì)功能。

NET技術(shù)：Expression Blend實(shí)例中文教程(2) - 界面快速入門(mén)，轉(zhuǎn)載需保留來(lái)源！

鄭重聲明：本文版權(quán)歸原作者所有，轉(zhuǎn)載文章僅為傳播更多信息之目的，如作者信息標(biāo)記有誤，請(qǐng)第一時(shí)間聯(lián)系我們修改或刪除，多謝。