创建 Windows 应用商店应用 - 入门教程

引言

在本教程中，我们将使用 XAML 和 C# 创建一个非常基础的 Windows Store 应用。由于这是本系列的第一个教程，我将主要关注项目设置和基本工作流程，稍后，在其他即将推出的系列中，我将介绍更高级的概念。因此，在继续之前，让我们讨论一下运行我们的应用程序的环境设置。

先决条件

 为了完成 Windows 8 metro 风格的应用，我们的机器需要以下东西

• 您需要安装 Windows 8 和 Microsoft Visual Studio Express 2012
• 您需要开发者许可证 

创建一个项目

• 启动 Visual Studio 2012。选择 文件 >> 新建项目。将出现“新建项目”对话框窗口，您可以从左侧窗格中选择您选择的模板

在左侧面板中，您可以选择“Windows Store”模板。选择后，中心窗格将显示您为所选模板可用的项目列表。在这里，我们使用空白应用，默认情况下它将不包含任何用户控件。如果需要，我们可以在稍后添加控件。

输入项目的名称和位置，然后按确定按钮。单击确定后，您将看到类似于以下所示的结构

在这里您将看到，您的解决方案包含大量文件。我将尝试简要介绍其中每个项目。

1. Logo.png 和 SmallLogo.png 图像 - 在开始屏幕中显示
2. StoreLogo.png - 在 Windows 商店中代表您的应用
3. SplashScreen.png - 在应用程序启动时显示
4. MainPage.xaml - 运行我们的应用
5. Package.appxmanifest - 描述您的应用并列出您的应用包含的所有文件

以上文件是所有使用 XAML 和 C# 构建的 Windows Store 应用所必需的。

在使用空白应用模板时，我们可以用任何其他页面模板替换我们的空白页面，以便利用布局和其他辅助类。 

替换 MainPage

• 从解决方案资源管理器中右键单击并选择删除来删除 MainPage.xaml
• 选择项目 >> 添加新项目
• 从左侧窗格中选择 Windows Store，然后从中心窗格中选择任何页面模板。在这里，我选择基本页面
• 输入页面名称。在这里，我输入 MainPage.xaml。第一次向空白模板添加新页面时，Visual Studio 将向您显示以下消息

单击“是”以添加这些文件。您将看到，所有新添加的文件都在Common文件夹下。

构建您的应用，现在您将能够在设计视图中看到您的页面。按 F5，您将能够看到您的应用正在运行，如下所示

此时，没有关闭应用的按钮。因此，您可以使用 Alt+F4 关闭它，通常我们不关闭 Windows 应用（其中的原因，我们将在本系列的下一篇文章中看到）。现在按 Windows 键，您将能够看到为您的新应用添加的新磁贴。现在要运行该应用，您可以直接单击或点击该磁贴。这难道不是一个好功能吗？？？

祝贺您构建了您的第一个 Windows 商店应用。

使用 App.xaml

App.xaml 是最重要的文件之一，因为此文件存储了您可以在整个应用程序中访问的内容。双击并打开该文件。您将注意到，它包含一个ResourceDictionary，该文件又引用了StandardStyles.xaml ResourceDictionary。此 StandardStyles.xaml 包含大量样式，这些样式赋予了我们的应用外观

<application.resources>
        <resourcedictionary>
            <resourcedictionary.mergeddictionaries>
                
                <resourcedictionary source="Common/StandardStyles.xaml">
            </resourcedictionary>
        </resourcedictionary.mergeddictionaries>
 </resourcedictionary></application.resources>

 现在转到 App.xaml 的代码隐藏文件。它包含一个构造函数，该构造函数调用 InitializeComponent() 方法。这是一个自动生成的方法，其主要目的是初始化在 xaml 文件中声明的所有元素。它还包含暂停和激活方法，如下所示

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using Windows.ApplicationModel;
using Windows.ApplicationModel.Activation;
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 Application template is documented at http://go.microsoft.com/fwlink/?LinkId=234227

namespace HelloWorldSample
{
    /// <summary>
    /// Provides application-specific behavior to supplement the default Application class.
    /// </summary>
    sealed partial class App : Application
    {
        /// <summary>
        /// Initializes the singleton application object.  This is the first line of authored code
        /// executed, and as such is the logical equivalent of main() or WinMain().
        /// </summary>
        public App()
        {
            this.InitializeComponent();
            this.Suspending += OnSuspending;
        }
 
        /// <summary>
        /// Invoked when the application is launched normally by the end user.  Other entry points
        /// will be used when the application is launched to open a specific file, to display
        /// search results, and so forth.
        /// </summary>
        /// <param name="args" />Details about the launch request and process.
        protected override void OnLaunched(LaunchActivatedEventArgs args)
        {
            Frame rootFrame = Window.Current.Content as Frame;
 
            // Do not repeat app initialization when the Window already has content,
            // just ensure that the window is active
            if (rootFrame == null)
            {
                // Create a Frame to act as the navigation context and navigate to the first page
                rootFrame = new Frame();
 
                if (args.PreviousExecutionState == ApplicationExecutionState.Terminated)
                {
                    //TODO: Load state from previously suspended application
                }
 
                // Place the frame in the current Window
                Window.Current.Content = rootFrame;
            }
 
            if (rootFrame.Content == null)
            {
                // When the navigation stack isn't restored navigate to the first page,
                // configuring the new page by passing required information as a navigation
                // parameter
                if (!rootFrame.Navigate(typeof(MainPage), args.Arguments))
                {
                    throw new Exception("Failed to create initial page");
                }
            }
            // Ensure the current window is active
            Window.Current.Activate();
        }
 
        /// <summary>
        /// Invoked when application execution is being suspended.  Application state is saved
        /// without knowing whether the application will be terminated or resumed with the contents
        /// of memory still intact.
        /// </summary>
        /// <param name="sender" />The source of the suspend request.
        /// <param name="e" />Details about the suspend request.
        private void OnSuspending(object sender, SuspendingEventArgs e)
        {
            var deferral = e.SuspendingOperation.GetDeferral();
            //TODO: Save application state and stop any background activity
            deferral.Complete();
        }
    }
}

现在转到 MainPage.xaml。此文件定义了您的应用的用户界面。在此文件的代码隐藏中，您将注意到它使用LayoutAwarePage，该类扩展了 Page 类，并提供了用于导航、视图管理和页面管理的各种方法。在 MainPage.xaml.cs 文件中，您可以为您的应用程序添加逻辑和事件处理程序。基本页面模板有两个方法，您可以使用它们来保存和加载页面状态。

>

 protected override void LoadState(Object navigationParameter, Dictionary<string,string> pageState)
  {
    }
 
 protected override void SaveState(Dictionary<string,string> pageState)
 {
   }

向 MainPage.xaml 添加内容

从解决方案资源管理器中打开 MainPage.xaml。现在，如果您想添加更多内容，只需打开 xaml 并开始添加即可，如下所示

<stackpanel margin="120,80,0,0" grid.row="1">
                <textblock width="Auto" height="29" text="Welcome to my first windows store app"> 
            </textblock></stackpanel>

g

 

按 F5 运行您的应用程序，您将看到以下更改

希望本材料对初学者来说是一个很好的开始。