1.6 编写第一个程序

本节将通过编写第一个程序，为开发者讲解Xcode的启动、Xcode的界面、运行程序、模拟器、场景编辑器等内容。

1.6.1 创建项目

项目可以帮助用户管理代码文件和资源文件。使用Xcode开发的程序都包含在项目中。以下是使用Xcode创建项目的具体操作步骤。

（1）打开Xcode，弹出Welcome to Xcode对话框，如图1.37所示。

图1.37 Welcome to Xcode对话框

（2）选择Create a new Xcode project选项，弹出Choose a template for your new project:对话框，如图1.38所示。

图1.38 Choose a template for your new project:对话框

（3）选择iOS|Application中的Game模板，单击Next按钮后，弹出Choose options for your new project:对话框，如图1.39所示。

图1.39 Choose options for your new project:对话框

（4）填入Product Name（项目名）、Organization Identifier（标识符）信息以及选择Language（编程语言）和设备Devices（设备），如表1-3所示。

表1-3 填写的内容

（5）内容填写完毕后，单击Next按钮，打开项目的保存位置对话框，如图1.40所示。

图1.40 保存位置对话框

（6）单击Create按钮，这时一个项目名为Hello World的项目就创建好了。

1.6.2 Xcode界面介绍

一个Xcode项目由很多的文件组成，如代码文件、资源文件等。Xcode会帮助开发者对这些文件进行管理。所以，Xcode的界面也比较复杂，如图1.41所示。

图1.41 Xcode的界面

在图1.41中可以看到Xcode的界面大致可以分为4大部分。

编号为1的部分是导航窗口。

编号为2的部分是代码编辑区域。

编号为3的部分是工具窗口。

编号为4的部分是显示程序调试信息的窗口。

本小节将对几个重要的区域进行讲解。

1．导航窗口

导航窗口的作用是显示整个项目的树状结构。开发者可以根据自己的喜好对其进行大小调整，以及显示和隐藏（View|Navigators|Show/HideNavigator命令来实现显示和隐藏，或通过使用Hide or show the Navigator按钮来实现显示和隐藏）。导航窗口可以显示8类不同的信息，所以又有了8个导航器。这8个导航器分别为：项目导航器、符号导航器、搜索导航器、问题导航器、测试导航器、调试导航器、断点导航器和日志导航器。可以通过导航窗口顶部的8个图标来进行导航之间的切换。

2．工具窗口

工具窗口可以对项目的一些设置信息进行编辑。开发者也可以使用随时显示和隐藏的View|Utilities|Show/HideUtilities命令来实现显示和隐藏，或通过使用Hide or show the Utilities按钮来实现显示和隐藏。工具窗口可以分为上下两个部分。上半部分显示的内容取决于开发者在编辑器上正在编辑的文件类型，其中文件类型有3种，如下：

当编辑器编辑的是代码文件时，工具窗口上半部分显示的内容为：文件查看器和快速帮助中的一个的内容。要想实现两个内容的切换，可以通过使用此窗口上半部分在顶部显示的图标来进行切换。

当编辑器编辑的是界面文件时，工具窗口上半部分显示的内容为：文件查看器、快速帮助、标识查看器、属性查看器、尺寸查看器和连接查看器中的一个的内容。要想实现6个内容的切换，可以通过使用此窗口上半部分在顶部显示的图标来进行切换。

当编辑器编辑的是场景文件时，工具窗口的上半部分显示的内容为：文件查看器、快速帮助，以及节点查看器中的一个内容。

下半个工具窗口显示的内容是文件模板库、代码片断库、对象库和媒体库的其中一个内容。要想实现这4个内容的切换，可以通过使用此窗口下半部分在顶部显示的图标来进行切换。

3．编辑窗口

编辑窗口可以用来编写代码或编辑场景。在顶端，有左右箭头和整个项目的层次显示。

4．目标窗口

目标窗口中包含了项目的程序和配置，这些配置指定了如何构建程序代码，如图1.42所示。在目标窗口的顶部，可以选择General、Capabilities、Info、Build Settings、Build Phases、Build Rules中的内容。

图1.42 目标窗口

1.6.3 运行程序

了解了Xcode的界面构成后，我们来看Xcode是如何进行程序运行的。运行程序只需要单击运行按钮，如图1.43所示，程序会自动开始运行了。在运行程序前首先对程序进行编译。如果程序正确，会出现一个Build Succeeded提示，如图1.44所示。如果程序出现错误，那么就会出现一个Build Failed提示，如图1.45所示。

图1.43 运行程序

