一步步的教你如何创建第一个APP？－swift

准备好了么？ 准备好创建你的第一个app了么？ 在这个教程中，你会学习到如何创建一个简单的游戏，叫做“Tap me"，游戏的玩法是看你在30秒之内可以点击按钮多少次，来给你评分。                                                                                       －－－－翻译自https://www.raywenderlich.com/114262/learn-to-code-ios-apps-with-swift-tutorial-4-your-first-app

准备开始：

首先打开你的Xcode, 然后选择Create a new Xcode project.

接下来，选择IOS-->Application-->Single View Application,然后点击next.

然后填写下面的项目：

Product Name: Tap me

Organisation Name: 这一栏你可以空着，也可以填写你的用户名称等

Organisation Identifier: 填写com.你的名字，比如： com.zhangsan

Language: Swift

Devices: iPhone

Storyboards

你会发现这个项目开始的时候，你的app已经自动帮你创建好了几个文件，那么首先 我们先来看一下Main.storyboard.

当你点进去的时候，你打开了一个GUI，也就是我们所说的用户界面，用来展示iPhone屏幕上所显示的东西。

现在呢，你的app是空白的。我们现在可以做一些小小的改变了。现在 你需要确保你的右侧边菜单是打开状态的：

接下来，选择attributes Inspector:

这个东西其实就允许你编辑不同的属性了，现在我们来尝试改变一下屏幕的颜色：

现在，在顶部的菜单里，你先选择iPhone 6  Simulator，然后运行app，会稍微等待一小会儿，但是不要着急。最后运行之后，你会发现你的模拟器是这样的：

添加Label到你的屏幕中

现在看来一个绿色的屏幕占据了你的整个界面，现在我们可以适当的添加一些东西来和用户互动了，添加一些物品，你需要找到OBject Library，在右下方。你现在首先需要添加的就是Label. Label其实就是文本。你可以滚动下滑找到Label这个项：

鼠标拖拽Label到你的屏幕中去，把它放在顶部中心位置：

你现在可以用Attributes Inspector来改变名称，修改title为"Time:30".

如果你发现你的Label在屏幕上看上去被缩短了，你可以点击你的Label, 然后选择Editor\Size to Fit. 

当你修改之后，运行app，马上就显示到了界面上面:

根据你的storyboard, 你的Label应该是在中心位置，对不对？  问题是不是每一部iOS设备都有相同的规格，所以可能有时确实有点混乱。

那么怎么解决它呢？ 你需要给你的Label添加一些约束了！

首先点击你的Label， 接下来，选择Align按钮，在整个屏幕的底部，然后选择Horizontal Centre in Container然后选择Add 1 Constraint.

这就决定了你的label会处于水平剧中的位置，但是你需要具体的设置。做这些，你要点击底部的pin按钮，然后点击红色的线到顶部，基于当前的距离然后点击Add 1 Constraint:

新的约束Label上会有一条或几条橙色的线， 这是因为你摆放Label的位置和它的位置不相符引起的。

如果出现了这种情况，你只需要点击triangle icon在右手边的角部位置，有一个All Views in View Controller选项，点击Update Frames选项。

现在，拖拽一个新的label到屏幕的底部，这个label是用来决定最后游戏分数的。 这两个label唯一的不同点就是 你现在将要给这个label设置大小尺寸：Font size为40， line为2， 设置Alignment为Center

在Size Inspector里，设置height为130:

你需要设置一些约束。首先你需要设置水平居中。 选择分数的label，点Align按钮，然欧选择Horizontal Center in Container然后点击Add 1 Constraint.

接下来，点击Pin按钮，添加一个bottom pin, 然后选择height constraint. 设置高度为130， 最后点击Add 2 Constraints按钮。

如果这一次你又看到了橙色的线，那么你还是点击triangle icon在右手边的角部位置，有一个All Views in View Controller选项，点击Update Frames选项。

运行你的app，现在你的界面应该是这个样子了：

添加一个按钮

为了添加一个按钮，你要找到右下角的Library, 然后添加一个button到你的屏幕中的中心位置：

别忘记给你的button添加约束哦～这一次我们把它设置为水平居中和垂直居中。

现在 用Attributes inspector来改变你的title为Tap Me! 然后设置Background为white colour.

为了使按钮更好的显示，你需要设置不同的约束，这一次你点击Pin按钮，然后点击Width和Height，分别设置为167和113.

如果你看到了橙色的线，记得Update Frames就像之前所做的那样。

你的按钮现在应该是在一个可以点击的存在于中心位置的按钮，运行你的app 你可以看到下图所示：

你现在可以点击这个按钮了。但是目前没有任何反应，所以你需要下一步的步骤。

连接你的视图到代码

现在你需要连接你的代码到视图控制器中，每一个界面都对应着一个Class，一个View Controller. Xcode已经为你创建了一个ViewController.swift文件。

而你需要做的就是为你的label添加两个属性，添加下面的代码到你的ViewController.swift文件中的ViewController类里。

@IBOutlet var scoreLabel: UILabel! @IBOutlet var timerLabel: UILabel!

