第2章

開發準備

2.1 軟硬件開發環境及需求

2.2 開發環境和工具（Windows 7&Windows PhoneDeveloper Tools）

2.3 設計方法

2.4 Windows Phone7應用程序控件

Windows Phone手機操作系統提供了面向移動互聯網終端的全面解決方案。Windows Phone軟件開發工具包是針對該操作系統設計的套件，包括應用開發API、模擬器、開發工具、設計工具、文檔等。

2.1 軟硬件開發環境及需求

2.1.1 操作系統要求

進行Windows Phone7應用程序的開發需要滿足以下軟硬件要求：

（1）PC操作系統：Windows 7或者Windows Vista SP2以上（Starter Edition版本除外）。

（2）計算機操作系統盤有3GB以上的磁盤空間。

（3）建議計算機系統內存空間至少達到2GB。

（4）具備DirectX 10兼容的顯示卡。

需要安裝DirectX 10兼容的顯示卡以支持Windows Phone的GPU硬件加速模擬。Windows Phone7的模擬器自身使用虛擬機技術，所以不建議將模擬器運行在其他虛擬機上。

2.1.2 工具集合

Windows PhoneDeveloper Tools所包含的工具集合如下：

（1）Visual Studio 2010 Express forWindows Phone

（2）NA Game Studio 4.0

（3）Microsoft Expression Blend forWindows Phone

（4）Silverlight forWindows Phone

（5）Windows PhoneEmulator

Visual Studio 2010 Express forWindows Phone是Windows Phone7的集成開發環境 （IDE）。它包含了對.NET語言如C#和XAML的代碼編輯功能，開發界面與傳統的VS界面相同，可以在該環境中實現設計手機應用程序界面，編譯程序，模擬應用程序，調試，部署應用程序到手機等。微軟為開發者與用戶提供了免費的Express版本供開發者使用。

Windows PhoneEmulator是手機的開發模擬器。開發者可以在沒有實機的情況下開發調試Windows Phone7應用，請注意模擬的功能也是有局限的，如表2.1所示。

表2.1 當前版本模擬器的功能

當然模擬器的功能也在不斷增強，已經有明確的消息稱微軟會在Mango版本的開發包中增加更多的可模擬功能供開發者使用。

之前我們已經談過Windows Phone有兩套框架，分別是Silverlight forWindows Phone和XNA Game Studio 4.0。開發人員可以自由地選擇Silverlight或者XNA來開發，一般情況下使用Silverlight來開發應用程序，使用XNA來開發游戲（當然也可以協同開發，或者拿Silverlight來寫游戲）。前面介紹的Visual Studio 2010 Express forWindows Phone只是一個IDE，是一個程序編輯與編譯工具，與語言和平臺無關，結合Silverlight forWindows Phone和XNA Game Studio 4.0 才能使用Visual Studio 2010 Express forWindows Phone開發應用。另外這兩個框架中還包含了Template、內置類庫等其他組件。

Microsoft Expression Blend forWindows Phone是XAML UI設計工具，使用Expression Blend可以彌補和改善Visual Studio 2010 Express所缺乏的UI設計功能，比如動畫等。把Visual Studio 2010 Express與Expression Blend結合起來會使得工作更加高效。

2.2 開發環境和工具（Windows 7&Windows PhoneDeveloper Tools）

搭建Windows Phone7的開發環境，首先需要到http：//create.msdn.com/en-US/ 下載最新的Windows Phone7開發工具。

下面將以step by step的模式介紹如何從零開始搭建Window Phone7開發環境，并創建一個簡單的Windows Phone7程序。Windows Phone7開發環境只支持Windows 7和Vista，建議使用Windows 7操作系統。

1.Windows Phone7開發環境安裝

下載Windows PhoneDeveloper Tools登錄微軟MSDN開發者網站，下載Windows PhoneDeveloper Tools，這個工具包含了以下所有組件：

?Visual Studio 2010 Express forWindows PhoneWindows PhoneEmulator

?Silverlight forWindows Phone

?XNA Game Studio 4.0

?Microsoft Expression Blend forWindows Phone

點擊安裝vm_web.exe

License Agreement界面如圖2.1所示。

接受許可協議后在接下來的界面中單擊“Install Now”按鈕，如圖2.2所示。當前一共260MB，下載之后進行安裝，如圖2.3～圖2.7所示。

2.其他開發部署工具

Windows PhoneEmulator：用于運行和調試應用程序和游戲的模擬器。這樣就不需要手機的硬件加速模擬器。

?PhoneRegistration Tool：當有了Windows Phone手機后，使用Marketplace賬號，這個工具能夠將設備解鎖以便運行和調試應用程序。

