一、将 Windows 8 放在上下文中

Windows 8 代表着微软希望突破传统桌面计算市场,并在移动世界中产生影响,移动世界一直由安卓设备,当然还有苹果产品主导。

微软的计划是为用户提供跨设备的一致性,允许相同的应用对用户的数据进行操作,而不管用户手边有哪种设备或哪种设备。这对许多用户来说很有吸引力,它利用了微软最大的素材——在桌面计算市场的领先地位——来推动平板电脑和智能手机市场的销售、接受度和可信度。

传统的 Windows 桌面对于不同类型的设备之间的一致性来说不是一个好的模型,并且为更小的屏幕添加触摸支持和重新设计界面的尝试也没有好结果。试图将旧的 Windows 模式扩展到小型设备上是微软之前进军移动世界失败的部分原因。

这就是 Windows 应用的用武之地。微软决定创建一个新的应用模型,而不是延续现有的应用模型。Windows Store 应用,通常被称为应用,可以在任何可以运行 Windows 8 及其衍生产品(Windows Phone 8、Windows RT 等)的设备上使用。).更重要的是,Windows 应用在配有鼠标和键盘的大屏幕台式机上运行得和在中等大小的触摸屏平板电脑上一样好。Windows Store 应用与常规的 Windows 桌面应用大相径庭:它们充满了屏幕,没有标题栏和按钮,具有完全不同的外观和感觉。

微软的另一个重大突破是,你可以使用网络技术来创建应用,这是我写这本书的原因,也很可能是你阅读这本书的原因。通过拥抱 HTML、CSS 和 JavaScript,微软拥抱了一个全新的开发人员社区,他们可以将自己的 web 应用开发知识应用到 Windows 应用开发中。

images 微软使用了 Windows Store App 这个术语,我觉得这个术语很别扭,我无法让自己在整本书中使用它。相反,我会提到 Windows 应用,通常只是简单的应用。我会让你在心里插入你认为合适的微软官方名称。

将应用开发置于背景中

Windows 应用是微软努力在一系列不同设备类型上提供一致用户体验的核心,包括传统的台式电脑、平板电脑和智能手机。Windows 应用提供快速流畅的用户交互,支持触摸和键盘/鼠标输入,并紧密集成到微软的云服务中,允许用户在他们工作的任何地方和他们使用的任何设备上复制他们的数据。

应用与传统的 Windows 桌面应用非常不同。默认情况下,Windows 8 应用充满屏幕,是 chromeless (这意味着没有周围的窗口、标题栏或按钮),不能像桌面应用那样调整大小或重叠。用户不关闭应用,也没有关闭或退出按钮。一次只显示一个应用,因此不需要窗口或标题栏。

需要用户输入的关键对话框,比如文件选择器,也是全屏的,就像迷你应用一样。事实上,它们的外观和感觉很像你可能在 iPhone、iPad 或 Android 设备上看到的应用——这当然不是偶然的。通过 Windows 8,微软旨在获得利润丰厚的智能手机和平板电脑市场,并希望通过在包括普通个人电脑在内的各种平台上提供应用来利用其在桌面世界的主导地位。

应用受益于一系列集成服务,称为契约,这使得创建紧密集成到 Windows 平台的应用变得容易,并且可以与其他应用共享数据。如果你刚刚安装了 Windows 8,并且一直想知道 Charm Bar 上的一些图标是干什么用的,那就不要再想了。应用通过 Charm Bar 使用契约向用户提供服务。当您刚接触 Windows 时,这可能看起来是一个笨拙的工具,但它很快就会成为您的第二天性。

使用 JavaScript 和 HTML 开发 Windows 应用

微软 Windows 8 最大的改变之一是让 JavaScript 和 HTML 成为应用开发的一等公民。这是一件大事,原因有二:第一是微软在。NET 平台多年来一直不愿意为不属于. NET 平台的工具和语言开放 Windows 开发。NET 家族,比如 C#。Windows 8 彻底改变了这一点。

