UAP如何根据DeviceFamily显示不一样的页面

背景

微软推出UAP 推荐使用响应式的UI，可是不免遇到一些特殊状况须要使用不一样的Page来在不一样的设备显示。

 

微软目前最新的VS2015在10074上安装后可以支持这个功能特性，只是暂时没有文档介绍。

我拿到了Demo后整理了一下创建工程的使用这个特性方法：

 

使用方法

1 首先创建一个UAP工程。

 

2 在工程中添加本身的Page 好比 这里在子文件夹Modules/Home 下面创建了一个主页Index.xaml，Tilte为"Universal Page"

 

3 添加DeviceFamily-Desktop 和DeviceFamily-Mobile 2个子目录，这2个目录的名字必须固定

4 将Index.xaml拷贝到DeviceFamily-Desktop 和DeviceFamily-Mobile，删除这2个目录下的Index.xmal.cs 文件。

 

5 修改Desktop下的Tilte 改为 "Desktop Page"

显示效果以下：

 

总结

1. 使用方法为 在Page.xaml的同级目录添加DeviceFamily-Desktop 和DeviceFamily-Mobile 2个子目录。
2. 复制Page.xaml到这2个目录，使Page.xaml.cs 都对于了3个Page.xaml, 系统运行时会经过deviceFamily自动选择对于的Page.xmal，在没有对应的deviceFamily时候会选择原来的Page.xaml.
3. 由于多个Page.xaml 的存在，须要让出现Control的Name 保持一致，这样codebehine使用的时候才能正常工做，若是不一致会出现codebehine使用Name的时候出现null的状况，须要作检查。

4． 对全部Xmal文件都有效，对其余文件包括cs文件都无效

 

编译状况

3种xmal会编译成 3种UI和一个codebehind的对象，根据平台来进行使用。