2010/11/5

動手做WP7手機應用程式 PART 2

這次的教學,您將創建、測試、部署和運行您的第一個WP7應用程式,並藉此您將學習到如何使用Windows Phone的開發工具,包括Microsoft 免費提供的Visual Studio 2010 Express、Windows Phone IDE及Windows Phone Emulator,而過程中將會接觸到Silverlight及Visual C#。

因為目前Microsoft Visual Studio 2010 Express for Windows Phone只有英文版,故之後介面上的名稱將以英文來表示,以方便對應。

任務一:在Visual Studio中創建一個Windows Phone App

  1. 執行開發工具Microsoft Visual Studio 2010 Express for Windows Phone。
  2. 在File中選擇New Project來新建一個專案。
  3. 在New Project的對話框中,類別列表中請選擇Silverlight for Windows Phone,並在中間模板選擇區裡點選Windows Phone Application。名稱Name請設定為WindowsPhonePuzzle,位置Location可以自行學定,但我們建議設定在範例資料夾Source底下,並建立一個新的資料夾,如Ex1-CreatingWP7Apps。更改專案名稱Solution name為Begin。在Microsoft Visual Studio 2010 Express for Windows Phone中創建一個新的專案
  4. 在資源管理器Solution Explorer中,可以查看此專案使用該模板所產生的檔案結構。在這裡您可以看到WindowsPhonePuzzle裡面包含了一個與Silverlifht for Windows Phone Project相關的檔案結構。資源管理器顯示 WindowsPhonePuzzle理相關的檔案結構
    該WindowsPhonePuzzle中包含下列項目:

    項目

    說明

    App.xaml / App.xaml.cs 這裡定義了應用程序的入口點,並初始化應用程式使其得到規範內的資源,這裡也定義了顯示應用程式的使用界面
    MainPage.xaml / MainPage.xaml.cs 定義一個接口頁面,主要讓使用者互動使用
    ApplicationIcon.png 此應用程式的圖標,用來在手機的應用程式列表中做一個識別
    Background.png 此為應用程式在開始時的背景圖示
    SplashScreenImage.jpg 此為應用程式在啟動時所開啟的過場畫面,目的在應用程式完成啟動程序前,給予使用者的反饋。這是建立該應用程式是否穩定的形象。您的初始屏幕可以類似於第一頁,以使該應用程序的外觀加載迅速。
    Properties\AppManifest.xml 應用程序的清單文件生成時所需的應用程序包
    Properties\AssemblyInfo.cs 用來將專案名稱和版本的資訊嵌入到編譯成功的應用程式

    Properties\WMAppManifest.xml

    manifest文件,其中包含Windows Phone Silverlight應用程式相關的特定數據,包括僅提供給Windows Phone Silverlight使用的具體功能
    References folder 提供必要的服務和功能給應用程式完成所需要的工作
  5. 在資源管理器Solution Explorer中滑鼠右擊App.xaml,選擇View Designer。該文件中包含XAML標籤及此應用程式根元素的資源,在此您可以針對整個應用程式定義應用程式層級的資源,例如顏色、畫筆、樣式等。XAML的程式碼用以初始化ApplicationLifetimeObjects,並創造一個PhoneApplicationService,用以提供各個應用程式的執行壽命,這包誇了管理應用程式閒置的行為,以及管理應用程式的狀態。App.xaml文件默認生成的程式碼
  6. 在資源管理器Solution Explorer中滑鼠右擊App.xaml,選擇View Code可以打開影藏文件。請注意,此文件中有個處理程序UnhandledException事件,該程序是幫助您遇到錯誤時,此處理程序會將您導航到一個錯誤頁面,並顯示有關的錯誤訊息。
    其中還有三個重要的程序:RootFrame,此程序是用來控制開始頁面的應用程序;另一個PhoneApplicationFrame,他是所有的Windows Phone App的頂層容器元素,這頂層元素主要用來包含一個或多個PhoneApplicationPage,用以讓PhoneApplicationPage可以展現應用程式的內容,同時他也可以處理頁面間的導航。App.xaml.cs影藏文件的內容,顯示全域的事件處理程序
    注意:這個由Silverlight for Windows Phone模板所生成的文件,還包括了「啟動」和「關閉」事件等應用程序。您可以透過修改這些程序來自行定義Windows Phone App的啟動與關閉。
  7. 在新生成的專案中有個預設的檔案,其中裡面的XAML定義了主要的使用者介面及應用程序,您可以滑鼠雙擊資源管理器中的MainPage.xaml就可以看到。
    而在預設的情況下,您會看到兩個視窗,一個式顯示XAML標籤的程式碼視窗,另一個是所見即所得的設計視圖,用來表現當前的用戶介面。您可以透過添加控制件或是自行撰寫程式碼兩種方式,來建立您的應用程式介面。XAML設計器顯示的主要應用介面
  8. ApplicationIcon.png是用來在手機設備的快速啟動中,標示應用程式的標誌,您可以在資源管理器中雙擊該文件,系統會自動執行相關應用程式,以利您進行編輯。
  9. 開發任一個應用程式都需要開發平台或是其他函式庫來提供服務,Windows Phone App也不例外,您可以在資源管理器中的References中檢視或加入欲使用的資源清單。資源管理器顯示References引用的服務項目
  10. 您可以在資源管理器中,透過右鍵單擊WindowsPhonePuzzle,並選擇屬性Properties,來檢視或編輯Windows Phone的manifest檔案。專案的屬性窗口

 