第二个原因是微软坚持标准。您用来编写 web 应用的 JavaScript 和 HTML 与您用来编写 Windows 应用的 JavaScript 和 HTML 是相同的。仍然有新的库和技术需要学习——因此有了这本书——但是如果你已经开发了一个 web 应用,那么你已经拥有了应用开发所需的大量知识和经验。我在第 3 章中演示了这一点,我将向你展示如何使用普通的 JavaScript 和 HTML 创建你的第一个应用。这种网络驱动的主题根深蒂固:用 JavaScript/HTML 编写的应用是使用 Internet Explorer 10 执行的(尽管这对用户来说并不明显,因为他们无法判断你使用了哪种技术来创建你的应用)。你不能改变使用哪个浏览器来执行你的应用,但过一段时间后,你就不会真的想这么做了——IE10 非常好,对新的 HTML5 和 CSS3 功能有一些很好的支持。(有一些特定于微软的扩展,但它们出现在 W3C 标准仍在开发中或特性非常特定于应用的情况下。)

使用 Visual Studio 开发应用

与常规的 web 开发不同,当使用 JavaScript 和 HTML 编写应用时,您不能选择自己的开发工具:您必须使用 Visual Studio 2012,这与针对任何微软平台的开发所需的工具相同。因此,坏消息是您必须学习一个新的开发环境,但好消息是 Visual Studio 非常优秀,微软已经花时间使 JavaScript 和 HTML 支持与我用于常规 web 开发的任何工具和编辑器一样好。不过,我不得不承认,从我写 C#应用和服务的时候起,我就对 Visual Studio 情有独钟,而且你可能会发现,当你努力学习一套新的工具一种新的应用开发时,学习曲线是陡峭的。这不是一本关于 Visual Studio 的书,但是在第 2 章中,我会给你一个基本特性的快速浏览,帮助你入门。

发布 Windows 应用

大多数 Windows 应用都是通过 Windows 商店销售的。例外的是为企业编写的应用,它们可以像传统的桌面应用一样安装(尽管这仅在面向企业的 Windows 8 版本中可用)。Windows Store 与任何其他应用商店非常相似,用户可以搜索应用,查看成功应用的排名,并获得应用的更新。而且,和其他应用商店一样,Windows Store 通过从你的应用销售中提成来运营。我将在本书第四部分的中解释作为开发者如何使用 Windows Store,但如果你记住通过 Windows Store 发布是应用开发的最终目标,这将会很有帮助。

这本书里有什么?

在本书中,我将向您展示如何使用您的 web 应用技术知识,并应用它们来创建丰富、流畅和动态的 Windows 应用。我首先向您展示这些 web 技术可以用来创建一个简单的应用,使用的方法与您在常规 web 应用部署中遇到的方法相同,然后向您展示可用于利用 Windows 8 和应用环境的不同技术、库和功能。

这本书是给谁的?

您是一名经验丰富的 web 开发人员,已经掌握了 JavaScript、HTML 和 CSS 的基础知识,并且希望为 Windows 8 开发应用。您希望基于您的 web 体验创建超越浏览器的应用,并以常规 web 应用无法提供的方式利用 Windows 平台的功能。

在我阅读这本书之前,我需要知道些什么?

您需要知道如何使用 HTML、CSS 和 JavaScript 编写一个简单的 web 应用。您需要理解 HTML 元素和属性、CSS 样式以及函数和事件等 JavaScript 概念。你不需要成为这些技术的专家,但是你需要一些经验。在这本书里,我没有提供关于 web 开发的介绍,如果你是 web 技术领域的新手,你将很难理解这些例子。

Windows 应用开发使用 HTML5 和 CSS3,但如果您了解 HTML5 规范的最新草案,这并不重要。HTML5 和 CSS3 中的新特性在很大程度上是进化的,对 HTML4 的良好理解将为您提供足够的基础,让您了解自己不知道的内容。

