Fork me on GitHub

开始用Swift开发iOS 10 - 2 Hello World!第一个Swift APP

预览.png

“Hello,World”已经成为编程世界里开始的惯例。

开始:先动起来,忘记代码

  1. 打开Xcode,选择”Create a new Xcode project”

Xcode - Welcome Dialog.png

  1. 选择 iOS > Single View Application and click Next

Xcode Project Template Selection.png

  1. 填写项目的一些选项:

Options for your new project.png

  • Product Name: HelloWorld - app的名字
  • Team - Apple ID
  • Organization Name: andyron - 这一般是组织的名字,或个人用户的名字;尽量保持不与别人重复
  • Organization Identifier: cn.andyron
  • Bundle Identifier: com.andyron.HelloWorld - 根据Organization IdentifierProduct Name自动组合而成
  • Language: Swift
  • Devices: iPhone
  • Use Core Data: [unchecked]
  • Include Unit Tests: [unchecked]
  • Include UI Tests: [unchecked]
    1. 选择一个项目保持位置,然后生成项目

熟悉Xcode界面

Xcode Help中详细介绍了Xcode,主界面如下:

Xcode主界面

主要分六个区域:

  1. Toolbar(工具栏)

  1. Tab bar(便签页栏):类似浏览器的标签页,快捷键也和大部分软件的相同(⌘+T新建,⌘+W关闭),单个标签页时是隐藏的
  2. Navigator area(导航区域)
    这个区域最上面有八个图标(快捷键分别对应⌘+1 ~ ⌘+8):
    • project navigator(源代码文件、图片文件、数据模型、属性列表等)
    • symbol navigator(编译器能识别的:OC类、枚举类型、结构体、全局变量)
    • find navigator
    • issues navigator
    • test navigator
    • debug navigator
    • breakpoint navigator
    • log navigator
  3. Editor area(编辑区)
    这个区域最上面是jump bar(跳转栏)
  4. Debug area
  5. Utilities area(实用工具面板)

    分上下两块:
    • Inspector pane(检查器):选择不同文件会有不同个数的检查器,最多六个(快捷键分别对应⌘+option+1 ~ ⌘+option+6)。
    • Library pane(库面版, 快捷键分别对应⌘+option+control+1 ~ ⌘+option+control+4)
      • 文件库模板(File Template Library) : 管理文件模板, 可以快速创建指定类型文件, 可以直接拖入项目中;
      • 代码片段库(Code Snippet Library) : 管理各种代码片段, 可以直接拖入源代码中;
      • 对象库(Object Library) : 界面组件, 可以直接拖入 故事板中;
      • 媒体库(Media Library) : 管理各种 图片, 音频 等多媒体资源;

第一次运行App

Run和Stop分别对应 ⌘+R⌘+.,Simulator用于选择模拟器或真实设备
 Run and Stop Buttons

快速了解Interface Builder(IB)

project navigator中选择main.storyboard
The Interface Builder Editor.png
The Interface Builder editor为创造和设计app的UI提高了一个可视化的方法。在这里既可以设计单个页面,也可以设计多个页面。可以直接从右下角Object library拖动可用对象到IB中。
当开始新建项目,选择了Single View Application模板时,Xcode默认在storyboard中生成一个view controller scene,对应一个view controller通常app的每一个screen代表一个view controller。
The Document Outline view在选择storyboard特定对象时特别有用。

设计UI

  • 拖动一个Button到IB中
    Drag the Button to the View.png
  • 双击Button或在属性检查器中修改name为”Hello World**
  • 根据蓝色虚线辅助线可以把Button拖到中心位置

写代码

  • 选择main.storyboard,点击工具栏右侧的Assistant editor(option+⌘+return),编辑区出现两部分,Ctrl拖动按钮到右侧ViewController类中:


然后写下如下代码:

1
2
3
4
5
6
7
@IBAction func showMessage() {
let alertController = UIAlertController(title: "Welcome to My First App",
message: "Hello World", preferredStyle: UIAlertControllerStyle.alert)
alertController.addAction(UIAlertAction(title: "OK", style:
UIAlertActionStyle.default, handler: nil))
present(alertController, animated: true, completion: nil)
}

上面的方法是先连接关系,然后写代码;也可以先写好代码,然后建立关系:

@IBAction表示一个Action的标识符,没有特殊意义,当建立好关系后,@IBAction右侧会出现一个实心的点,点击会出现会出现以个弹框表示连接的地方:

  • 修改按钮的颜色。选中按钮,在属性检查器中修改对应属性

测试应用

选择特定的模拟器或设备,⌘+R

Hello world 应用中事件流

Event flow.png

更近一步

  • 同上的方法添加几个按钮,并修改button的name为一些emoji表情(control+⌘+space
  • 添加@IBAction方法代码
  • 通过先写好代码然后建立关系的方法,把几个button都与同一个@IBAction方法建立关系

代码

HelloWorld
HelloWordExercise

说明

此文是学习appcode网站出的一本书 《Beginning iOS 10 Programming with Swift》 的一篇记录

坚持原创技术分享,您的支持将鼓励我继续创作!
  • 本文标题: 开始用Swift开发iOS 10 - 2 Hello World!第一个Swift APP
  • 本文作者: AndyRon
  • 发布时间: 2017年07月04日 - 00:00
  • 最后更新: 2017年09月09日 - 13:00
  • 本文链接: http://andyron.com/2017/beginning-ios-swift-2.html
  • 版权声明: 本博客所有文章除特别声明外,均采用 CC BY-NC-SA 3.0 许可协议。转载请注明出处!