在Swift中编写 watchOS 2 Hello World 程序

猛戳阅读最终版@SwiftGG，最终版语句衔接更流畅，阅读起来更易懂

过去的几个月我一直保持着写博客的习惯，但是现在我得专心工作了。最近在做一些 watchOS 2 相关的更新工作，而且我觉得如果出个系列教程会对大家很有帮助。而首要的事情就是我们需要知道如何开发第一个 watchOS 2 应用。所以现在就来开发一个 watchOS 2 风格的 “Hello World!“吧！

在教程开始前，我想告诉你们一些用 Swift 在 iOS、watchOS、tvOS 或者 OS X 上编程的知识，因此，如果你有想通过 Coding Explorer Blog 了解的任何话题，请通过 Twitter @CodingExplorer 或者 Contact Page 来提出你的建议。

创建你的 watchOS 2 应用

打开 Xcode， 创建一个新项目，可以通过初始界面，也可以通过菜单（File → New → Project…）。然后，定位到 watchOS 部分并选择 Application，现在界面看起来是这样的：

因为只有“iOS App with WatchKit App“这一个选项，所以选中并点击 next。到这一步，需要给应用起个名字然后做几个选择来初始化项目。我们把应用命名为“HelloWatch“。简单起见，你可以把下方的 the Notification Scene、Glance Scene 等选项关闭。虽然它们很有用，但是在这个项目我们只需要生成一个简单的“Hello World“应用。当然，你需要确保将 Language 选项设置为 “Swift“。

这个项目是不会生成 iOS 应用的。如果你对在 iOS 上写一个 Hello World 应用感兴趣，请参阅 Hello World! Your first iOS App in Swift。选择项目的保存位置，现在我们就可以开始了。选中导航面板上 “HelloWatch WatchKit App“ 分组中的 Interface.storyboard。

这个文件就是 watchOS 应用的界面文件。和 iOS “Hello World“应用类似，我们在应用中放置一个 label 和一个 button，然后点击 button 会改变 label 的文本内容。

所以我们从 Object Library 拖一个 label 和 button 到 storyboard 上，然后把 label 放置在 button 的上方：

这时 label 看起来会比较拥挤，所以我们通过设置 Width 为“Relative to Container“ ，并将其值设置为 1 的方式来把 label 的宽度设置为屏幕的宽度。这个值代表了和屏幕宽高的百分比，所以 1 就是 100%，0.5 就是 50％ 等等。然后我们在垂直方向上也给它设置更多的空间，把 Height 设置为“Relative to Container“ 然后将其值设置为 0.25 （即屏幕高度的25%）。最后我们把 Text 设置为“App Loaded…“，如果你喜欢还可以将其设置为居中显示。

给 watchOS UI 添加一些 Swift 代码

UI 已经 OK 了。现在我们把它和代码连接起来，然后让 button 去做一些事情。最简单的方式就是打开辅助编辑器。点击右上方的斜 venn 图标即可：

如果需要操作空间大一点，你可以通过最右边的按钮（图标是右侧包含长条的方框）关闭工具面板。

然后，从 label 开始用 Ctrl＋拖动或者右击拖动的方式拉一条线到代码中（根据惯例，一般是在类的顶部）。然后就会弹出对话框让你给 label 的 outlet 命名。我们把它叫做 “displayLabel“。按照惯例我仍然建议采用骆驼命名法来给它们（也包括所有的变量）命名，以小写字母开始，然后接下来的每个单词的首字母都大写（因为我们不能在变量名中加空格，所以我们以这样的方式来表明这是一个新的单词）。

接下来，我们对 button 做同样的操作。从 button 开始用 Ctrl + 拖动的方式拉一条线到代码中（可以是类范围内的任意位置，据我所知，除了放在 outlet 下方，没有其它特殊的惯例）然后创建一个 action。一定要确保连接的方式是 “action“。如果你创建的是 outlet，它可以让你改变 button 本身的状态，比如它的文本，但这不是我们在这里想做的事情：

再次确认这是一个 “Action“。它会创建一个叫 “buttonTapped“的方法，我们在这个方法里面写我们的代码。改变 WKInterfaceLabel 文本的代码非常简单，如下：

@IBAction func buttonTapped() {
    displayLabel.setText("Hello World!")
}

我们的方法中间只有1行代码。我们调用了 WKInterfaceLabel 的 “setText“方法，然后把新的文本做为参数传递给它。在 iOS 中，我们通过一个叫“text“的属性就可以轻松滴改变 label 的显示内容。但是在目前来说，watchOS 并没有这样一个属性，而且我们甚至不能通过程序把文本内容再读出来，预计下一版本的 watchOS 会加入这个属性，但是现在我们仍然只能用“setText“方法去设置文本内容。

大功告成。如果你有 Apple Watch，你可以把你的手机连接到 Mac，然后安装这个应用到手机上，或者你也可以使用模拟器。在左上角选择“HelloWatch WatchKit App“这个 target，然后选择任意一个你想用的 Phone 和 Watch 模拟器（或者选择具体的iPhone，如果你想在真机上测试的话）。然后点击 play 按钮就可以了。你可能需要多点击“play“按钮几次（尤其当你电脑没有 SSD 的情况下，这可以减少加载模拟器的时间），最终你会见到下面的画面：

然后当你点击 button 之后就会看到：

完整起见，InterfaceController.swift 文件的所有代码如下：

import WatchKit
import Foundation


class InterfaceController: WKInterfaceController {

    @IBOutlet var displayLabel: WKInterfaceLabel!

    override func awakeWithContext(context: AnyObject?) {
        super.awakeWithContext(context)

        // Configure interface objects here.
    }

    @IBAction func buttonTapped() {
        displayLabel.setText("Hello World!")
    }

    override func willActivate() {
        // This method is called when watch view controller is about to be visible to user
        super.willActivate()
    }

    override func didDeactivate() {
        // This method is called when watch view controller is no longer visible
        super.didDeactivate()
    }

}

上面的大部分代码都是模版自动生成的。

总结

文章中的代码都是在 Xcode 7.1.1 中进行测试的。

这就是 watchOS 2 中“Hello World!“应用了。你会发现这篇教程非常简单，其实这是有意为之。接下来的教程会经常引用这篇教程，这样就可以避免重复制作 watchOS 应用时前面的一些设置步骤。这个系列接下来的一些文章会更有趣一些，包括使用 WatchConnectivity 在 iOS 和 watchOS 2 应用之间传递数据，或者实现并发。敬请期待更多的 watchOS 和 Swift 教程！

希望这篇文章对你有用。如果你觉得有用，请不要犹豫，把它分享到你的 Twitter 或者你喜欢的社交媒体，每次分享都会很有用。当然，如果你有任何问题，请马上通过 Contact Page 或者 Twitter @CodingExplorer 联系我，我会看看我能帮到什么。谢谢！