企业智能化解决方案服务商

在Visual Studio 2017中创建第一个Hello World应用

翻译 使用教程 | 编辑:Elyn | 2019-01-04 13:22:51| 阅读 0 有用 (0) 评论 (0) 收藏


概述:本文主要介绍如何使用XAML和C#在Visual Studio 2017中创建第一个Hello World应用

Visual Studio是一套完备的工具和服务,可帮助您在Microsoft平台或其他平台创建各种各样的应用程序。本文旨在指导如何在Windows Visual Studio平台上使用XAML和C#创建一个简单的“Hello World”应用。通过本文你将了解到面向Windows 10和UWP如何创建新的Visual Studio项目、如何在编写XAML时更改起始页上的UI以及怎么在本地运行Visual Studio项目等等。

开始之前,如果需要下载安装Visual Studio 2017可以点击下方下载链接和安装教程链接。

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


一、在Visual Studio中创建新项目

  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的设置对话框。开发人员模式是一种用于启用某些功能,如允许直接运行应用而不是从应用商店运行的特殊设置。这里需要选择Developer Mode,然后点击OK并关闭对话框。

  1. 将显示Target Version/Minimum Version对话框,默认设置均适用于本教程,因此选择OK以创建项目。
  2. 新项目打开时,项目文件将显示在右侧的Solution Explorer Pane窗口中,若要查看你的文件请选择Solution Explorer Tab选项卡而不是Properties Tab选项卡。

尽管Blank APP(Universal Windows)为最基本的模板,但该模板仍包含很多文件。这些文件是使用C#的所有UWP应用必不可少的文件。在Visual Studio中创建的每一个项目都包含这些文件。


二、使用设计器视图添加按钮

  1. 在设计视图中双击MainPage.xaml打开,你将发现图形视图位于屏幕顶部,而XAML代码视图位于底部。我们可以对任一视图进行更改,但现在使用图形视图。
  2. 单击左侧垂直的Toolbox选项,打开UI空间列表(可以单击标题栏中的固定图表使其始终可见)。
  3. 展开Common XAML Controls,然后将Button拖动到设计画面的中间。
    如果查看XAML代码窗口,你会发现Button已添加到此窗口中:
  4. 更改按钮的文本:在XAML代码视图中单击一下,然后将内容从“Button”更改为“Hello World”。
    注意设计画布中显示的按钮如何更新显示新文本。

三、启动应用

至此已经创建了一个非常简单的应用,现在可以开始构建、部署和启动应用并查看其外观。你可以在本地计算机、模拟器、仿真器或者在远程设备上调试应用。下面是Visual Studio中的目标设备菜单。

默认情况下,应用在本地计算机上运行。目标设备菜单提供用于在桌面设备上调试应用的多个选项。如模拟器、本地计算机和远程计算机。

在本地计算机上开始调试:

  1. 在Standard工具栏上的目标设备菜单Local Machiine中,确保已选中Local Machine
  2. 单击工具栏或Debug餐单中的Start Debugging按钮或者按F5。
  3. 应用将在窗口中打开,并且将首先显示默认初始屏幕。初始屏幕由一个图像(SplashScreen.png)和背景色(在应用的清单文件中指定)定义。初始屏幕会消失,然后会出现你的应用,外观如下所示:
    按Windows键以打开开始菜单然后显示所有应用。请注意,本地部署应用会将其添加到开始菜单,若要稍后再次运行该应用,请在开始菜单中点击。至此已经生成了第一个UWP应用!
  4. 停止调试:单击工具栏中的Stop Debugging或者在Debug菜单中单击Stop Debugging或者关闭应用窗口。

四、事件处理程序

事件处理程序听起来很复杂,但它只是事件发生,如用户单击按钮时调用的代码的另一个名称。双击设计画布中的按钮控件,让Visual Studio为该按钮创建事件处理程序。也可以手动创建所有代码。

编辑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创建的一个语音合成对象,提供给该对象一些要说的文本。运行该应用并单击按钮时,计算机或手机会逐字的说出“Hello World”。


观看下方视频了解更多详细信息:


想要购买Visual Studio正版授权,或者获取更多该产品相关信息的朋友可以点击" 咨询在线客服 "~

本站文章除注明转载外,均为本站原创或翻译。
欢迎任何形式的转载,但请务必注明出处,尊重他人劳动成果
文章转载自: https://docs.microsoft.com/zh-cn/windows/uwp/get-started/create-a-hello-world-app-xaml-universal

用户评论: 您的宝贵经验,能为更多人带来帮助,登录后才能评论。
评论加载中...


    相关产品
    相关商家