图1.44 程序正确

图1.45 程序错误

在程序编译后，会自动对程序进行连接、运行。运行效果如图1.46～图1.48所示。

图1.46 运行效果

图1.47 运行效果

图1.48 运行效果

注意：图1.46是应用程序的一个启动界面，是系统自带的。开发者真正要使用到的界面是1.47所示的界面。启动界面也是可以删除的，如果开发者不想在程序运行时有启动界面，可以打开Info.plist文件，在此文件中找到Launch screen interface file base name，将其value后面的内容删除，如图1.49所示。

图1.49 设置启动界面

1.6.4 模拟器介绍

图1.46或者图1.47所看到的类似于手机的模型就是iOS模拟器。iOS模拟器是在没有iPhone或iPad设备时，对程序进行检测的设备。iOS模拟器可以模仿真实的iPhone或iPad等设备的各种功能。本小节将讲解一些有关模拟器的操作。

1．模拟器与真机的区别

iOS模拟器可以模仿真实的iPhone或iPad等设备的各种功能，如表1-4所示。

表1-4 iOS模拟器

iOS模拟器只能实现表1-4中的这些功能，其他的功能是实现不了的，如打电话、发送SMS信息、获取位置数据、照照相、麦克风等。

2．退出程序

如果想要将图1.47所示的应用程序退出（为用户完成某种特定功能所设计的程序被称为应用程序），该怎么办呢？这时就需要选择菜单栏中的Hardware|Home命令，退出应用程序后的效果如图1.50所示。

图1.50 退出应用程序

3．设置应用程序的图标

在图1.50中可以看到显示在iOS模拟器上的应用程序的图标为网状白色图像，它是iOS模拟器上的应用程序的默认图标。一般开发者不会使用此图标的，而是使用自己定制的图标。以下就是修改默认图标为自定义图标的具体操作步骤。

（1）右击Supporting Files文件夹，弹出快捷菜单，如图1.51所示。

图1.51 添加图像1

（2）选择Add Files to "Hello World"…命令，弹出选择文件对话框，如图1.52所示。

图1.52 添加图像2

（3）选择需要添加的图像，单击Add按钮，实现图像的添加。添加后的图像就会显示在Supporting Files文件夹中。

（4）单击打开Supporting Files文件夹中的Info.plist文件，在其中添加一项Icon files，在其下拉菜单的Value中输入添加到Supporting Files文件夹中的图片，如图1.53所示。

图1.53 设置图标

此时运行程序，会看到如图1.54所示的效果。

图1.54 运行效果

4．设置语言

一般情况下iOS模拟器默认使用的语言为English（英语）。对于英文不好的开发者来说，英文就像天书，怎么看也看不懂。这时，就需要将iOS模拟器的语言进行设置。要设置语言，需要切换到模拟器的主界面，向左拖动，找到Settings应用程序。找到后即可对iOS模拟器的语言进行设置了，以下将iOS模拟器的语言变为中文，具体操作步骤如下：

（1）切换到主界面，找到Settings应用程序，如图1.55所示。

图1.55 Settings应用程序

（2）选择Settings应用程序图标，进入Settings界面中，如图1.56所示。

图1.56 Settings界面

（3）选择General选项，进入General界面，如图1.57所示。

图1.57 General界面

（4）选择Language&Region选项，进入Language&Region界面中，如图1.58所示。

图1.58 Language&Region界面

（5）选择iPhone Language选项，进入iPhone Language界面，如图1.59所示。

图1.59 iPhone Language界面

（6）选择“简体中文”选项，轻拍Done按钮，弹出动作表单，如图1.60所示。

图1.60 设置语言

（7）选择Change to Chinese，Simplified选项，进入正在设置语言的界面，如图1.61所示。当语言设置好后，iOS模拟器将会退出到主界面，此时主界面的应用程序的标题名就变为了中文，如图1.62所示。

图1.61 正在设置语言的界面

图1.62 中文界面

5．旋转

真机可以进行旋转，模拟器同样也可以进行旋转。要实现iOS模拟器的旋转只需要同时按住“Command+方向键”就可以了。以下是使用“Command+->”实现的iOS模拟器实现的向右旋转，如图1.63所示。

图1.63 旋转模拟器

如果想要让模拟器在一运行程序就进行旋转，即设备水平向左放置或者水平向右放置该怎么实现呢？这里有两种办法：第一种是在创建项目的General中进行设置；第二种是使用代码进行设置。

（1）General中的设置