这两行代码创建了UILabel的属性，这时候你的视图就连接到了它。

同样的，你需要一个方法：这个方法就是用来说当这个按钮被按下的时候调用，所以添加下面的方法到ViewController类里：

@IBAction func buttonPressed() { NSLog("Button Pressed") }

就像是IBOutlet, IBAction让storyboard编辑器知道了这个方法，所以你可以连接这个按钮点击的事件了。

试着连接这些属性和方法，打开Main.storyboard, 你只需要简单的一步操作就可以，那就是Ctrl+拖拽，从ViewController拖拽到Time Label.

这个时候 你会发现有一个小的对话框弹出来了，选择timerLabel, 这就是一个UILabel的项也就是你之前创建在ViewController.swift文件中的。

现在，重复之前的Score Label, 然后连接到scoreLabel上。

下一步，我们要把按钮连接到buttonPressed()这个方法上，你需要Ctrl+拖拽storyboard上的按钮到到视图控制器上面。

接下来，选择buttonPressed()

现在，试着运行一个你的app，然后不断的点击你的按钮。你会看到NSLog在显示你一直在用buttonPressed()的这个方法。也就是当你每点击一次按钮的时候，就会有一次输出。

操作你的Label

其实你应该学习的是如何操作你的label，非常简单。代替你的buttonPressed()中间的代码：

scoreLabel.text = "Pressed"

现在 当你运行你的app，然后点击按钮的时候，接下来底部的屏幕会改变为"Pressed"

为了使用这些来让ScoreLabel追踪你的分数，你需要额外的一点工作要做。

追踪你的score

为了追踪你的分数，首先你需要创建一个变量，在两个IBOutlet声明的下面，你可以声明另外一个变量：

var count = 0

下一步，为了表现出buttonPressed()的count增加，你需要插入下面一行代码：

count++

其实，count++ 是 count = count + 1的简写而已。

现在，我们改变一行scoreLabel的设置：

scoreLabel.text = "Score \n\(count)"

运行你的app，然后测试后你会发现，当你点击按钮的时候，底部的label已经开始追踪你的分数啦。你的app已经越来越接近一个游戏了。

现在是时候开始着手于时间上的问题了，如果你想让你的app时间上工作正常，呢么你需要创建两个新的属性。一个变量是int 来追踪秒数，另外一个是NSTimer变量，来告诉你时机终止。

添加下面两行代码在count的下面：

var seconds = 0
var timer = NSTimer()

为了使用这两个变量，你需要创建两个方法，第一个我们叫它做setupGame()， 然后在这个类的底部添加下面的方法：

func setupGame() { seconds = 30 count = 0   timerLabel.text = "Time: \(seconds)" scoreLabel.text = "Score: \(count)" }

这些代码设置了所有的都返回到初始值，当这个游戏开始的时候。如果你不添加这个代码，那么秒数会一直减少减少，然后分数会一直增加，永远不会重置。

下一步，我们需要为setupGame()_方法开始timer, 为了做这件事，你需要用房scheduledTimerWithTimeInterval()这个方法来得到你想要的timer, 插入下面的代码到setupGame()方法中：

timer = NSTimer.scheduledTimerWithTimeInterval(1.0, target: self, selector: Selector("subtractTime"), userInfo: nil, repeats: true)

添加下面的代码，现在确保你已经在viewDidLoad()中调用了setupGame()方法：

setupGame()

下一个方法你需要写的就是subtractTimer(). 这个方法用来减少秒数，更新timeLabel, 触发Alert来告诉玩家时间已经为0 了。

你开始的时候就需要知道如何去做：秒数的减少，更新timerLabel, 当时间到0的时候创建一个if语句。

func subtractTime() { seconds-- timerLabel.text = "Time: \(seconds)"   if(seconds == 0) {   } }

第一件事你需要添加到代码里的是：if语句。 也就是说如果什么事件发生了阻止了时间的count，那么用到了下一行代码：

timer.invalidate()

运行你的app，现在timer 时间已经开始计时了。

现在，也就是说我们到达了最后一部了。

红色警告

接下来，你要学习的就是如何做一个警告框，当你完成了这个警告框，你的界面应该是下面这个样子：

准备好要开始了么？ 首先第一件事儿 你需要添加一个UIAlertController. 插入下面的代码到invalidate()的语句中，在if语句里。

let alert = UIAlertController(title: "Time is up!", message: "You scored \(count) points", preferredStyle: UIAlertControllerStyle.Alert)

这行代码决定了警示框是什么样子的，具体到了title, message, 和style.

接下来，你需要校准按钮，需要用到addAction()的方法。尝试下面的代码，放在alert声明之后。

alert.addAction(UIAlertAction(title: "Play Again", style: UIAlertActionStyle.Default, handler: {
  action in self.setupGame()
}))

现在就到了最后一行代码的时候啦，这一行代码实际上告诉app来显示UIAlertController. 这用到了presentViewController()，插入下面的代码到alert.addAction()之后

presentViewController(alert, animated: true, completion:nil)

接下来，运行你的代码，恭喜你有了自己的第一个小游戏的app.