?Application Deployment：當開發出一個Windows Phone7的應用，并嘗試將它往真實手機上部署的時候，需要利用這個工具把.xap包部署上去。

2.3 設計方法

Expression Blend forWindows Phone是一種優秀的設計工具，它使得Windows Phone應用程序的設計開發過程更加高效。Expression Blend forWindows Phone中包含了專門為創建Windows Phone應用程序而設計的工具。

2.3.1 Expression Blend forWindows Phone7

1.應用程序頁面

在Expression Blend中新建一個Windows Phone項目，在工程項目窗口中間會呈現出一個與手機屏幕相似的應用程序頁面，如圖2.8所示。開發人員可以在這張“畫布”上拖曳或者新建控件，在代碼窗口添加代碼，修改各個對象的邏輯次序，在這個工具上開發人員可以將想要的方式顯示在屏幕上并在模擬器中運行預覽效果。也可以與計算機連接，在Windows Phone設備中預覽自己開發的應用程序。

2.設備面板

在設備面板中可以調整背景和文字的顏色，調整呈現的方向并選擇是在Windows Phone仿真器上還是在與計算機連接的Windows Phone設備上預覽應用程序，如圖2.9所示。

3.自定義應用程序欄

開發人員開發應用程序時會用到自定義程序欄的功能，這里從列表中選擇內置應用程序欄按鈕和菜單項就可以快速實現，無須額外代碼。另外，在這個面板中，自定制的應用程序欄按鈕和菜單項也可以被快速添加到工程中。具體操作步驟如下：在“對象和時間線”面板中，右鍵單擊“PhoneApplicationPage”→單擊“添加ApplicationBar”→右鍵單擊“ApplicationBar”→單擊“添加ApplicationBarIconButton”→在“IconUri”下拉列表中選擇所需的按鈕圖標。

4.預覽Windows Phone樣式

在面板中，用戶可以應用文本樣式模板并且實現快速預覽。開發者可以右鍵單擊顯示文本的文本塊，在彈出的快捷菜單中單擊“編輯樣式”，再單擊“應用資源”，然后選擇所需的文本樣式，如圖2.10所示。

5.定義頁面導航

如果需要定義導航，可以右鍵單擊想要定義導航的應用程序頁面上的對象，在彈出的快捷菜單中選擇“導航到”項，然后在可用頁面列表中單擊想要導航到的頁面，如圖2.11所示。

6.預置的Windows Phone樣式按鈕圖標（如圖2.12所示）

7.Windows Phone手機鍵盤

在開發應用程序時有時需要用戶將數據輸入到字段中顯示相應的鍵盤。這里開發人員可以通過修改 TextBox 上的 InputScope 屬性指定要輸入到字段中的數據的類型，另外還可以指定用戶輸入時要顯示的鍵盤，如圖2.13所示。具體操作是在應用程序頁面中選擇“TextBox”后從“屬性”面板的“公共屬性”類別的“InputScope”下拉列表中選擇所需的輸入類型。

使用Expression Blend來開發Windows Phone7的應用程序，無論是開發Silverlight應用程序還是XNA 游戲程序，都有助于開發出一個平滑酷炫的用戶界面，這也是開發一個成功的應用程序的要素之一。

用戶體驗是這幾年熱炒的話題之一，用戶界面設計師的價值也獲得了越來越高的認可。消費者總是想獲得更美、更炫的產品。以微軟的操作系統為例，從Dos 6.2到Windows 3.1、Windows 95、Windows 98、Windows 2000、Windows XP，以及Windows Vista、Windows 7……用戶界面越來越華麗，元素越來越豐富，使用日益簡潔。這是聆聽用戶反饋、追求用戶體驗的結果。從Windows Phone角度看，這里就涉及Windows Phone7UI設計中的兩個問題，Windows Phone7的UI設計和Windows Phone7應用程序的控件。

2.3.2 Windows Phone7的UI設計

User Interface design（UI設計）是一種需要復合知識的行業。UI設計需要考慮到人與手機交互的易用性，操作邏輯的簡單高效，以及用戶界面的美觀。

從根本上講，User Interface design 需要應用程序滿足消費者的需求，所以用戶目標的完整實現是一個基本需求，另外更高的要求包括視覺各個元素與功能操作的所有東西都需要完整一致，這就需要一些技能和工具才能完美實現。如圖2.14所示為Expression Blend項目界面。

對于Windows Phone7中的UI設計，具體說可以考慮以下幾個基本特點。

1.多種輸入方式

Windows Phone7的用戶界面有四種輸入方式：

