博客园客户端(Universal App)开发随笔 - UAP中的项目和目录组织

前言

本篇随笔主要是分享一下做一个Universal App的目录组织结构，说明什么样的结构才能适合一个团队开发，使开发成员之间的相互影响最小。这些组织好的项目和目录会成为一个公共的规约，大家都能知道什么东西应该放在哪里，或者在什么地方能找到什么功能。这对于避免重复写code或者最大限度地复用code来说是至关重要的。

这种工程结构和目录划分虽然没有什么理论基础，但是是经过我们很多项目的经验总结出来的，如果是个人开发者，也严重建议参考此组织结构，能够帮助你理清思路，做好功能设计和类设计。

项目组织

开发一个Universal App, 如果前篇所说，基本框架在VS里有了(对不起我这里不小心装了个英文版)，先选Universal Apps，再选Blank App，再把App1改成CNBlogs，就可以猛击OK了。

它缺省会帮你建立三个projects：CNBlogs.Windows(Windows 8.1)和CNBlogs.WindowsPhone(Windows Phone 8.1)。还有一个特殊的CNBLogs.Shared，扩展名为.shproj，是被上面两个project共用的。

如果做一个简单的UAP，这三个project就足够了。但是如果涉及到团队开发的较大的项目，还要有其它一些辅助的Project和其下面的一系列Folders才能够应付。如下图所示：

我们建立了以下辅助project：

1）BackgroundTask

2）DataHelper

3）NotificatoinsExtensions

说明如下：

1）BackgroundTask主要完成的任务是后台更新动态磁贴。这个以后我们说到Windows/Phone的后台任务时，会专门解释。

2）DataHelper，里面有两个folder，一个CloudAPI，里面针对每一个DataSource(API接口)都有个一个单独的类来处理，还可以根据各个DataSource的相似度，来抽象更底层的类。另一个是DataModel，就是数据模型类。这个DataHelper我们后续的CloudAPI篇里会仔细说。

3) NotificatoinsExtensions 这个其实不是我们自己写的，是直接从MSDN里的sample里下载的（按照微软的建议，但不明白为什么不做成一个库，而是以源代码形式给出）。这个项目里主要给出了一些帮助方法，来简单地更新磁贴，否则就要直接操作XML数据来更新磁贴，非常容易出错，而且不容易理解。这个以后讲动态磁贴时才细说。

在这个有个问题：为什么DataHelper project不放在Shared里面呢？原因特简单：因为BackgroundTask也需要访问DataHelper, 如果放在Shared里面访问不到，因为Shared只为Windows/WindowsPhone两个Project服务。（如果这里我的理解有什么错误请大虾们指正）

目录组织

我们着重说一下Windows, WindowsPhone, Shared三个Project中的文件夹。

CNBlogs.Windows(Windows 8.1)

1）Assets

里面装着那些图像文件，一般有三类：A) Tile类，只为磁贴而做；B) Image类，只为背景图，装饰图之类的而做；C）Icon类，放在AppBar中的图标。如果项目较大，图像文件较多时，可以在这个文件夹下建立三个子文件夹，分别为Tile, Image, Icon。

2）Common

这个是系统自带的。如果系统没有生成这个文件夹，你在添加一个新的Page时，指定BasicPage，就可以生成它。这个文件夹里有个4个文件，包括了很多帮助函数，供处理Navigation时是使用。轻易不动它。

3）Controls

这里放着你的小宝贝们，就是那些Template Control，或者User Control。如果是Template Control, 这里面只放一个XXXControl.cs; 如果是User Control, 这里面放一个XXXControl.xaml, 下面附带了XXXControl.xaml.cs。关于这两种Control的区别，我们后续有专门的一篇博客讲解。

5）Pages

这里面放着你的大宝贝们，就是那些页面啦。每个页面都有个单独的XAML和其下面附带的.cs文件来描述其样式和行为，以及和其他页面的交互关系。

6）SettingFlyouts

