经过前面章节的学习,现在可以制作你的第一个iPhone App了!

我们将开发一个名为“Tap Me”的游戏。主要功能就是看你在30s内能按多少次按钮。

Getting Started

打开 Xcode 选择Create a new Xcode project.


选择iOS > Application > Single View Application,点击Next.


Storyboards

工程创建后,你会发现比之前的命令行工程多出了一些文件。首先我们看下Main.storyboard.


点击这个文件,会打开一个GUI的界面,模拟运行app的iphone屏幕。


Note:你可能觉得奇怪为啥这个屏幕像个方形,跟iPhone屏幕的大小有区别。因为,我们在ios开发中,需要设计app以适配不同大小的屏幕尺寸---这个功能叫布局适配。

基本上,你采用“ 放在远离顶端的位置”或是“放在中间”的方式来布局你的用户接口元素,那这样你的app就能适应不同的屏幕尺寸,从iPhone5到iPhone6 plus等等都可以。

现在的app显示的是白板,为了做一个修改,需要确认Utilities Menu 打开了,如下:


选择 Attributes Inspector. 可以查看编辑 View Controller视图控制器的属性.


尝试修改背景颜色为绿色:

.

在最上面的菜单中选择iPhone 6 Simulator,然后运行你的app看下效果..


Adding Labels to the Screen

现在屏幕上什么都没有,我们需要添加Utilities Menu菜单的对象库Object Library中的一些对象。首先我们添加一个标签到屏幕上。标签类似于文本。在对象库Object Library中找到label对象,将其拖到屏幕中,放到顶端的中间。




在 Attributes Inspector 中可以修改label的标题为 “Time: 30”.

这时标签的标题名称没有完全显示出来.点击该标签并选择 Editor\Size to Fit(Command =).再次运行app,就能看下下面的效果。


但是标签并没有显示在屏幕的中间,因为不是所有的ios设备都有相同的分辨率,所以我们需要给这个标签加一些限制,让它能显示在屏幕的中间。点击标签后选择屏幕最下面的对齐按钮(Align button),勾上Horizontal Center in Container,然后点击Add 1 Constraint.


上面确定了标签的水平位置,接下来要确定其垂直位置。点击屏幕最下方的Pin button设置,然后点击Add 1 Constraint:

按上面的方法再创建一个记录分数的标签。其字体的大小设置为40,行数为2,高度为130.并添加相应的限制,让其保持在屏幕下方的中间位置。

设置完成后重新运行app,效果如下:

Add a Button

Object Library 中找到button 对象,添加一个按钮到屏幕的正中间。


添加相应的限制:

在Attributes inspector 中修改标题为 “Tap Me!” 并设置背景色为白色.

Pin中修改WidthHeight.

最后,点击屏幕下方的第三个按钮,选择Update Frames重新适配对按钮所设置的限制


重新运行app


Linking Views to Code 链接views与代码

目前为止,已经完成了views的布局,现在需要将其与代码进行链接。

ios app的每个屏幕都是有一个叫View Controller.的类控制的。xcode已经创建了一个模板ViewController.swift.

在文件ViewController.swift:的类ViewController中添加两个属性:

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

加上@IBOutlet,storyboard 编辑器才能识别这两个UILable类型的属性变量。

同样的,在ViewController类中定义一个方法,当按下按钮时应该执行的动作:

@IBAction func buttonpressed()  {
  NSLog("Button pressed")
}

接下来,将上面定义的属性和方法同相应的views链接起来。打开Main.storyboard,展开文件目录。按住ctrl键的同时将拖拽到time标签上。


这时会出现一个小对话框,选择timerLabel. 这个就是之前在ViewController.swift文件中创建的UILabel 对象。


同样的方法,将拖拽到score标签上,选择scoreLabel.

button按钮和方法buttonpressed(),的链接方式正好相反。按住Ctrl的同时,点击button并将其拖拽到View Controller 上。

重新运行app,点击button按钮几次,在屏幕的下面的终端上会看到一些信息,每点击一个button就会显示NSLog语句中的内容。


Manipulating Labels控制labels

button的目的并非只是在终端输出一段字符,而是每按一次button,core label的内容就加1.那么,你首先必须学会怎么操作label上的文本内容。

用下面的语句代替方法buttonpressed()中的内容.

scoreLabel.text = "pressed"

