手把手玩转win8开发系列课程（26）

ezeke

　　这节我们两个议题①在源代码中改变平铺②在xaml中改变平铺样式
　　（1）在源代码中改变平铺
　　这个平铺系统中最核心的是windows中的ViewStateChanged事件。为了处理事件，你可以重新配置的你的程序，来生成这个事件。下列是源代码所示：


View Code


using Windows.UI.ViewManagement;
using Windows.UI.Xaml;
using Windows.UI.Xaml.Controls;
namespace MetroGrocer.Pages {
//DetailPage类
public sealed partial class DetailPage : Page {
public DetailPage() {
this.InitializeComponent();
// ViewStateChanged 事件 ApplicationView.GetForCurrentView().ViewStateChanged
+= (sender, args) => {
HandleViewStateChange(args.ViewState);
};
}
//处理HandleViewStateChange事件
private void HandleViewStateChange(ApplicationViewState viewState) {
if (viewState == ApplicationViewState.Snapped) {
GridLayout.ColumnDefinitions[0].Width
= GridLengthHelper.FromPixels(0);
} else {
GridLayout.ColumnDefinitions[0].Width
= GridLengthHelper.FromValueAndType(1, GridUnitType.Star);
}
}
}
}
　　处理这个事件是传递这个ApplicationViewStateChangedEventArgs对象，他的Viewstate属性是来自于ApplicationViewState这个迭代器。描述这个当前平铺的对象。这个迭代器是抢购，填充，全屏水平模式和全屏风景模式。这两个模式允许看全屏模式的差异。
　　这个HandleViewStateChange事件是用来适应布局方式，如果这个app是在断裂模式下显示，我把第一行的宽度设置是0. 恢复全屏状态下，他的状态不能自动更新。你也需要用源代码处理状态。 这些状态是除了断裂状态。因此，我重置列的宽度。下图，你也可以看到断裂实现他们之间的状态的变化。

　　
　　（2）在xaml中改变平铺样式
　　你可以在xaml中改变平铺样式，你也发现xaml语法是冗长。因此，他是很难阅读，他也很难处理，因此在真正的开发中，我也推荐你用插入code approach的方法、 但这里我用的是xaml，下图是xaml的源代码。
　　特别提醒，想什么VisualStateManager类别，是wpf中和silverlight中的标准的类，我这里没有提及，你要用心的学习较完全的xaml语言请看具体的wpf文档。
　　这里，源代码如下所示：



1
9
10  
11   
12   
13     
14      
17      
18      
19        0
20      
21      
22   
23     
24   
25   
26     
27      
30      
31        
32          *
33        
34      
35      
36     
37   
38   
39  
40   
41      
42      
43   
44   
45      
46      
47   
48  // …StackPanel elements removed for brevity…
49
50
　　在上述的源代码中，我定义了两个VisualState状态，首先，我得把第一行的宽度置为0，这个状态是断裂视图状态。第二个状态，这是一个其他的视图的状态，这部分无论是xaml的源代码还是C#源代码都很冗长。
　　另外，我得处理ViewStateChanged事件，以至于他能进入xaml的状态，下列是处理的C#源代码




1 using Windows.UI.ViewManagement;
2 using Windows.UI.Xaml;
3 using Windows.UI.Xaml.Controls;
4 namespace MetroGrocer.Pages {
5   public sealed partial class DetailPage : Page {
6     public DetailPage() {
7       this.InitializeComponent();
8       ApplicationView.GetForCurrentView().ViewStateChanged
9         += (sender, args) => {
10    string stateName = args.ViewState ==
11       ApplicationViewState.Snapped ? "Snapped" : "Others";
12      VisualStateManager.GoToState(this, stateName, false);
13        };
14      }
15    }
16 }
　　我调用了静态的VisualStateManager.GoStates使其在xaml定义的状态能够互相切换。这个方法传递的参数是当前页面对象，这一位着你进入了这个状态以后，其中间状态不会显示，直接完成状态之间的切换。最后一个参数为真的时候，代表平铺状态自由切换的时候，能够提供其动画效果。
　　哝——这就是这节的议程。