?軟鍵盤

?傳感器

?多觸手勢

?硬件按鈕

多觸手勢是用戶和Windows Phone7進行交互的主要方式，支持單點、多點觸摸。單點觸摸的手勢主要有：平移、劃動、長按、單擊、雙擊；多點觸摸的手勢有：縮放。

2.頁面框架及布局

開發Windows Phone7的應用程序可以基于 Silverlight 的頁面卷軸瀏覽模式，用戶的手機就真的像一個window一樣在一張長長的畫布上導向和瀏覽。Windows Phone7的頁面布局特點如圖2.15所示。

圖2.15中包含了Frame Control（框架）的頂層容器控件，可以承載 Page Control（頁面）。在應用程序中，另外，頁面和內容可以分離。Windows Phone7提供框架和頁面的類，可以方便導航到獨立的內容塊中。

3.主題

使用主題的優勢是保持與 Metro 設計原則的一致性，能確保用戶界面元素及控件呈現的一致性。開發人員可以在應用程序中使用代碼來改變主題。

4.屏幕方向

Windows Phone7手機支持豎屏和橫屏。向左橫屏和向右橫屏之間的區別是應用程序工具欄和系統托盤的方位不同。開發應用程序應當支持左橫屏或者右橫屏的應用程序工具欄和系統托盤的方位。

2.3.3 Windows Phone7UI設計需要考慮的幾個方面

理論上，界面設計是一個需要耗費大量時間和精力的事情，涉及反復的修改，需要不同學科的知識綜合。用戶界面設計應當將用戶常用操作置于突出位置，增加用戶使用的便捷性，窗口大小、保持顏色、字體等的一致性。開發和設計Windows Phone7還應考慮以下幾個方面。

1.支持上述四種輸入方式，包括觸摸、軟鍵盤、按鈕和傳感器

Windows Phone7的UI充分體現了觸摸設計的優勢，幾乎所有的操作都是通過一系列手勢而完成的（除了用按鈕調整音量之類的功能）。這就需要考慮點擊區域的大小要恰當，太小會造成操作不便，每一個可以被觸摸的 UI 元素應該可以被手指方便地點擊，如圖2.16所示。

2.使用Metro主題控件

在上一章探討過Metro，相信大家都有了解。Metro是一種呈現方式，在現實生活中的地鐵站、汽車站，飛機航站樓經常能看到“領航式”的圖標信息。Windows Phone7中就提供了標準的Metro主題控件。這些控件在發布前已經做了性能的優化測試，開發人員可以利用它實現支持觸摸交互的效果，這提高了開發人員的開發效率。Metro主題控件設計UI如圖2.17所示。

3.文字，顏色和頁面框架

在Windows Phone7設計中需要使用統一的配色、框架結構和文字，這與PC的應用程序一樣。在Windows Phone7的頁面設計中，要充分考慮元素控件、導航控件和頁面結構的一致性，也要考慮列表呈現的多樣，比如可以用Pivot形式呈現，也可以用list形式呈現，甚至自定義模塊來實現。XAML程序一次開發，多處使用，因此精心開發的程序框架在另一個版本的設計中可以多次利用。

2.4 Windows Phone7應用程序控件

簡單地說，Windows Phone7應用程序開發的控件主要包括兩大類：Windows Phone7應用程序控件和Windows Phone7操作系統控件（當然開發人員也可以自己定制控件）。Windows Phone7應用程序控件如圖2.18所示。

圖2.18中右側是Visual Studio 2010所帶的標準控件，其中包括了手機開發中使用的一些專用控件。如Ellipse（橢圓）、Progress Bar（進度條）、Slider（滑動條）、Border（邊框），這些控件在Visual Studio 2010中也有，但不相同。

另外還有一些控件屬于Windows Phone7的操作系統控件，如進度顯示器、系統托盤和應用工具欄、上下文菜單等。

在進行Windows Phone7UI設計時，可以通過Windows Phone7Developer Tools以所見即所得的方式來進行UI的設計，結合Expression Blend還可以把UI設計與數據分離，把開發人員和設計人員分離，他們共享工程，最終實現優秀的用戶體驗。圖2.19展示了部分UI設計中的控件列表。

針對Windows Phone7開發的其他一些控件也可以在微軟官方網站上下載：http：//gallery.expression.microsoft.com/，這個網站上列出了最新上載的控件及下載量最高的控件。

本章介紹了Windows Phone手機開發的工具下載、設計及開發控件，讀者通過本章的介紹可以看出Windows Phone手機開發工具的簡單、便捷，下一章我們將利用這些工具開發一個簡單的應用。