此时,你运行app后按一下button,屏幕下方的文本内容就会变为“pressed”.

Keep Track of the score

首先,在类里创建一个用来记录分数的变量创建一个变量count。将下面的语句加到以@IBOutlet开头的两句声明语句的下面。

var count = 0

在方法buttonpressed()函数中,对变量进行++操作:

count++

或者用下面的代替也可以:

= + 1

修改scoreLabel的文本内容:

scoreLabel.text "score \n\(count)"

运行app,再测试下,你会发现按一下按钮button,score label的内容就会加1.

Working with the Timer

接下来,需要给app添加一个计时器。首先需要创建两个变量,一个是记录时间的int类型的

seconds变量,一个是递减时间的类的变量。NSTimer
将下面两条语句加到声明count变量的下面:
var seconds 0
var timer = NSTimer)

为了使用这两个变量,还需要创建两个方法。一个是setupGame() 。将下面的代码加到类体内的最下面:

func setupGame{
  seconds 30
  0

  timerLabel.text "Time: \(seconds)"
  scoreLabel.text "score: \(count)"
 上面那段代码是在游戏开始的时候将变量的内容都恢复为初始值。如果不加这段代码,那当seconds递减到0,下一次游戏开始score还是会在原来的基础上继续加1,始终不会重置。 

setupGame()中加入下面的代码,开启计时器:

timer NSTimer.scheduledTimerWithTimeInterval(1.0,target: self,selector: Selector"subtractTime"),userInfonil,repeatstrueviewDidLoad()方法中调用setupGame()。将下面的代码加到函数体中: 
setupGame 另一个方法叫subtractTime(). 作用是递减seconds变量,更新timeLabel的文本内容 ,当计时器减到0时给出一个告警。 
func subtractTime) {
  seconds--
  timerLabel.text \(seconds)"

  if(seconds == 0{

  }
 在上面的if语句中加入下面的代码后,当计时器递减到0时,计时器就会停止工作。 
timer.invalidate 运行app后,你会发现时间time的值在递减: 
 


Red Alert!

添加一些告警信息,如下:


首先,创建一个告警控制器UIAlertController,在前面if语句中的

timer.invalidate)后面加入下面的代码:
let alert = UIAlertController(title: "Time is up!",message"You scored \(count) points",preferredStyle: UIAlertControllerStyle.Alert)

然后,调整button的动作以及显示的内容。在alert.声明语句的下面添加下面的代码:

alert.addAction(UIAlertAction"Play Again",style: UIAlertActionStyle.Default,handler: {
  action in self.setupGame}) 从上面的代码中,你会发现title决定了button的内容,handler决定了button被按下后会去调用setupGame()方法,然后告警就消失了. 

alert.addAction(...).下面加上下面的代码,执行告警控制器UIAlertController

presentViewController(alert,animatedtrue,completion:nil 运行app,并测试: 

版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。

相关推荐


效率成吨提升之代码生成器-蓝湖工具神器iOS,Android,Swift,Flutter
软件简介:蓝湖辅助工具,减少移动端开发中控件属性的复制和粘贴.待开发的功能:1.支持自动生成约束2.开发设置页面3.做一个浏览器插件,支持不需要下载整个工程,可即时操作当前蓝湖浏览页面4.支持Flutter语言模板生成5.支持更多平台,如Sketch等6.支持用户自定义语言模板
【Audio音频开发】音频基础知识及PCM技术详解
现实生活中,我们听到的声音都是时间连续的,我们称为这种信号叫模拟信号。模拟信号需要进行数字化以后才能在计算机中使用。目前我们在计算机上进行音频播放都需要依赖于音频文件。那么音频文件如何生成的呢?音频文件的生成过程是将声音信息采样、量化和编码产生的数字信号的过程,我们人耳所能听到的声音频率范围为(20Hz~20KHz),因此音频文件格式的最大带宽是20KHZ。根据奈奎斯特的理论,音频文件的采样率一般在40~50KHZ之间。奈奎斯特采样定律,又称香农采样定律。...............
见过仙女蹦迪吗?一起用python做个小仙女代码蹦迪视频
前言最近在B站上看到一个漂亮的仙女姐姐跳舞视频,循环看了亿遍又亿遍,久久不能离开!看着小仙紫姐姐的蹦迪视频,除了一键三连还能做什么?突发奇想,能不能把舞蹈视频转成代码舞呢?说干就干,今天就手把手教大家如何把跳舞视频转成代码舞,跟着仙女姐姐一起蹦起来~视频来源:【紫颜】见过仙女蹦迪吗 【千盏】一、核心功能设计总体来说,我们需要分为以下几步完成:从B站上把小姐姐的视频下载下来对视频进行截取GIF,把截取的GIF通过ASCII Animator进行ASCII字符转换把转换的字符gif根据每
自定义ava数据集及训练与测试 完整版 时空动作/行为 视频数据集制作 yolov5, deep sort, VIA MMAction, SlowFast
前言这一篇博客应该是我花时间最多的一次了,从2022年1月底至2022年4月底。我已经将这篇博客的内容写为论文,上传至arxiv:https://arxiv.org/pdf/2204.10160.pdf欢迎大家指出我论文中的问题,特别是语法与用词问题在github上,我也上传了完整的项目:https://github.com/Whiffe/Custom-ava-dataset_Custom-Spatio-Temporally-Action-Video-Dataset关于自定义ava数据集,也是后台
【视频+源码】登录鉴权的三种方式:token、jwt、session实战分享
因为我既对接过session、cookie,也对接过JWT,今年因为工作需要也对接了gtoken的2个版本,对这方面的理解还算深入。尤其是看到官方文档评论区又小伙伴表示看不懂,所以做了这期视频内容出来:视频在这里:本期内容对应B站的开源视频因为涉及的知识点比较多,视频内容比较长。如果你觉得看视频浪费时间,可以直接阅读源码:goframe v2版本集成gtokengoframe v1版本集成gtokengoframe v2版本集成jwtgoframe v2版本session登录官方调用示例文档jwt和sess
【Android App】实战项目之仿微信的私信和群聊App附源码和演示视频 超详细必看
【Android App】实战项目之仿微信的私信和群聊App(附源码和演示视频 超详细必看)
采用MATLAB对正弦信号,语音信号进行生成、采样和恢复,利用MATLAB工具箱对混杂噪声的音频信号进行滤波
采用MATLAB对正弦信号,语音信号进行生成、采样和内插恢复,利用MATLAB工具箱对混杂噪声的音频信号进行滤波
Keras深度学习实战40——音频生成
随着移动互联网、云端存储等技术的快速发展,包含丰富信息的音频数据呈现几何级速率增长。这些海量数据在为人工分析带来困难的同时,也为音频认知、创新学习研究提供了数据基础。在本节中,我们通过构建生成模型来生成音频序列文件,从而进一步加深对序列数据处理问题的了解。
  • • 效率成吨提升之代码生成器-蓝湖工具神器…
  • • 【Audio音频开发】音频基础知识及PCM技…
  • • 见过仙女蹦迪吗?一起用python做个小仙…
  • • 【Android App】实战项目之仿抖音的短视…
  • • 自定义ava数据集及训练与测试 完整版 时…
  • • 【视频+源码】登录鉴权的三种方式:tok…
  • • 【Android App】实战项目之仿微信的私信…
  • • 零基础用Android Studio实现简单的本地…
  • • 采用MATLAB对正弦信号,语音信号进行生…
  • • Keras深度学习实战40——音频生成
  • • 视频实时行为检测——基于yolov5+deeps…
  • • 数电实验 数字电子钟设计 基于quartus …
  • • 腾讯会议使用OBS虚拟摄像头
  • • 文本生成视频Make-A-Video,根据一句话…
  • • 信号处理——MATLAB音频信号加噪、滤波
  • • 【新知实验室 - TRTC 实践】音视频互动…
  • • Keras深度学习实战39——音乐音频分类
  • • C++游戏game | 井字棋游戏坤坤版配资源…

Swift Tutorial(swift 教程) 4:Your First App的更多相关文章

  1. HTML5 播放 RTSP 视频的实例代码

    目前大多数网络摄像头都是通过 RTSP 协议传输视频流的,但是 HTML 并不标准支持 RTSP 流。本文重点给大家介绍HTML5 播放 RTSP 视频的实例代码,需要的朋友参考下吧

  2. HTML5 input新增type属性color颜色拾取器的实例代码

    type 属性规定 input 元素的类型。本文较详细的给大家介绍了HTML5 input新增type属性color颜色拾取器的实例代码,感兴趣的朋友跟随脚本之家小编一起看看吧

  3. 利用Node实现HTML5离线存储的方法

    这篇文章主要介绍了利用Node实现HTML5离线存储的方法,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  4. amazeui模态框弹出后立马消失并刷新页面

    这篇文章主要介绍了amazeui模态框弹出后立马消失并刷新页面,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  5. 移动HTML5前端框架—MUI的使用

    这篇文章主要介绍了移动HTML5前端框架—MUI的使用的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  6. 详解如何通过H5(浏览器/WebView/其他)唤起本地app

    这篇文章主要介绍了详解如何通过H5(浏览器/WebView/其他)唤起本地app的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  7. H5混合开发app如何升级的方法

    本篇文章主要介绍了H5混合开发app如何升级的方法,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧

  8. AmazeUI 折叠面板的实现代码

    这篇文章主要介绍了AmazeUI 折叠面板的实例代码,本文通过实例代码给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  9. HTML5手指下滑弹出负一屏阻止移动端浏览器内置下拉刷新功能的实现代码

    这篇文章主要介绍了HTML5手指下滑弹出负一屏阻止移动端浏览器内置下拉刷新功能的实现代码,代码简单易懂,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友参考下吧

  10. Html5 video标签视频的最佳实践

    这篇文章主要介绍了Html5 video标签视频的最佳实践,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧

随机推荐

  1. Swift UITextField,UITextView,UISegmentedControl,UISwitch

    下面我们通过一个demo来简单的实现下这些控件的功能.首先,我们拖将这几个控件拖到storyboard,并关联上相应的属性和动作.如图:关联上属性和动作后,看看实现的代码:

  2. swift UISlider,UIStepper

    我们用两个label来显示slider和stepper的值.再用张图片来显示改变stepper值的效果.首先,这三个控件需要全局变量声明如下然后,我们对所有的控件做个简单的布局:最后,当slider的值改变时,我们用一个label来显示值的变化,同样,用另一个label来显示stepper值的变化,并改变图片的大小:实现效果如下:

  3. preferredFontForTextStyle字体设置之更改

    即:

  4. Swift没有异常处理,遇到功能性错误怎么办?

    本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请发送邮件至dio@foxmail.com举报,一经查实,本站将立刻删除。

  5. 字典实战和UIKit初探

    ios中数组和字典的应用Applicationschedule类别子项类别名称优先级数据包contactsentertainment接触UIKit学习用Swift调用CocoaTouchimportUIKitletcolors=[]varbackView=UIView(frame:CGRectMake(0.0,0.0,320.0,CGFloat(colors.count*50)))backView

  6. swift语言IOS8开发战记21 Core Data2

    上一话中我们简单地介绍了一些coredata的基本知识,这一话我们通过编程来实现coredata的使用。还记得我们在coredata中定义的那个Model么,上面这段代码会加载这个Model。定义完方法之后,我们对coredata的准备都已经完成了。最后强调一点,coredata并不是数据库,它只是一个框架,协助我们进行数据库操作,它并不关心我们把数据存到哪里。

  7. swift语言IOS8开发战记22 Core Data3

    上一话我们定义了与coredata有关的变量和方法,做足了准备工作,这一话我们来试试能不能成功。首先打开上一话中生成的Info类,在其中引用头文件的地方添加一个@objc,不然后面会报错,我也不知道为什么。

  8. swift实战小程序1天气预报

    在有一定swift基础的情况下,让我们来做一些小程序练练手,今天来试试做一个简单地天气预报。然后在btnpressed方法中依旧增加loadWeather方法.在loadWeather方法中加上信息的显示语句:运行一下看看效果,如图:虽然显示出来了,但是我们的text是可编辑状态的,在storyboard中勾选Editable,再次运行:大功告成,而且现在每次单击按钮,就会重新请求天气情况,大家也来试试吧。

  9. 【iOS学习01】swift ? and !  的学习

    如果不初始化就会报错。

  10. swift语言IOS8开发战记23 Core Data4

    接着我们需要把我们的Rest类变成一个被coredata管理的类,点开Rest类,作如下修改:关键字@NSManaged的作用是与实体中对应的属性通信,BinaryData对应的类型是NSData,CoreData没有布尔属性,只能用0和1来区分。进行如下操作,输入类名:建立好之后因为我们之前写的代码有些地方并不适用于coredata,所以编译器会报错,现在来一一解决。

返回
顶部