images 提示我在本书中最常使用的 HTML5 相关特性其实是新的 CSS3 布局特性,它可以轻松创建流畅的界面。你可以使用新元素和 API,但在大多数情况下你不需要这样做,一些关键特性通过特定于应用的 API 更方便地暴露出来。

如果我没有这样的经历呢?

你可能仍然会从这本书里得到一些好处,但是你会发现这很难,你将不得不自己找出许多应用开发所需的基本技术。我写了几本其他的书,你可能会觉得有用。如果你是 HTML 新手,请阅读HTML 5权威指南。这解释了创建常规 web 内容和基本 web 应用所需的一切。我解释了如何使用 HTML 标记和 CSS3(包括新的 HTML5 元素),以及如何使用 DOM API 和 HTML5 APIs(如果您不熟悉这门语言,还包括一个 JavaScript 初级读本)。如果你想了解更多关于实用 web 应用开发的知识,请阅读 Pro jQuery 。jQuery 是一个非常流行的 JavaScript 库,它简化了 web 应用的开发。我在本书中不使用 jQuery,但是通过学习如何有效地使用 jQuery,您将提高您对 web 开发各个方面的理解(并且由于您可以使用 jQuery 进行 Windows 应用开发,您花费的时间将对您以后有好处)。对于更高级的主题,请阅读 Pro JavaScript for Web Apps ,其中我描述了我在自己的 Web 开发项目中使用的开发技巧和技术。这三本书都是由出版社出版的。

我不需要知道什么?

