Windows Phone7天初學(1):熟悉開發環境

< body>

一週時間初步學習Windows Phone，假設您已有Silverlight、C#語言等相關基礎，在7天中天天最後有一個帶源碼的案例學習，最後一天是一個綜合性的大型案例。  

1、    開發環境搭建

  相應的開發工具可經過windows phone開發者主頁： http://developer.windowsphone.com 找到相應的軟件，或直接到如下地址下載：

  Windows Phone Developer Tools RTW 下載地址：

http://www.microsoft.com/downloads/en/details.aspx?FamilyID=04704acf-a63a-4f97-952c-8b51b34b00ce&displaylang=en

單擊下載連接，vm_web.exe,下載後運行，在線安裝，運行（離線安裝也可，需下載ISO文件），將自動安裝如下相關軟件：

The Windows Phone Developer Tools includes the following

1) Visual Studio 2010 Express for Windows Phone

2) Windows Phone Emulator Resources

3) Silverlight 4 Tools For Visual Studio

4) XNA Game Studio 4.0

5) Microsoft Expression Blend for Windows Phone

Windows Phone Developer Tools January 2011 Update ：（模擬器等更新）

http://www.microsoft.com/downloads/en/details.aspx?FamilyID=49B9D0C5-6597-4313-912A-F0CCA9C7D277

 

2、 項目模板及文件介紹

Windows Phone 包含如下類型的項目:

1）     Windows Phone Application: 單頁面應用程序

2）     Windows Phone Databound Application ，多頁面應用程序

3）     Windows Phone Class Library, 類庫

4)  Windows Phone Panorama Applicaion ，使用全景控件的應用程序

5)Windows Phone Prvot Application ，使用中軸控件應用程序。

以Windows Phone Application項目模板爲例，瞭解一下程序結構，查看解決方案資源管理器，如圖1-1。

圖1-1

包含的主要文件有：

App.xaml ：這個文件和ASP.NET中的web.config文件很類似。定義應用程序級的資源、數據和設置等，其中含標記：

  < Application.Resources >

………………….

    </ Application.Resources >

在其代碼文件App.xaml.cs中還包含了 Application_Launching 、Application_Activated、Application_Deactivated、Application_Closing 等事件處理。

 

AppManifest.xml ：生成應用程序安裝包(XAP)所需的一個簡單的應用程序清單文件。

WMAppManifest.xml : 包含了應用程序特定數據的元數據文件，包括標題，圖標位置，功能等等

AssemblyInfo.cs : 包含了名稱和版本的元數據，會被嵌入到生成的程序集文件中。

Background.png : 當程序被顯示到開始界面中就會顯示這個圖像。MainPage.xaml :程序首頁面。

SplashScreenImage.jpg : 應用程序載入時顯示的圖片。

ApplicationIcon.png ：程序特定的圖標，用戶會在他們的程序中將看到此圖標。

  3、一些學習資源
MSDN手機開發:
http://msdn.microsoft.com/zh-cn/ff380145
http://msdn.microsoft.com/zh-cn/windowsphone/default.aspx?ocid=ban-f-cn-wp7--MSDN
51CTO Windows Phone專題:http://mobile.51cto.com/mobile-219051.htm
臺灣MSDN:http://msdn.microsoft.com/zh-tw/windowsphone/ff955788
Silverlight for WP7視頻： http://www.microsoft.com/china/msdn/events/webcasts/shared/webcast/Series/WP.aspx
WP7書籍：
http://www.amazon.com/s/ref=nb_sb_noss?url=search-alias%3Dstripbooks&field-keywords=Phone+7

銀光wp7:g http://silverlightchina.net/html/wp7/

< body>  

案例1-1:完成一個經典的「Hello」應用程序

完成一個經典的「Hello」應用程序 ，建立一個針對Windows Phone的Silverlight的應用程序，學習如何使用相應開發工具來建立和設計Windows phone應用程序，並在Windows Phone Emulator上去部署。

(1) 啓動Visual Studio 2010，在項目對話框中，選擇模板「Silverlight for Windows Phone」，建立「Windows Phone Application」

(2) 在資源管理器中，可看到解決方案MyHello中項目，及文件結構。如圖1-2。

         圖1-2

MainPage.xaml 爲程序的起始頁面，默認界面xaml代碼以下：

<Grid x:Name="LayoutRoot" Background="Transparent">

        <Grid.RowDefinitions>

            <RowDefinition Height="Auto"/>

            <RowDefinition Height="*"/>

        </Grid.RowDefinitions>

        <!--TitlePanel contains the name of the application and page title-->

        <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28">

            <TextBlock x:Name="ApplicationTitle" Text="MY APPLICATION" Style="{StaticResource PhoneTextNormalStyle}"/>

            <TextBlock x:Name="PageTitle" Text="page name" Margin="9,-7,0,0" Style="{StaticResource PhoneTextTitle1Style}"/>

        </StackPanel>

        <!--ContentPanel - place additional content here-->

        <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0"></Grid>

    </Grid>