Windows中的设置页面比较特殊，在右面，是一种规约，鼠标右键或者轻扫右侧边框弹出5个系统按钮，按下面的“设置”即可进入某个App自己的设置页面。这些设置页面其实也是用XAML来表现的。

7）Themes

这里放的是Template Control的样式，只有一个Generic.xml，里面放了所有自定义Template Control的样式(User Control不在这里）。不需要把它挪出来放在别的什么地方，别有洁癖，谁知道移到别的地方会出什么错误。

Folder就这些了，各有各的用处，有的是系统建的，有的是你自己建的，目的只有一个，让自己和别人可以很快地找到东西。

有一个地方要注意，就是namespace。如果你在Project上右键添加一个Page, namespace是CNBlogs； 如果在Pages上添加，namespace是CNBLogs.Pages。都可以，但是要统一，否则要出麻烦。

CNBlogs.WindowsPhone(Windows Phone 8.1)

Windows Phone的Folder们和Windows的基本一样，只是最下面的Pages和Views的区别，这个只是习惯问题，您随便。

CNBLogs.Shared

Shared Project有些不一样了，我们细细说来。

1）Assets

如果Windows/Phone有相同的图像资源（样子/颜色/尺寸都相同），可以只放一份在这里。但是目前Windows/Phone的Tile有尺寸上区别，所以Tile部分要分开放。背景图之类的肯定也不一样，一大一小。ICON部分可能会一致，因为Windows和Phone下面的AppBar中AppBarButton大小一样。

2）ControlHelper

这里面一般放置两类cs文件，一类是TemplateSelector，另一类是Converter，就是数据转换类。这个我们在后面的博客中专门讲（记得提醒我，我已经承诺不少东西了）。这两类东西，对于Windows/Phone来说是共用的。

3）FunctionHelper

顾名思义，放的是你自己的通用的帮助函数类。

4）HTML

可有可无，看项目。如果项目中有用到WebView的，也许需要一些初始的HTML或者css。

5）SampleData

对于大多数应用来说，都需要data支持，有的是用本地data，有的用远程data。当data没有到位时（CloudAPI部分还没有完工），你可以先手工制作一些模拟data放这里，不影响开发进度。

6）Strings

这里面放的是Resources, 按国家/市场划分。比如我们只有一个zh-CN子目录，也许还有个ja-JP子目录，里面放着Resources.resw。这个样子的：

所有界面上用到的字符串都扔里面，比如在zh-CN中有个”Title \t 首页”,在en-US中必须有个”Title \t Home“来对应，以便在不同国家显示不同语言。

7）App.xaml和StyleDictionary.xaml

共用的，放这里没事儿。尤其是StyleDictionary.xaml，里面放着所有的颜色，字体，样式等信息，你在Windows上的应用使用蓝底白字，在Windows Phone上要统一用蓝底白字，就靠使用这个文件里的信息了。

小结

在本篇随笔中，我们强调了CloudAPI的重要性，是因为我们从很多成功的App中总结出云端数据和服务支持的重要性; 而削弱了MVVM的重要性，是因为我们从实践中体会到，Model和View都是不可或缺的，但是ViewModel就不是那么重要了，代码重复，可读性差，能替代它的方法很多。至于什么可自动测试性，根本谈不上。开发测试一体，有助于节约成本，提高工作效率，增强开发人员的责任心。

 

你可以从这里下载我们分享的源代码：

https://code.msdn.microsoft.com/CNBlogs-Client-Universal-477943ab

当然更可以直接下载两个App来看效果，但是由于designer介入较晚，所以UI上面还需要完善，我们会持续更新App。

Windows Phone Store App link:

https://www.windowsphone.com/zh-cn/store/app/博客园-uap/500f08f0-5be8-4723-aff9-a397beee52fc

Windows Store App link:

https://apps.microsoft.com/windows/zh-cn/app/c76b99a0-9abd-4a4e-86f0-b29bfcc51059

纯粹干净的App, 里面绝无广告，请放心使用。