体验Win8 Metro应用开发

装了Windows8 Consumer Preview和Visual Studio 2011 Beta，体验一把Metro风格应用开发，先写个HelloWorld试试。

Metro Style App支持多种开发方式，包括：

    XAML/C# 或 XAML/VB.Net

    HTML/JS

    XAML/C++

    DirectX/C++

也可以把几种技术混合起来进行开发，我用XAML/C#先试一下。

1、建工程

在Win8环境下，建工程时能看到有Windows Metro style，这个选项在非Win8的环境下是看不到的。建个Blank Application吧，这个最简单。

<a href="http://blog.51cto.com/attachment/201205/142226159.png" target="_blank"></a>

2、写界面XAML（BlankPage.xaml）

只放两个TextBlock，显示文本信息用。

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

<code>&lt;</code><code>Page</code> 

<code>    </code><code>x:Class</code><code>=</code><code>"HelloWorld.BlankPage"</code> 

<code>    </code><code>xmlns</code><code>=</code><code>"http://schemas.microsoft.com/winfx/2006/xaml/presentation"</code> 

<code>    </code><code>xmlns:x</code><code>=</code><code>"http://schemas.microsoft.com/winfx/2006/xaml"</code> 

<code>    </code><code>xmlns:local</code><code>=</code><code>"using:HelloWorld"</code> 

<code>    </code><code>xmlns:d</code><code>=</code><code>"http://schemas.microsoft.com/expression/blend/2008"</code> 

<code>    </code><code>xmlns:mc</code><code>=</code><code>"http://schemas.openxmlformats.org/markup-compatibility/2006"</code> 

<code>    </code><code>mc:Ignorable</code><code>=</code><code>"d"</code><code>&gt; </code>

<code> </code> 

<code>    </code><code>&lt;</code><code>Grid</code> <code>Background</code><code>=</code><code>"{StaticResource ApplicationPageBackgroundBrush}"</code><code>&gt; </code>

<code>        </code><code>&lt;</code><code>StackPanel</code><code>&gt; </code>

<code>            </code><code>&lt;!--在界面上放两个TextBlock，一个显示Hello World，一个显示时间--&gt;</code> 

<code>            </code><code>&lt;</code><code>TextBlock</code> <code>FontSize</code><code>=</code><code>"60"</code> <code>HorizontalAlignment</code><code>=</code><code>"Center"</code> <code>Margin</code><code>=</code><code>"0,200,0,0"</code><code>&gt;Hello World!&lt;/</code><code>TextBlock</code><code>&gt; </code>

<code>            </code><code>&lt;</code><code>TextBlock</code> <code>Name</code><code>=</code><code>"txtCurrentTime"</code> <code>FontSize</code><code>=</code><code>"48"</code> <code>HorizontalAlignment</code><code>=</code><code>"Center"</code> <code>Margin</code><code>=</code><code>"0,50,0,0"</code><code>&gt;&lt;/</code><code>TextBlock</code><code>&gt; </code>

<code>        </code><code>&lt;/</code><code>StackPanel</code><code>&gt; </code>

<code>    </code><code>&lt;/</code><code>Grid</code><code>&gt; </code>

<code>&lt;/</code><code>Page</code><code>&gt;</code>

3、写代码（BlankPage.xaml.cs）

在OnNavigatedTo方法中写几行代码，让界面上第二个TextBlock显示当前时间。

<code>protected</code> <code>override</code> <code>void</code> <code>OnNavigatedTo(NavigationEventArgs e) </code>

<code>{ </code>

<code>    </code><code>//建个定时器，每秒更新一下txtCurrentTime的Text为当前时间 </code>

<code>    </code><code>var</code> <code>timer = </code><code>new</code> <code>DispatcherTimer(); </code>

<code>    </code><code>timer.Interval = TimeSpan.FromSeconds(1); </code>

<code>    </code><code>timer.Tick += (sender, args) =&gt; { </code>

<code>        </code><code>txtCurrentTime.Text = DateTime.Now.ToString(); </code>

<code>    </code><code>}; </code>

<code>    </code><code>timer.Start(); </code>

<code>}</code>

OK了，Ctrl+F5跑一下，效果如下：

<a href="http://blog.51cto.com/attachment/201205/142739631.png" target="_blank"></a>

PS：在Win8上开发Metro应用，需要先注册一个开发者许可。

     本文转自 BoyTNT 51CTO博客，原文链接：http://blog.51cto.com/boytnt/859804，如需转载请自行联系原作者