Windows 8 Metro开发学习笔记1

lomg

　　最近开始翻《Programming Windows 6th》这书，翻了几章，开始照着里面的示例写了一下。下面笔记都是基础中的基础，仅作翻译记录。
  1. XAML（读Zemmel）
　　XAML全称eXtensible Application Markup Language，是微软在Vista时代开始使用的新型界面表现语言，Silverlight、WP App和现在的Metro App的界面设计都是利用此语言进行设计的。此语言与XML类似，使用过程比较简单。
　　在Windows 8 Metro App中，界面暂时只能用XAML来设计（本人暂时了解如此）。XAML负责软件界面部分，在界面设计中除了使用XAML标记，还可以使用C#代码。
　　XAML文件编译完成后生成的是*.i.cs文件，从XAML文件中控件标记经过编译后生成C#对象，储存在cs文件中。
　　XAML的使用方便开发者的界面设计，但是在开发过程中我们甚至可以不用任何XAML代码设计界面，下面是一个Demo。可先将项目文件夹下面的XAML以及后台代码cs文件删除，再将下面的代码复制另存为App.cs后，F5编译Debug即可。
using System;
using Windows.ApplicationModel.Activation;
using Windows.Foundation; // 引用坐标命名空间
using Windows.UI;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
using Windows.UI.Xaml.Media;
using Windows.UI.Xaml.Shapes; // 引用形状命名空间
namespace TryStrippedDown
{
public class App: Application
{
static void Main(string[] args)
{
Application.Start((p) => new App());
}
protected override void OnLaunched(LaunchActivatedEventArgs args)
{
// 添加Polyline实例
Polyline polyline = new Polyline
{
Fill = new SolidColorBrush(Colors.White),
HorizontalAlignment = HorizontalAlignment.Center,
VerticalAlignment = VerticalAlignment.Center
};
for (int angle = 0; angle < 3600; angle++)
{
double radians = Math.PI * angle / 180;
double radius = angle / 10;
double x = 360 + radius * Math.Sin(radians);
double y = 360 + radius * Math.Cos(radians);
polyline.Points.Add(new Point(x, y));
}
Window.Current.Content = polyline;
Window.Current.Activate();
}
}
}

2. MVVM：Model-View-ViewModel
　　MVVM的推出，有助于整个应用的前台和后台代码分离，各司其职，减少耦合度。
　　此部分笔记未完待续。



3. Path：BezierSegment、LineSegment和ArcSegment
　　界面设计时，我们难免会要画一些图形之类的来代替图片。至于用绘制的图形来代替图片哪个会更节省资源，这个还要继续深入探讨。但一般来说是绘制的简单图形会更节省资源。
　　绘制图形我们需要使用Windows.UI.Xaml.Shapes这个命名空间，里面有Path这个控件。
　　Path控件定义了一个Data属性（Geometry的一种类型，定义于Windows.UI.Xaml.Media命名空间中），Data属性由一组锚点数字（有用过PS里面的钢笔的都会知道）来组成。
　　Path控件中，可以有以下的PathFigure：

• LineSegment
  
• PolylineSegment
  
• BezierSegment
  
• PolyBezierSegment
  
• QuadraticBezierSegment
  
• PolyQuadraticBezierSegment
  
• ArcSegment
  

　　上面的PathFigure都可以是组成Path各个部分，即整个图形中的分部件。

   


　　Data属性是一串长的字符串，但是可以分行表示不同的部分。

• M代表“Move”移动画图光标，后面紧接着一组(x,y)坐标
  
• L代表直线（准确地说是折线）
  
• C是立方Bezier曲线，后面紧接着控制点和结束点，可以有多个
  
• A是弧线，需要使用弧度（rad）
  

　　若使用后台代码，而非XAML来绘制Path，则在实例化Path对象之后，可以使用XamlReader.Load（包含于Windows.UI.Xaml.Markup命名空间），将XAML字符串转换为图形。局限性在于，XamlReader不能引用事件处理中带入的外部代码。

        Geometry PathMarkupToGeometry(string pathMarkup)
{
string xaml =
&quot;&quot; +
&quot;&quot; + pathMarkup + &quot;&quot;;
Path path = XamlReader.Load(xaml) as Path;
// Detach the pathGeometry from the Path
Geometry geometry = path.Data;
path.Data = null;
return geometry;
}
4. Styles，样式
　　在Xaml文件中，可以对Page定义Resources，来统一使用相关的样式。


Shared Brush with Style











　　也可以于后台代码中定义样式：

Style style = new Style(typeof(TextBlock));
style.Setters.Add(new Setter(TextBlock.FontSizeProperty, 96));
style.Setters.Add(new Setter(TextBlock.FontFamilyProperty,
new FontFamily(&quot;Times New Roman&quot;)));

　　以上定义是对程序中的TextBlock样式进行定义。
　　定义样式的时候，还可以使用样式的继承，利用BaseOn属性。


　　继承之后可对样式进行相应重写，没有重写的部分将继承于之前的样式。
　　当一个样式定义的时候没有定义x:Key的时候，此样式为Implicit Style（隐式样式）。实际上Key值在场景后自动生成了，它是指向TextBlock类的一类RuntimeType的对象（非public类）。【注：此话不知道怎样翻译好，书里面看着不大懂。】
　　当TextBlock控件中没有定义具体的样式名称时，TextBlock将使用隐式样式定义的样式，很强大的功能。
　　注意：新的样式不能继承自隐式样式，但隐式样式则可继承自一个非隐式样式。



5. 数据绑定简述