Windows 10开发 - 第一个应用程序

在本章中,我们将在Windows 10上使用XAML和C#在Universal Windows Platform(UWP)中创建我们的第一个简单应用程序"Hello world".我们将演示如何创建单个UWP应用程序在Visual Studio中可以在任何Windows 10设备上运行和执行.

让我们按照下面给出的步骤开始创建应用程序.

  • 启动Visual Studio 2015.

  • 单击文件菜单选择新建>项目.

First App

  • 将显示以下新建项目对话框窗口.您可以在对话框的左侧窗格中看到不同类型的模板.

空白应用

  • 在左侧窗格中,您可以看到树状视图.从模板>中选择通用模板 Visual C#> Windows .

  • 从中心窗格中,选择空白应用程序(通用Windows)模板

  • 名称字段中写下 UWPHelloWorld ,为项目命名.

  • 点击确定创建一个新的UWP项目.

UWP Project

  • 你可以看到新创建的项目解决方案资源管理器.

  • 这是一个空白的应用程序,但它包含许多文件,这是任何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项目中,设计窗口上提供了设备预览选项,您可以在其帮助下轻松更改布局,以适应您为应用程序定位的设备系列中所有设备的屏幕尺寸.

设备预览

  • 您可以在本地计算机,模拟器上运行和测试您的应用程序或模拟器,或在远程设备上.您可以从以下菜单中选择目标设备,如下所示 :

UWP本地机器

  • 让我们在本地机器上运行上面的代码,你会看到以下窗口.现在,在文本框中写下任何名称,然后单击按钮单击我.

本地机器

  • 现在,如果你想测试你的应用程序在模拟器中,您可以从菜单中选择特定的模拟器并执行您的应用程序.您将看到以下模拟器 :

Emulator

我们建议您使用不同的设备执行上述应用程序.