# Windows Phone 7 快速上手指南 ( 含學習資源整理 ) 為了替同事賺取 Tech Days 2010 門票，不得不下海撰寫 Windows Phone 7 文章，不過自己也是對 WP7 有興趣啦，所以趁著假日把研究的過程做個紀錄，希望對初學者有幫助。另外，由於目前 Expression 4 已經推出正式版，我在研究的過程發現網路上有些資訊已經不太正確，所以也剛可以透過此篇文章提供較為正確的快速上手指南。 首先，要開始開發 Windows Phone 7 應用程式必須先符合以下基本條件，並先安裝好 2 個軟體： - Windows Vista SP2 以上作業系統 ( 含 Windows 7 ) - [.NET Framework 4](http://www.microsoft.com/downloads/details.aspx?displaylang=zh-tw&FamilyID=9cfb2d51-5ff4-4491-b0e5-b386f32c0992) - [Windows Phone Developer Tools RTW](https://web.archive.org/web/20110612165849/http://www.microsoft.com/downloads/en/details.aspx?FamilyID=04704acf-a63a-4f97-952c-8b51b34b00ce&displaylang=en) ( 此開發工具套件包含以下工具，皆為免費軟體 ) - Visual Studio 2010 Express for Windows Phone - Windows Phone Emulator Resources - Silverlight 4 Tools For Visual Studio - Microsoft Expression Blend for Windows Phone - XNA Game Studio 4.0 - [Windows Phone Developer Tools October 2010 Update](http://web.archive.org/web/20120101011745/http://www.microsoft.com/download/en/details.aspx?id=23854) ( 2010 年 10 月份推出的更新套件 ) - Windows Phone Capability Detection Tool ( [How to: Use the Windows Phone Capability Detection Tool](http://msdn.microsoft.com/en-us/library/gg180730\(VS.92\).aspx) ) - Windows Phone Connect Tool ( [How to: Use the Windows Phone Connect Tool](http://msdn.microsoft.com/en-us/library/gg180729\(VS.92\).aspx) ) - Updated Bing Maps Silverlight Control 如果想學習如何開發 Windows Phone 7 建議可以參考本文最後的【**學習資源整理**】相信很快就會上手。 以下是利用 [Windows Phone Developer Tools](https://web.archive.org/web/20110612165849/http://www.microsoft.com/downloads/en/details.aspx?FamilyID=04704acf-a63a-4f97-952c-8b51b34b00ce&displaylang=en) 開發工具 ( 亦即 Visual Studio 2010 Express for Windows Phone + Microsoft Expression Blend for Windows Phone ) 建立一個「音樂點唱機」應用程式，並使用內建的 Windows Phone 7 模擬器來執行。 **第一步：在 Visual Studio 2010 中新增一個 Windows Phone Application 專案** **注意**：~~由於 Windows Phone Developer Tools 目前還在 Beta 版，因此並沒有推出繁體中文的版本，因此~~若你安裝的是 Visual Studio 2010 繁體中文版，安裝好之後在 Visual Studio 2010 之中將會看不到 **Windows Phone Application** 專案範本，此問題的解決方法與步驟如下： 1. 先在 我的文件\\Visual Studio 2010\\Templates\\ProjectTemplates\\Visual C# 目錄下建立一個子目錄，目錄名稱為 Silverlight for Windows Phone 2. 再將以下目錄的所有檔案複製到 **步驟1** 新建立的目錄裡： C:\\Program Files\\Microsoft Visual Studio 10.0\\Common7\\IDE\\ProjectTemplates\\CSharp\\Silverlight for Windows Phone\\1033\\ 3. 設定成功後，在 Visual Studio 2010 中新增專案時的圖示如下： ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/eebac4cc62ecc8ae5dbf-SNAGHTML2e817707.png) **第二步：瞭解預設專案範本的內容** 以下是方案總管裡各項目的說明： ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/fc37f1c25a291d869172-image_121.png) 在專案屬性裡有一些 Windows Phone 7 應用程式專屬的屬性設定： ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/2a2e04c9749579597b99-image_122.png) **第三步：選取 Windows Phone 7 Emulator (模擬器) 並按下 F5 功能鍵開始偵錯** ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/a832e00c12ac94410095-image_123.png) 以下是第一次成功執行時的畫面： ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/355876fe55396da4a18c-image_124.png) 由於每次啟動 Windows Phone Emulator 都會花些時間載入，所以在關掉 Windows Phone Emulator 時都會提示你是否真的要關閉，這可以避免你在開發 Windows Phone Application 的時候花太多時間在等待模擬器載入，所以在開發時期建議不要頻繁的關閉 Windows Phone Emulator 以節省時間。 ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/6fa8eadb6466cb36b975-image_125.png) **第四步：開啟 Expression Blend 編輯應用程式預設頁面 ( MainPage.xaml )** 我們可以直接在方案總管在 MainPage.xaml 檔案上按滑鼠右鍵，並選取 \[Open in Expression Blend…\] 直接使用 Expression Blend 編輯 XAML 檔，而這部分就完全是 Silverlight 的領域了。 ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/094796bc699f8d4c4dd4-image_126.png) 開啟之後，我們可以在預設頁面上嘗試修改一些文字，以下為了展示用途，我們可以將嘗試替 PageTitle 這個 TextBlock 加上一個 MouseDragElementBehavior 行為，這樣就可以立即讓 PageTitle 這個 TextBlock 擁有「拖曳」的能力！ ( 此示範僅讓 TextBlock 物件有拖曳的行為而已 ) [![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/e3dd1e6377d22c75329d-image_thumb_21.png)](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/0b7fc0e8da6fe98f0427-image_127.png) 套用完成後，我們也可以透過 **Objects and Timeline** 視窗看到 MouseDragElementBehavior 行為已經套上 PageTitle 這個 TextBlock 裡了。 ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/8661f67404d16f66e231-image_128.png) **備註**：你也可以直接將 MouseDragElementBehavior 行為拖曳到 **Objects and Timeline** 視窗的任一個物件上。 接著我們再新增幾個 TextBlock 物件上去，並輸入一些歌名： ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/f46644b48218ea39daae-image_129.png) 然後將個別新增 PlaySoundAction 行為到這幾個 TextBlock 物件上： ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/dc649977c238485f9518-image_130.png) 接著設定每個 PlaySoundAction 行為的屬性，載入這幾首歌的 MP3 檔案與設定預設音量： ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/86ce313328a27fcbbfaa-image_131.png) 都設定完成後我們在 Expression Blend 中按下 **Ctrl + S** 存檔，若切回 Visual Studio 2010 專案，你會發現收到一個【偵測到檔案修改】的提示視窗，請點選「重新載入」。 [![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/2949ca831e60ae0c81d8-image_thumb_22.png)](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/72f58e0c10548471ea42-image_132.png) 這時你會發現重新載入的專案新增了幾個 \*.mp3 檔，那是因為我們在 Expression Blend 載入的 MP3 音樂檔全部都會自動被加入專案中，也會全部一併被部署到 Windows Phone Emulator 中： ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/77e0d651340b32159cb7-image_133.png) 這時我們再次按下 F5 功能鍵開始偵錯，這時你操作的時候就會發現 PageTitle 可以被任意拖曳移動，而且點選歌名也會自動播放歌曲！ ![alt](https://stwillblogassets.blob.core.windows.net/files/images/external/stwillblogassets.blob.core.windows.net/6a6aba88b5e83752e268-SNAGHTML2f89ee9c.png) 到目前為止，我們還沒寫任何一行程式碼，就已經完成了一個「堪用」的 Windows Phone 7 應用程式，是不是非常簡單呢！ ^\_^ 如果你迫不及待想改快寫出一些「好用」的 Windows Phone 7 應用程式，可以參考以下學習資源整理，其實就算你完全看不懂 XAML 語法，透過 Expression Blend 4 工具，用猜的也能畫出一些小玩意，若要寫出一些可用的程式，光是看以下的影片示範應該就很夠了，若要精通就要多看文件了。 **++==== 學習資源整理 ====++** **官方網站** - [Windows Phone 7](http://www.windowsphone7.com/) - [Windows Phone for Developers | Windows Phone: 開發人員首頁](http://developer.windowsphone.com/) - [Windows Phone Developer Blog](http://windowsteamblog.com/Windows_Phone/b/wpdev/) - WP7 Dev Team (wp7dev) on Twitter - [Windows Phone Development](http://msdn.microsoft.com/en-us/library/ff402535\(VS.92\).aspx) \[ MSDN 官方文件，推薦!! \] - [Windows Phone 7 Developer Training Kit | Learn | Channel 9](http://channel9.msdn.com/learn/courses/WP7TrainingKit/) \[ 官方的影音教材，推薦!! \] - [Windows Phone 7 Training Kit for Developers - RTM Refresh](https://web.archive.org/web/20100819064750/http://www.microsoft.com/downloads/details.aspx?familyid=CA23285F-BAB8-47FA-B364-11553E076A9A&displaylang=en) \[ 官方的訓練教材，推薦!! \] **影音教學** 由 [Rob Miles](http://www.robmiles.com/) 與 [Andy Wigley](http://mobileworld.appamundi.com/blogs/) 親自操刀錄製整整 12 小時的 Windows Phone 7 訓練課程 (可下載影片) **!! 強烈推薦 !!** - **Windows Phone 7 Jump Start (Session 1 of 12): Introduction** - **Windows Phone 7 Jump Start (Session 2 of 12): Building a Silverlight Application, Part 1** - **Windows Phone 7 Jump Start (Session 3 of 12): Building a Silverlight Application, Part 2** - **Windows Phone 7 Jump Start (Session 4 of 12): Building Games for the Windows Phone 7 Platform** - **Windows Phone 7 Jump Start (Session 5 of 12): Building XNA Games for the Windows Phone 7 Platform, Part 1** - **Windows Phone 7 Jump Start (Session 6 of 12): Building XNA Games for the Windows Phone 7 Platform, Part 2** - **Windows Phone 7 Jump Start (Session 7 of 12): Advanced Application Development, Part 1 ****Windows Phone 7 Jump Start (Session 8 of 12): Advanced Application Development, Part 2** - **Windows Phone 7 Jump Start (Session 9 of 12): Advanced Application Development, Part 3** - **Windows Phone 7 Jump Start (Session 10 of 12): Marketing Your Windows Phone 7 Application** - **Windows Phone 7 Jump Start (Session 11 of 12): Working with Media** - **Windows Phone 7 Jump Start (Session 12 of 12): Final Silverlight Topics and Wrap-Up** - [**Windows Phone 7 Jump Start – Class Resources**](http://borntolearn.mslearn.net/wp7/m/classresources/default.aspx) ( 上述課程的完整教材，真是佛心來的! ) 在其他網站也有些教學影片 - [Silverlight Screencasts and Training Videos for Windows Phone](https://web.archive.org/web/20110719030427/http://www.silverlight.net/learn/videos/windows-phone/) - Windows Phone 7 in 7 Minutes! (Beta) - [Windows Phone | Tags | Channel 9](http://channel9.msdn.com/tags/Windows+Phone/) - [Windows Phone Design Days](http://channel9.msdn.com/tags/designday/) - [Windows Phone 7 development for absolute beginners](http://channel9.msdn.com/Blogs/coolstuff/Windows-Phone-7-development-for-absolute-beginners) **教學文章** - [邊做邊學 Windows Phone 7 開發](http://msdn.microsoft.com/zh-tw/windowsphone/ff955788.aspx) - [Windows Phone 7 開發人員實驗室](http://msdn.microsoft.com/zh-tw/windowsphone/gg416980.aspx) - [Windows Phone 7 Training Course](http://msdn.microsoft.com/en-us/wp7trainingcourse.aspx) \[ [下載 Training Kit 檔案](http://go.microsoft.com/?linkid=9723028) \] - [初识 Windows Phone 7](http://www.cnblogs.com/randylee/category/258712.html "http://www.cnblogs.com/randylee/category/258712.html") - [一起学 Windows Phone7](http://www.cnblogs.com/randylee/category/258713.html) - [深入学习 Windows Phone7](http://www.cnblogs.com/randylee/category/259839.html) - [31 Days of Windows Phone 7](https://blankenblog.com/2010/09/30/31-days-of-windows-phone-7/) **參考文章** - [Windows Phone - ScottGu's Blog](https://weblogs.asp.net/scottgu/tags/windows-phone) - [Scott Hanselman – WinPhone](http://www.hanselman.com/blog/CategoryView.aspx?category=WinPhone) - [Getting Started with Silverlight and Windows Phone 7 Development](https://timheuer.com/blog/get-started-with-silverlight-for-windows-phone/) - [Introducing Blend 4 – For Silverlight, WPF and Windows Phone](http://electricbeach.org/?p=438) - [How to: Add an Application Bar to Your Application for Windows Phone](http://msdn.microsoft.com/en-us/library/ff431786\(VS.92\).aspx) - [Custom Windows Phone 7 Behaviors for Expression Blend](http://cisforcoder.wordpress.com/2010/08/22/custom-wp7-behaviors-for-expression-blend/) - [Windows Phone 7 - Wikipedia, the free encyclopedia](http://en.wikipedia.org/wiki/Windows_Phone_7) - [Top 10 Tips for a Successful Marketplace Certification](https://web.archive.org/web/20130701042533/http://blogs.msdn.com/b/christianklasen/archive/2010/10/05/top-10-tips-for-a-successful-marketplace-certification.aspx) - [Windows Phone 7 Developer Resources](https://blankenblog.com/2010/09/17/windows-phone-7-developer-resources/) - NEW! [Updated Version of Windows Phone 7 Application Certification Requirements](http://windowsteamblog.com/windows_phone/b/wpdev/archive/2010/10/29/updated-version-of-windows-phone-7-application-certification-requirements.aspx) - NEW! [WP7 Development Tips Part 1](https://web.archive.org/web/20110108205706/http://blogs.claritycon.com/blogs/kevin_marshall/archive/2010/10/26/wp7-development-tips-part-1.aspx) **免費電子書** - [Programming Windows Phone 7 by Charles Petzold](http://www.charlespetzold.com/phone/) \[ [下載 PDF 電子書](https://archive.org/download/B-001-004-330/Microsoft_Press_ebook_Programming_Windows_Phone_7_PDF.pdf) \] \[ [下載範例程式碼](https://archive.org/download/B-001-004-330/Microsoft_Press_ebook_Programming_Windows_Phone_7_Sample_Code.zip) \] - [Windows Phone 7 使用者介面設計與互動操作指南](https://web.archive.org/web/20110112133956/http://www.delightpress.com.tw:80/book.aspx?book_id=SKUN00002) \[ [下載 PDF 電子書 (中文版)](http://download.microsoft.com/download/8/E/3/8E3124FC-A176-4B95-BD75-FD12FB490F4A/UI_Design_and_Interaction_Guide_for_Windows_Phone_7_v2.0_zh_tw.pdf) \] - [UI Design and Interaction Guide for Windows Phone 7 v2.0](http://go.microsoft.com/fwlink/?LinkID=183218) - [Windows Phone UI Design and Interaction Guide](https://web.archive.org/web/20150226011718/http://download.microsoft.com:80/download/D/8/6/D869941E-455D-4882-A6B8-0DBCAA6AF2D4/UI%20Design%20and%20Interaction%20Guide%20for%20Windows%20Phone%207%20Series.pdf) **相關論壇** - [Windows Phone 7 技術討論區](http://social.msdn.microsoft.com/Forums/zh-tw/wp7msdntaiwan/threads) (MSDN Forum) - [Windows Phone 7 Forum](http://social.msdn.microsoft.com/Forums/en-US/windowsphone7series) - Silverlight for Windows Phone **下載資源** - [Code Samples for Windows Phone](http://msdn.microsoft.com/en-us/library/ff431744\(v=VS.92\).aspx) - [Application Bar Icons for Windows Phone 7 Series](https://web.archive.org/web/20100905002732/http://www.microsoft.com/downloads/details.aspx?FamilyID=369b20f7-9d30-4cff-8a1b-f80901b2da93&displaylang=en) - [73 Windows Phone 7-like Custom Tiles in Three Colors](https://web.archive.org/web/20150914203650/http://pocketnow.com/windows-phone/73-windows-phone-7-like-custom-tiles-in-3-colors) - [Creating high performance Windows Phone apps – THE WHITEPAPER](https://jeffwilcox.blog/2010/08/windows-phone-performance/) - [Microsoft Silverlight 4 Tools for Visual Studio 2010](https://web.archive.org/web/20100901194658/http://www.microsoft.com:80/downloads/details.aspx?familyid=40EF0F31-CB95-426D-9CE0-00DCFABF3DF5&displaylang=en) - [patterns & practices - Windows Phone 7 Developer Guide](https://web.archive.org/web/20180121140659/http://wp7guide.codeplex.com:80/) - Important! [Windows Phone 7 Application Certification Requirements](http://go.microsoft.com/fwlink/?LinkID=183220) - NEW! [Code Samples for Windows Phone](http://msdn.microsoft.com/zh-tw/library/ff431744\(en-us,VS.92\).aspx) **關於 APP HUB** - [APP HUB - home](https://developer.microsoft.com/en-us/windows) - [註冊 Windows Phone App Hub 開發者帳號](http://msdn.microsoft.com/zh-tw/windowsphone/gg180751.aspx)  /  app hub registration walkthrough - [WP7應用程式撰寫與App Hub - Marketplace 送件、審核經驗分享](http://studyhost.blogspot.com/2010/10/wp7app-hub-marketplace.html)