任務二:使用Windows Phone模擬器測試應用程式

目前,這個應用程式並沒有做任何修改,但它已準備好了第一次試運行了。 在此任務中,你將把所建立的應用程序,部署到Windows Phone模擬器,然後執行它,藉此了解典型的開發週期。

  1. 在Debug選單中指向Windows並選擇輸出Output,或者您可以直接使用快速鍵CTRL+W鍵來打開輸出窗口。
  2. 在Debug選單中選擇Build Solution,或者按SHIFT+F6來編譯專案。
  3. 接下來,您可以透過Output輸出窗口觀察,編譯過程中所產生的訊息或結果。編譯應用程式的結果訊息
  4. 目前你應該沒有觀察到任何的錯誤訊息,但是如果有發生編譯錯誤了話,這將顯示在輸出視窗中。為了處理這些錯誤,您可以利用Error List錯誤列表視窗來進行修改。錯誤列表視窗將顯示編譯過程中所發生的錯誤
  5. 在做編譯之前,請先確認您驗證目標的部署是Windows Phone Emulator。這部分您可以在Start Debugging按鈕旁握選擇。往後如果您有實體的Windows Phone,您也可以在此更改其部署。選擇目標設備來部署應用程式
  6. 按F5鍵可以將應用程式啟動在Windows Phone模擬器中,而在模擬設備出現時請稍等一下,Visual Studio必須花點時間用以建立仿真環境及部屬應用程式的導入。
    將應用程式部署到模擬器
  7. 一但Visual Studio準備就緒,模擬器就會顯示開始頁,不久之後您的應用程式也會出現在模擬器的視窗中。
    在模擬器中運行應用程式
  8. 在你還沒修改應用程式的邏輯及介面前,幾乎沒有可以使用的功能。此時您可以按SHIFT+F5貨單擊工具欄上的停止按鈕來結束Debug。這裡建議不要關閉模擬器,因為重新建立模擬器環境及啟動應用程式,是很花時間的,然而在模擬器運行的情況下進行偵錯,只需要較少的時間來建立新的部屬。

 

下一篇教學將延續這個專案,開始進行介面的修改,敬請期待。(未完待續)

動手做WP7手機應用程式 PART 1

動手做WP7手機應用程式 PART 2

動手做WP7手機應用程式 PART3

沒有留言:

張貼留言

注意:只有此網誌的成員可以留言。