頁面分紅了二個部分，Grid容器中含有StackPanel、Grid控件，其中StackPanel中爲程序標題信息。自動生成兩個TextBlock，一個顯示」MY APPLICATION」,這是應用程序的名稱；另外一個顯示page name「，這是當前頁的標題。可修改這些顯示，使之反映本身的實際程序，先將當前頁的標題名稱」page name」改成」Hello」,暫時不做任何改動。

(3) 選擇模擬器輸出方式：Windows Phone 7 Emulator

(4) 按」F6」編譯程序，將建立模擬器，並在模擬器窗口中顯示程序的啓動頁面，應該是沒有任何錯誤。

(5) 按 」F5」 運行程序，將建立模擬器顯示應用程序，第一次啓動，時間要長些。效果如圖1-3：

圖1-3

(6) 按」SHIFT+F5」結束運行，模擬器最好不要關閉，那麼部署新應用程序來進行測試時，模擬器會更快地響應。

(7) 設計用戶界面，打開工具箱直接拖動控件便可。添加一個textblock、一個textbox、 及一個button控件,xaml標記以下，已直接添加註解：

< Grid x : Name ="LayoutRoot" Background ="Transparent" ShowGridLines ="True">

        < Grid.RowDefinitions >

            < RowDefinition Height ="Auto"/>

            < RowDefinition Height ="Auto" />// 增長一行

            < RowDefinition Height ="*"/>

        </ Grid.RowDefinitions >

<!--  第一行爲標題  -->

< StackPanel x : Name ="TitlePanel" Grid.Row ="0" Margin ="12,17,0,28">

< TextBlock x : Name ="ApplicationTitle" Text ="MY APPLICATION" Style ="{ StaticResource PhoneTextNormalStyle }"/>

  < TextBlock x : Name ="PageTitle" Text ="Hello" Margin ="9,-7,0,0" Style ="{ StaticResource PhoneTextTitle1Style }"/>       

        </ StackPanel >

 

  <!— 第二行，定義爲兩列，放置兩個控件，第1列寬度設置爲」*」，儘量伸展寬度，第2列寬度設置爲」Auto」根據控件的寬度而調整 -->

    <Grid x:Name="ContentPanel" Grid.Row="1" Margin="12,0,12,0">

            <Grid.ColumnDefinitions >

                <ColumnDefinition Width="*" />

                <ColumnDefinition Width="Auto" />

            </Grid.ColumnDefinitions>

      <TextBox Grid.Column="0"  Name="textBox1" Text="" Margin="20" ontSize="{StaticResource PhoneFontSizeExtraLarge}"  />// FontSize 屬性值讀取資源

            <Button Content=" 點擊" HorizontalAlignment="Right" Grid.Column="1"  Name="button1" Margin="20" Padding="8" Click="button1_Click" />

        </Grid>

  <!— 增長第三行，顯示用戶輸入, HorizontalAlignment爲伸展Stretch  -->

       <Grid Grid.Row="2"   Name="grid1" VerticalAlignment="Top" >

            <TextBlock   Name="textBlock1" Text="" Style="{StaticResource PhoneTextExtraLargeStyle}" HorizontalAlignment="Stretch" Foreground="Red" TextWrapping="NoWrap" TextAlignment="Center" FontWeight="Bold" />

        </Grid>

        </ Grid >

</ Grid >

 

(8) 雙擊命令按鈕，建立事件處理函數，在代碼隱藏文件中對應的單擊事件處理程序中插入代碼，以下所示：

private void button1_Click(object sender, RoutedEventArgs e)

        {

            textBlock1.Text = textBox1.Text;

            textBox1.Text = String.Empty;

        }

 

（9）按F5鍵運行程序，在文本框中輸入後，單擊 「單擊我」按鈕，將會在第二個TextBlock顯示輸入的內容。顯示效果如圖1-4：

圖1-4

（10）如需調試應用程序，切換到Visual Studio，將光標定位到下面這一行：

            textBlock1.Text = textBox1.Text;

按F9或單擊該行左邊，插入斷點，會看到頁邊顯示一個紅點。

（11）F5運行後，Visual Studio會中止於斷點行，這時可查看相應的變量值等，可進一步調試程序。

 

7天學習主要參考資料以下,並特此鳴謝！

1.  WP7TrainingKitOffline

2.  林永堅.Silverlight for Windows Phone 開發系列

3.  張崟.Windows Phone 7 開發 31 日談

4.  306ROOM( 網名).一塊兒學windows phone7