你不需要有任何 Windows 桌面开发或其他微软技术(如 C#、XAML 或。NET 框架)。使用 web 技术开发应用建立在您已经用于 web 应用开发的基础上,虽然有很多东西需要学习,但您不必担心其他编程语言或标记。

但是我不需要知道 C#的高级特性吗?

不,说实话。微软在让 JavaScript 与 C#和其他语言平起平坐方面做得很好。NET 语言,使 HTML 成为 XAML 的一个很好的替代品(这是大多数语言中定义用户界面的方式。NET 应用)。当您深入应用开发时,您会意识到您正在使用与。网络语言。这一点很明显,只是因为一些对象和属性名有点奇怪——在所有其他方面,您甚至不知道是否支持其他语言。

我用 HTML/JavaScript 和 XAML/C#编写 Windows 应用已经有一段时间了,但我还没有发现任何可用的特性。这是 web 技术程序员无法实现的。HTML 和 JavaScript 是应用开发领域的一流技术。

我需要什么工具和技术?

应用开发需要两样东西:一台运行 Windows 8 和 Visual Studio 2012 的 PC。如果你认真对待应用开发,你需要购买一份 Windows 8,但如果你只是好奇,你可以从微软获得 90 天的试用期——我将在稍后的第二章中解释如何进行。

Visual Studio 2012 是微软的开发环境。好消息是微软推出了 Visual Studio 的基础版本,可以免费获得,这是我在本书中一直使用的版本。它有一个吸引人的名字:Visual Studio 2012 Express for Windows 8,我将在本章的后面告诉你如何获得它。

Visual Studio 的付费版本是可用的,您可以将任何不同的 Visual Studio 版本与本书一起使用。微软倾向于对企业集成、版本控制和测试管理等功能收费,虽然它们都是有用的功能,但没有一个是应用开发所必需的,我不以任何方式依赖它们。

这本书的结构是怎样的?

在本章中,我将向您介绍 Visual Studio,并向您展示如何创建一个简单的项目。我将简要介绍 Visual Studio 界面的关键部分,解释 Windows 应用开发项目中每个文件的外观,并向您展示如何使用 Visual Studio 附带的应用模拟器工具运行和测试应用。

在第 3 章中,我将向你展示如何构建你的第一个应用。我主要使用基本的 HTML、CSS 和 JavaScript 特性来演示您现有的 web 应用开发知识有多少可以直接应用到 Windows 应用开发中。你会对你能做的事情感到惊喜。当然,你没有购买专业水平的基础书籍,这本书的其余大部分向你展示了不同的技术和功能,将一个基本的应用转变为一个提供一流应用体验的应用。在接下来的章节中,我将简要描述您将在本书的其他部分学到的内容。

第二部分:核心开发

有一些核心功能,几乎所有的应用都可以从中受益。在本书的这一部分,我解释了这些基础技术,向您展示了如何让用户浏览您的应用的内容,如何使您的应用布局适应运行它的设备的功能和配置,以及如何最好地利用广泛的异步编程支持,这些支持贯穿几乎所有的 Windows 应用开发库。当你完成这本书的这一部分时,你将知道如何创建一个动态的、自适应的、响应迅速的应用。

第三部分:UI 开发

您可以使用标准的 HTML 元素,如buttoninput,为应用创建 UI,称为布局,但您也可以访问 WinJS UI 库,其中包含的界面控件为 Windows 应用提供了独特的外观和感觉。在本书的这一部分,我将带您浏览这些控件,解释何时应该使用它们,以及如何将它们应用于常规的 HTML 元素,并给出许多许多示例,以便您可以看到它们的运行。当你完成这本书的这一部分时,你将知道如何应用独特的 Windows 外观和感觉来创建漂亮的应用。

第四部分:平台整合

一旦应用结构和布局就绪,就可以开始将应用集成到 Windows 提供的功能和服务中。这包括使你的应用成为文件和数据搜索过程的一部分,使用文件系统,告诉 Windows 你的应用支持不同类型的文件和协议,打印以及在应用之间共享数据。我将在本书的这一部分涵盖所有这些主题,并向您展示如何为您的应用创建不同类型的通知,包括低调的 live tiles 和更具侵入性的 toast 通知。当你完成这本书的这一部分时,你将知道如何使你的应用成为一个一流的 Windows 公民,完全集成到更广泛的平台和你的用户工作流中。

第五部分:销售应用

在本书的最后一部分,我将向您展示如何准备一个应用,以及如何在 Windows 应用商店中发布它。在本书的这一部分结束时,你将会看到一个 Windows 应用的完整生命周期,从最初的基本实现到高级功能,最后是它的发布。

这本书里有很多例子吗?

这本书里有个例子,我展示了创建一流应用所需的每个关键特性。在某些情况下,我回过头来组合不同的特性,向您展示它们是如何协同工作的,这些组合的好处,以及有时可能出现的问题。这本书里的例子太多了,以至于我很难把所有的代码都放进章节里。为了方便起见,我用两种方式列出了 JavaScript 代码和 HTML 标记。第一次引入新文件时,我会向您展示完整的内容。你可以在清单 1-1 中看到一个这样的例子,这是摘自第六章的代码。

清单 1-1 。新文件的完整列表

`(function () {     "use strict";

WinJS.Namespace.define("ViewModel.State", {         appBarElement: null,         navBarContainerElement: null,         navBarControlElement: null     });

WinJS.Namespace.define("ViewModel.UserData", {

}); })();`

当我修改一个文件时,我倾向于只显示被修改的部分,类似于清单 1-2 。粗体代码显示了我所做的与我正在演示的技术或特性相关的更改。

清单 1-2 。修改文件的部分列表

... WinJS.Namespace.define("ViewModel.UserData", { **    word: null,** **    wordLength: {** **        get: function() {** **            return this.word ? this.word.length : null;** **        }**     } }); ...

如果我自己也想效仿呢?

你可以从Apress.com下载本书中每个例子的完整代码。代码是按章节组织的,每个项目显示每个应用的完成状态,所以你可以看到完成的结果是什么样子,如果你愿意,可以跟着做。您可以在自己的项目中使用代码,或者使用示例作为模板来创建新的应用。

图像归属

在本书的例子中,我使用了大量的图像文件。感谢以下人员善意地允许使用他们的照片:霍里亚·瓦兰、大卫·肖特、 Geishaboy500 、田中久约、梅尔维·埃斯凯利宁、花式速度女王、艾伦“克雷吉 3000 、克雷吉、诺森古德梅拉路易丝