在创建的项目中，打开目标窗口（单击项目名称，可以打开），找到General选项。单击该选项，在General面板中找到Device Orientation选项。Device Orientation后面有4个单选框，开发者可以通过对这4个单选框的选择实现模拟器的旋转，如图1.64所示。

图1.64 设置模拟器的旋转

图1.64是将Hello World应用程序中的模拟器进行了水平放置。此时运行程序，会看到如图1.65所示的效果。

图1.65 运行效果

（2）使用代码

代码来实现设备方向的改变，首先需要使用到supportedInterfaceOrientations()方法来实现设备方向的设置，其语法形式如下：

func supportedInterfaceOrientations() -> Int

其中，设备的方向包括7个，如表1-5所示。

表1-5 旋转方法

设置好设备的方向后，需要使用到shouldAutorotate()方法来让设备进行改变，其语法形式如下：

func shouldAutorotate() -> Bool

以下将使用代码，让Hello World应用程序中的模拟器进行水平放置。打开GameViewController.swift文件，在此文件中编写代码，代码如下：

override func shouldAutorotate() -> Bool {
    return true
}
override func supportedInterfaceOrientations() -> Int {
    return Int(UIInterfaceOrientationMask.Landscape.rawValue)           //让设备水平放置
}

此时运行程序，可以看到横屏显示的模拟器。

6．删除应用程序

如果在iOS模拟器中出现了很多的应用程序，就可以将不再使用的应用程序进行删除。这样一来可以为设备节省内存空间，也可以使用户或者开发者便于管理自己的应用程序。以下主要实现Hello World应用程序的删除。

（1）长按要删除的Hello World应用程序，直到所有的应用程序都开始抖动，并在每一个应用程序的左上角出现一个“x”，它是一个删除标记，如图1.66所示。

图1.66 删除应用程序1

（2）单击Hello World程序左上角出现的删除标记，会弹出一个删除“Hello World”对话框，选择其中的“删除”按钮，如图1.67所示。这时Hello World应用程序就在iOS模拟器上删除了。

图1.67 删除应用程序2

1.6.5 场景编辑器

在图1.47和图1.48中所看到的模拟器中显示的内容都为场景，对于场景的设计有专门的场景编辑器。本小节将讲解场景编辑器的组成及如何设计。

1．场景编辑器的组成

单击项目中的GameScene.sks就可以打开场景编辑器。场景编辑器分为了4部分，如图1.68所示。

图1.68 场景编辑器构成

这4部分的说明如下：

编号为1的部分为导航窗口。

编号为2的部分为场景，在其中可以放置一些节点。

编号为3的部分为工具窗格的检查器，用于编辑当前选择的对象的属性。

编号为4的部分为工具窗格的库，如果选择的是Objects，里边存放了节点以及其他。

2．设置场景

以下将在场景中显示一个标签，具体的操作步骤如下：

（1）单击工具窗口的库，在其中找到Show the Object Library。

（2）在Show the Object Library中找到Label标签对象将其拖动到场景中，如图1.69所示。

图1.69 设计场景

此时运行程序，会看到如图1.70所示的效果。

图1.70 运行效果

如果想要让新添加的标签对象有一个独特的风格，需要使用Show the SKNode inspector面板，如图1.71所示。

图1.71 设置标签

在图1.71中，我们将标签的Text设置为了Sprite Kit，将标签的Color设置为了黑色。此时运行程序，会看到如图1.72所示的效果。

图1.72 运行效果

1.6.6 编写代码

代码就是用来实现某一特定的功能而用计算机语言编写的命令序列的集合。现在就来通过代码实现标签的显示。具体的操作步骤如下：

（1）打开Hello World项目的GameScene.swift文件，将不使用的代码删除，此时剩余代码如下：

import SpriteKit
class GameScene: SKScene {
    override func didMoveToView(view: SKView) {
        
    }
}

（2）在GameScene.swift文件中编写代码。此代码实现的功能是在场景中显示一个标签内容为"Never betray Hello World"的标签对象。代码如下：

import SpriteKit
class GameScene: SKScene {
    override func didMoveToView(view: SKView) {
        let label = SKLabelNode(fontNamed:"Chalkduster")    //实例化对象
        label.text = "Never betray Hello World"                             //设置显示的内容
        label.fontSize = 65                                                 //设置文本大小
        label.fontColor=SKColor.blueColor()                                 //设置颜色
        label.position = CGPoint(x:CGRectGetMidX(self.frame),
        y:CGRectGetMidY(self.frame))
        self.addChild(label)
    }
}

此时运行程序，会看到如图1.73所示的效果。

图1.73 运行效果