免责声明:以下内容乃我个人观点,并不代表我公司的意见。我作为一个独立的开发人员,所开发的App属共享资源。
在之前的一篇文章里,我提到过Windows8 版的 TrialTool 。 TrialTool 是一款基于 web 的应用,这款应用充分展示了各种 Javascript 接口的兼容性。它就像是一个接口的容器,任凭你浏览、修改和运行示例。这个版本的 TrialTool 特别展示了各种 Windows8 接口。
1.?背景
这
个应用程序是在Windows?8开发者预览版的Visual?Studio?11特别版上开发的。整个应用程序的开发使用了HTML5,CSS和
JavaScript等语言。这个工具还没有涵盖所有的API,但是用到这些接口是Windows8中编程模型的很好的代表。
?2.?开发环境
我的主要IDE是Eclipse或Cloud9,实际上这是我第一次使用VisulStudiio专门去开发一个端对端的项目。
首 先,在VisualStudio中选择一个预定义的项目类型或者是一个单一空白JS模板。这个模板在创建框架和填充代码上做的很好。正如框架一样,对于一 个新手来说,很难一下浏览大量的文件,这些文件是模板的一部分。一旦你知道关于文件和其部分编辑方式,这个模板都是不错的。不幸的是,看上去,目前 Visual?Studio是我惟一的选择。因为我找不到任何能够用Eclipse或者Notepad++来创建、打包或者部署的命令行应用程序。
?3.?写代码
创建一个空白项目跟从头写一个网页是一样的。首先我们用到的模板是Metro?Style?UI 。TrialTool 使用Grid布局模板,此模板是从一个显示项目清单的“索引”页面开始。通过点击每个细目可以将我们带到下一层“细节”页面。
JavaScript?文件是通过模板创建的,我推荐使用严格的方式。
?3.1单页面应用程序
APP 的创建本质上相当于一个单页网站。使用导航浏览网页的时候,从“索引”页面到“细节”页面,导致细节内容作为DOM的一部分被加载。加载和卸载事件使得我 们能够控制每个操作显示的内容。WinJS模块定义的事件,让我们访问这个操作或DOM的片段作为导航加载事件,除此之外还有事件的布局变化(画出平板美 化模式,调整大小,等等),我注意到,在默认情况下,HTML,CSS和JS的文件类型各含有一个目录。我更喜欢通过模块而不是文件类型来给文件分类,文 件类型根据他们的扩展来进行区分。
?3.2?CSS网格
使用ms-grid来定义metro?UI非常棒。CSS 网 格布局的仍需改进。Tiles是一个主要的metro?UI,并且 ms-gri的实现使得在MetroUI中创建平铺的样式更加简单。
?3.3?数据绑定
该模板也支持数据绑定。通过在HTML标签中,使用data-win-*属性使得视图可以被定义。这些渲染视图可以定义具体的控件(如?ListView),和这些控件的选择。通过AJAX和使用这些“itemRenderers”,JSON数据可以被加载。
这里用到的思想类似于框架,例如Backbone。然而,不像BockBone,当数据改变时自动改变视图这样类似的功能,需要明确的编码。把itemRender指向URL的方式会更好。
另一个我非常喜欢的功能是,能够在item?render中声明格式。目前,模型中的数据可以被转换,但这看起来像人为的。使用特定元素的data-win-option来指定格式也非常棒。
3.4?Promises
所有异步操作(如AJAX,读取文件等等)似乎都返回promise。对互动事件驱动应用程序来说,这肯定是很好的,在C#中“async”也是一样的。
我们可以得到更好的承诺文件,看起来,文件是为C#和安装JavaScript写的.例如,像FilePicker这样的操作,返回值是一个promise。然而,看看实际传递给?promise.then()?method的参数,你可以导航到“GetResults ”方法。
?4.windows8的接口
开发win8 应用的最主要原因就是我可以使用 win8 接口,另外一个原因就是,这个 App 也是 MetroIE 能够打开的一个网站。
在JavaScript 中添加本地 win8 接口,跟用本地 DOM 方法调用 DOM 是一样的。 Windows8 弹窗和调用本地警示窗口时一样的。使用本地文件接口,或者加密都是非常简单明了的。
有关Windows?Runtime 的接口的文档非常详尽,但是如果他们分组的更好,并且第一个列表有高等级的类别(像 Storage ),这样你就可以深入了解特定的 API ( Bulk?Access 或 File?properties ),这样的情况我会觉得很舒服。自从很多 API 有了共同的概念之后,这对我们看特定的 API 是很有帮助的。
我发现另外一个问题是,在Javascript? 语言中 API 所需的功能都没有。举个例子,读取文件的内容返回一个 ?InputStream ?,这时似乎并没有显示任何Javascript 的 API 。实际上 DataReader 可以用来读取数据,这点上并不是很清楚。
我希望这些API 可以成为类似 HTML5?FILE/Blob 的 API 。
5.调试
使用Visual?Studio 进行调试非常棒,以至于你真的忽视 Firebug 和 Web?Developer 了。从类似于支持记录断点这样的基本功能到察看 HTML 源代码,调试器都非常强大。为了有更好的经验我会推荐一个双显示器设置。
我发现其中一个不足的功能是,配置(如Speed?Trace ) Javascript?APP来 解决其性能问题的方式。添加意向单也是调试应用程序的一种手段,(例如 Opera?dragonfly ,这也是我喜欢的一个 IE 的功能)。远程调试证明在平板案例中很有用。
通过console.log 打印带来的烦恼仍然存在。如果我们在产品部署中,能把 console.log 和 Windows 应用或系统日志整合在一起会更好。
6.打包和部署
虽然VisualStudio 中有一个存储菜单,但是看上去存储功能并不可用。现在唯一可用的选择是创建一个本地 App 。把这个 App 打包成一个 appx 文件,一个压缩文件和一个验证文件。用 Admin 身份执行这个压缩文件安装这个应用。
7.结论
对于web 开发者来说,选择用 HTML 、 CSS 或者 JS 来开发 windows8 应用非常有吸引力。现有的 web 开发知识可以用在这,但是为了平衡操作系统的,最后熟悉 windows8 提供的接口。
总的来说,这是一个非常强大的方法,把web 开发变成本地应用。希望对于 web 开发者来说,开发 Android 和 iOS 也这样简单。
原文链接:Developing Apps for Windows 8
?
?