Visual Studio是一套完備的工具和服務，可幫助您在Microsoft平臺或其他平臺創(chuàng)建各種各樣的應用程序。本文旨在指導如何在Windows Visual Studio平臺上使用XAML和C#創(chuàng)建一個簡單的“Hello World”應用。通過本文你將了解到面向Windows 10和UWP如何創(chuàng)建新的Visual Studio項目、如何在編寫XAML時更改起始頁上的UI以及怎么在本地運行Visual Studio項目等等。

開始之前，如果需要下載安裝Visual Studio 2017可以點擊下方下載鏈接和安裝教程鏈接。

Microsoft Visual Studio 2017安裝和使用教程>>

一、在Visual Studio中創(chuàng)建新項目

1. 啟動Visual Studio 2017。
2. 從File菜單中，選擇New>Project打開項目對話框。
3. 從左側的模板列表選擇Installed>Visual C#>Windows Universal查看項目模板列表。如果未看到任何通用模板，可能是缺少UWP應用的組件，可以通過在New Project對話框中單擊打開Visual Studio安裝來重復安裝流程并添加UWP支持。
   
4. 選擇Blank APP(Universal Windows)模板，輸入“Hello World”作為名稱，確定。
   

如果你是首次使用Visual Studio，則可能會看到要求啟用Developer Mode的設置對話框。開發(fā)人員模式是一種用于啟用某些功能，如允許直接運行應用而不是從應用商店運行的特殊設置。這里需要選擇Developer Mode，然后點擊OK并關閉對話框。

1. 將顯示Target Version/Minimum Version對話框，默認設置均適用于本教程，因此選擇OK以創(chuàng)建項目。
   
2. 新項目打開時，項目文件將顯示在右側的Solution Explorer Pane窗口中，若要查看你的文件請選擇Solution Explorer Tab選項卡而不是Properties Tab選項卡。
   

盡管Blank APP(Universal Windows)為最基本的模板，但該模板仍包含很多文件。這些文件是使用C#的所有UWP應用必不可少的文件。在Visual Studio中創(chuàng)建的每一個項目都包含這些文件。

二、使用設計器視圖添加按鈕

1. 在設計視圖中雙擊MainPage.xaml打開，你將發(fā)現(xiàn)圖形視圖位于屏幕頂部，而XAML代碼視圖位于底部。我們可以對任一視圖進行更改，但現(xiàn)在使用圖形視圖。
   
2. 單擊左側垂直的Toolbox選項，打開UI空間列表（可以單擊標題欄中的固定圖表使其始終可見）。
   
3. 展開Common XAML Controls，然后將Button拖動到設計畫面的中間。
   
   如果查看XAML代碼窗口，你會發(fā)現(xiàn)Button已添加到此窗口中：

   <Button x:name="button" Content="Button" HorizontalAlignment="Left" Margin = "152,293,0,0" VerticalAlignment="Top"/>

4. 更改按鈕的文本：在XAML代碼視圖中單擊一下，然后將內(nèi)容從“Button”更改為“Hello World”。

   <Button x:name="button" Content="Hello, world!" HorizontalAlignment="Left" Margin = "152,293,0,0" VerticalAlignment="Top"/>

   注意設計畫布中顯示的按鈕如何更新顯示新文本。
   

三、啟動應用

至此已經(jīng)創(chuàng)建了一個非常簡單的應用，現(xiàn)在可以開始構建、部署和啟動應用并查看其外觀。你可以在本地計算機、模擬器、仿真器或者在遠程設備上調(diào)試應用。下面是Visual Studio中的目標設備菜單。

默認情況下，應用在本地計算機上運行。目標設備菜單提供用于在桌面設備上調(diào)試應用的多個選項。如模擬器、本地計算機和遠程計算機。

在本地計算機上開始調(diào)試：

1. 在Standard工具欄上的目標設備菜單Local Machiine中，確保已選中Local Machine。
2. 單擊工具欄或Debug餐單中的Start Debugging按鈕或者按F5。
3. 應用將在窗口中打開，并且將首先顯示默認初始屏幕。初始屏幕由一個圖像（SplashScreen.png）和背景色（在應用的清單文件中指定）定義。初始屏幕會消失，然后會出現(xiàn)你的應用，外觀如下所示：
   
   按Windows鍵以打開開始菜單然后顯示所有應用。請注意，本地部署應用會將其添加到開始菜單，若要稍后再次運行該應用，請在開始菜單中點擊。至此已經(jīng)生成了第一個UWP應用！
4. 停止調(diào)試：單擊工具欄中的Stop Debugging或者在Debug菜單中單擊Stop Debugging或者關閉應用窗口。

四、事件處理程序

事件處理程序聽起來很復雜，但它只是事件發(fā)生，如用戶單擊按鈕時調(diào)用的代碼的另一個名稱。雙擊設計畫布中的按鈕控件，讓Visual Studio為該按鈕創(chuàng)建事件處理程序。也可以手動創(chuàng)建所有代碼。

編輯MainPage.xaml.cs（即代碼隱藏頁面）中的事件處理程序代碼。

private void Button_Click(object sender, RoutedEventArgs e)
{

}

對其進行更改以后如下所示：

private async void Button_Click(object sender, RoutedEventArgs e)
{
    MediaElement mediaElement = new MediaElement();
    var synth = new Windows.Media.SpeechSynthesis.SpeechSynthesizer();
    Windows.Media.SpeechSynthesis.SpeechSynthesisStream stream = await synth.SynthesizeTextToStreamAsync("Hello, World!");
    mediaElement.SetSource(stream, stream.ContentType);
    mediaElement.Play();
}

此代碼使用一些Windows API創(chuàng)建的一個語音合成對象，提供給該對象一些要說的文本。運行該應用并單擊按鈕時，計算機或手機會逐字的說出“Hello World”。

觀看下方視頻了解更多詳細信息：

想要購買Visual Studio正版授權，或者獲取更多該產(chǎn)品相關信息的朋友可以點擊" "~