初識Windows8應用商店開發

 Windows8從消費者預覽版到RTM版的發佈讓微軟成了2012年最受關注的公司，同時這也引發了不少的開發者的興趣，今天本文將介紹windows 8 開發環境的搭建以及Windows 8 下的第一個程序 HelloWorld。

 

---------------------------------華麗的分割線-----------------------------------------

1、Windows 8 開發環境的搭建

 Windows 8 的開發須要一臺裝有Windows 8 的機器，以及visual studio 2012

  這裏我下的是window 8 rtm 企業版 以及visual studio 2012 旗艦版 由於我是學生開發者因此我是在官方網站下的，這裏給出我度娘出的結果

   Windows 8 專業版32位 http://kuai.xunlei.com/d/BLDJTTBZXIBV

   Windows 8 專業版64位 http://kuai.xunlei.com/d/VURJIOVUVELH

    Visual Studio 2012 專業版 http://www.iplaysoft.com/vs2012.html

 

2、HelloWord建立

   a.先給出Window 8 的截圖

 

 

b、在起始頁選項卡中，選擇新建項目來建立HelloWorld，也能夠從文件菜單->新建->項目來建立。

以下圖，模版選擇Visual C# Windows 應用商店應用，右邊選擇(XAML)，而後在下面輸入項目名稱，路徑和解決方案名稱，最後點擊肯定，就建立好了一個最簡單的Metro App。

c.而後咱們就看到了最熟悉的vs的界面

 

e.右側咱們看到工程的組織文件

 

 

從上圖中，能夠看到有以下文件和目錄：

1)Properties

2)引用

3)Assets

4)Common

5)App.xaml

6)MainPage.xaml

7)Package.appemanifest

1)Properties目錄下的文件Assembly.cs主要存放有關程序集的常規信息和程序的版本信息

 

 

2)引用，從上面的圖中，咱們看到默認有兩個引用：.NET for Metro style apps和Windows

Metro 應用使用簡裝版的.NET框架庫。咱們能夠雙擊Reference查看看到他們對應的命名空間。

 

3)Assets，該目錄下主要存放程序使用到的Logo，啓動畫面等信息。

 

4)Common裏面有一個文件：

StandardStyles.xaml，它是一個資源文件，它與App.xaml文件進行關聯的。其中包含了一些Style和Template，經過這個文件，咱們建立應用會變得更容易。
下面我分別摘取了一個Style和Template。

 

 

 這是定義的style

<Style x:Key="BasicRichTextStyle" TargetType="RichTextBlock">
    <Setter Property="Foreground" Value="{StaticResource ApplicationForegroundThemeBrush}"/>
    <Setter Property="FontSize" Value="{StaticResource ControlContentThemeFontSize}"/>
    <Setter Property="FontFamily" Value="{StaticResource ContentControlThemeFontFamily}"/>
    <Setter Property="TextTrimming" Value="WordEllipsis"/>
    <Setter Property="TextWrapping" Value="Wrap"/>
    <Setter Property="Typography.StylisticSet20" Value="True"/>
    <Setter Property="Typography.DiscretionaryLigatures" Value="True"/>
    <Setter Property="Typography.CaseSensitiveForms" Value="True"/>
</Style>

 這是定義的數據顯示的模版

<DataTemplate x:Key="Standard130ItemTemplate">
    <Grid Height="110" Margin="6">
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="Auto"/>
            <ColumnDefinition Width="*"/>
        </Grid.ColumnDefinitions>
        <Border Background="{StaticResource ListViewItemPlaceholderBackgroundThemeBrush}" Width="110" Height="110">
            <Image Source="{Binding Image}" Stretch="UniformToFill"/>
        </Border>
        <StackPanel Grid.Column="1" VerticalAlignment="Top" Margin="10,0,0,0">
            <TextBlock Text="{Binding Title}" Style="{StaticResource TitleTextStyle}" TextWrapping="NoWrap"/>
            <TextBlock Text="{Binding Subtitle}" Style="{StaticResource CaptionTextStyle}" TextWrapping="NoWrap"/>
            <TextBlock Text="{Binding Description}" Style="{StaticResource BodyTextStyle}" MaxHeight="60"/>
        </StackPanel>
    </Grid>
</DataTemplate>

5)App.axml
App.xaml 文件和它對應的代碼文件是 App.xaml.cs，用於啓動 Metro App。這個 XAML 文件的主要用途是與 Common 文件夾中的StandardStyles.xaml進行關聯。以下代碼所示

 

<Application
    x:Class="App.App"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App">

    <Application.Resources>
        <ResourceDictionary>
            <ResourceDictionary.MergedDictionaries>

                <!--
                    用於定義平臺外觀的共同方面的樣式
                    Visual Studio 項目和項模板所必需的
                 -->


            </ResourceDictionary.MergedDictionaries>

        </ResourceDictionary>
    </Application.Resources>
</Application>

注意這裏

<ResourceDictionary Source="Common/StandardStyles.xaml"/>

這一句將Common文件夾下的StandardStyles.xaml註冊到App.xaml 中一邊其餘成員可使用定義的樣式 以及數據顯示的模版

