在本章中,我们将在Windows 10上使用XAML和C#在Universal Windows Platform(UWP)中创建我们的第一个简单应用程序"Hello world".我们将演示如何创建单个UWP应用程序在Visual Studio中可以在任何Windows 10设备上运行和执行.
让我们按照下面给出的步骤开始创建应用程序.
启动Visual Studio 2015.
单击文件菜单选择新建>项目.
将显示以下新建项目对话框窗口.您可以在对话框的左侧窗格中看到不同类型的模板.
在左侧窗格中,您可以看到树状视图.从模板>中选择通用模板 Visual C#> Windows .
从中心窗格中,选择空白应用程序(通用Windows)模板
在名称字段中写下 UWPHelloWorld ,为项目命名.
点击确定创建一个新的UWP项目.
你可以看到新创建的项目解决方案资源管理器.
这是一个空白的应用程序,但它包含许多文件,这是任何UWP应用程序的最低要求.
MainPage.xaml 和 MainPage.xaml.cs 在您执行应用程序时运行.
默认情况下, MainPage.xaml 文件包含以下信息.
<Page x:Class = "UWPHellowWorld.MainPage" xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local = "using:UWPHellowWorld" xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable = "d"> <Grid Background = "{ThemeResource ApplicationPageBackgroundThemeBrush}"> </Grid> </Page>
以下是 MainPage.xaml.cs中可用的默认信息.
using System; using System.Collections.Generic; using System.IO; using System.Linq; using System.Runtime.InteropServices.WindowsRuntime; using Windows.Foundation; using Windows.Foundation.Collections; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Controls.Primitives; using Windows.UI.Xaml.Data; using Windows.UI.Xaml.Input; using Windows.UI.Xaml.Media; using Windows.UI.Xaml.Navigation; // The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409 namespace UWPHellowWorld { /// <summary> /// An empty page that can be used on its own or navigated to within a Frame. /// </summary> public sealed partial class MainPage : Page { public MainPage(){ this.InitializeComponent(); } } }
让我们添加一些文本块,一个文本框和一个按钮,如下面的XAML代码所示.
<Page x:Class = "UWPHellowWorld.MainPage" xmlns = "http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x = "http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local = "using:UWPHellowWorld" xmlns:d = "http://schemas.microsoft.com/expression/blend/2008" xmlns:mc = "http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable = "d"> <Grid Background = "{ThemeResource ApplicationPageBackgroundThemeBrush}"> <StackPanel HorizontalAlignment = "Center"> <TextBlock Text = "Hello, world!" Margin = "20" Width = "200" HorizontalAlignment = "Left"/> <TextBlock Text = "Write your name." Margin = "20" Width = "200" HorizontalAlignment = "Left"/> <TextBox x:Name = "txtbox" Width = "280" Margin = "20" HorizontalAlignment = "Left"/> <Button x:Name = "button" Content = "Click Me" Margin = "20" Click = "button_Click"/> <TextBlock x:Name = "txtblock" HorizontalAlignment = "Left" Margin = "20"/> </StackPanel> </Grid> </Page>
下面给出了C#中的点击事件按钮.
using System; using System.Collections.Generic; using System.IO; using System.Linq; using System.Runtime.InteropServices.WindowsRuntime; using Windows.Foundation; using Windows.Foundation.Collections; using Windows.UI.Xaml; using Windows.UI.Xaml.Controls; using Windows.UI.Xaml.Controls.Primitives; using Windows.UI.Xaml.Data; using Windows.UI.Xaml.Input; using Windows.UI.Xaml.Media; using Windows.UI.Xaml.Navigation; // The Blank Page item template is documented at http://go.microsoft.com/fwlink/?LinkId=402352&clcid=0x409 namespace UWPHellowWorld { /// <summary> /// An empty page that can be used on its own or navigated to within a Frame. /// </summary> public sealed partial class MainPage : Page { public MainPage() { this.InitializeComponent(); } private void button_Click(object sender, RoutedEventArgs e) { if (txtbox.Text != "") txtblock.Text = "Hello: " + txtbox.Text; else txtblock.Text = "You have not write your name"; } } }
在UWP项目中,设计窗口上提供了设备预览选项,您可以在其帮助下轻松更改布局,以适应您为应用程序定位的设备系列中所有设备的屏幕尺寸.
您可以在本地计算机,模拟器上运行和测试您的应用程序或模拟器,或在远程设备上.您可以从以下菜单中选择目标设备,如下所示 :
让我们在本地机器上运行上面的代码,你会看到以下窗口.现在,在文本框中写下任何名称,然后单击按钮单击我.
现在,如果你想测试你的应用程序在模拟器中,您可以从菜单中选择特定的模拟器并执行您的应用程序.您将看到以下模拟器 :
我们建议您使用不同的设备执行上述应用程序.