對應App.xaml 有一個App.xaml.cs

 

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;

// 「空白應用程序」模板在 http://go.microsoft.com/fwlink/?LinkId=234227 上有介紹

namespace App
{
    /// <summary>
    /// 提供特定於應用程序的行爲，以補充默認的應用程序類。
    /// </summary>
    sealed partial class App : Application
    {
        /// <summary>
        /// 初始化單一實例應用程序對象。這是執行的創做代碼的第一行，
        /// 邏輯上等同於 main() 或 WinMain()。
        /// </summary>
        public App()
        {
            this.InitializeComponent();
            this.Suspending += OnSuspending;
        }

        /// <summary>
        /// 在應用程序由最終用戶正常啓動時進行調用。
        /// 當啓動應用程序以執行打開特定的文件或顯示搜索結果等操做時
        /// 將使用其餘入口點。
        /// </summary>
        /// <param name="args">有關啓動請求和過程的詳細信息。</param>
        protected override void OnLaunched(LaunchActivatedEventArgs args)
        {
            Frame rootFrame = Window.Current.Content as Frame;

            // 不要在窗口已包含內容時重複應用程序初始化，
            // 只需確保窗口處於活動狀態
            if (rootFrame == null)
            {
                // 建立要充當導航上下文的框架，並導航到第一頁
                rootFrame = new Frame();

                if (args.PreviousExecutionState == ApplicationExecutionState.Terminated)
                {
                    //TODO: 從以前掛起的應用程序加載狀態
                }

                // 將框架放在當前窗口中
                Window.Current.Content = rootFrame;
            }

            if (rootFrame.Content == null)
            {
                // 當未還原導航堆棧時，導航到第一頁，
                // 並經過將所需信息做爲導航參數傳入來配置
                // 參數
                if (!rootFrame.Navigate(typeof(MainPage), args.Arguments))
                {
                    throw new Exception("Failed to create initial page");
                }
            }
            // 確保當前窗口處於活動狀態
            Window.Current.Activate();
        }

        /// <summary>
        /// 在將要掛起應用程序執行時調用。在不知道應用程序
        /// 將被終止仍是恢復的狀況下保存應用程序狀態，
        /// 並讓內存內容保持不變。
        /// </summary>
        /// <param name="sender">掛起的請求的源。</param>
        /// <param name="e">有關掛起的請求的詳細信息。</param>
        private void OnSuspending(object sender, SuspendingEventArgs e)
        {
            var deferral = e.SuspendingOperation.GetDeferral();
            //TODO: 保存應用程序狀態並中止任何後臺活動
            deferral.Complete();
        }
    }
}

 在上面的代碼中，有三個方法

public App()
    該方法用於初始化一個應用程序，咱們所寫的代碼，這裏是首先被執行的，邏輯上等價於main() 或WinMain()。

protected override void OnLaunched(LaunchActivatedEventArgs args)
    當用戶正常狀況下啓動完畢了程序，該方法會被調用。固然，也有其它狀況下，該方法會被調用，例如：當啓動程序以打開指定的文件，或者顯示搜索結果，等等。

private void OnSuspending(object sender, SuspendingEventArgs e)
    當程序被停止時，該方法會被調用。

應用程序的生命週期主要就是經過App.xaml.cs文件進行處理的，關於Metro App的生命週期，在後面的學習中，我會進行介紹。如今你只須要知道OnLanunched方法是在程序啓動的時候被調用的。在該方法中，會建立並加載MainPage的一個實例，做爲應用程序的主入口。

6.MainPage.xaml 是用來定義咱們運行時，看到的界面，這是默認生成的，固然咱們能夠本身定義開始的導航界面。

 

<Page
    x:Class="App.MainPage"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:local="using:App"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    mc:Ignorable="d">

    <Grid Background="{StaticResource ApplicationPageBackgroundThemeBrush}">

    </Grid>
</Page>

這是我第一次接觸到XAML，可是我的以爲只要有地XML或者HTML經驗的人看XAML的時候應該是沒什麼大問題

在這裏MainPage.xaml就是在包含了一個Grid的控件

固然這裏的MainPage.xaml也包含一個隱藏的文件MainPage.xaml.cs

 

using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
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;

namespace App
{
    public sealed partial class MainPage : Page
    {
        public MainPage()
        {
            this.InitializeComponent();
        }

        protected override void OnNavigatedTo(NavigationEventArgs e)
        {
        }
    }
}

這裏MainPage()是用來初始化用的，OnNavigatedTo方法則是當該頁面顯示在某個位置的時候，會被調用。

7)Package.appemanifest

最後咱們來看看文件Package.appemanifest 。

這是一個提供Metro App信息給Windows runtime的XML文件。信息主要包括：程序顯示名稱、入口點、支持的旋轉、徽標等。

 

3、運行 和 調試

 

一、如圖我利用了visual studio 2012提供的界面設計工具 給空白頁上添加了一個TextBlock控件並添加上文字，這樣就算給這個HelloWorld程序設計好了界面（PS：雖然很醜）

 

點擊下面的按鈕 

 

 這樣咱們就成功地完成了世界上「最偉大」的程序