前言

来啦老铁！

在前2期，我们一起探索了如何创建一个最简单的Android应用，有兴趣的朋友烦请移步：

• 老铁，原来做个Android App这么简单~

今天呢，咱们再来简单学点iOS知识，拓展拓展视野：

• 创建一个最简单的iOS应用！

（默认大家都有一台mac设备，都从appStore装好最新版的Xcode了哈~）

整体步骤

1. Xcode中创建iOS项目；
2. 运行iOS项目；
3. 编写简单的交互；

1. Xcode中创建iOS项目；

• 打开Xcode，选择创建新Xcode项目；

  
  新建Xcode项目

• 选择要创建的app的类型，如跨平台或iOS或macOS等，我选择iOS，开发iOS应用；

  
  选择app类型

• 配置项目基本信息；

  
  项目基本信息

• 选择项目存放目录；

  
  项目存放目录

Create点击完成后，我们就能在Xcode中看到创建出的项目，其项目结构为：

项目结构

其实截止目前，整个项目已经可以运行！接下来我们来运行看看~

2. 运行iOS项目；

• 选择要安装app的设备，可以选择连接至电脑的真机，也可以选择模拟器；

  
  设备选择入口

设备列表

• 直接运行项目；

  
  运行入口1

运行入口2

• 运行画面；
  由于笔者前段时间刚把iphone给换了，没有iphone机器，因此选择模拟器进行演示；

运行画面

期盼已久的 “Hello, world!” 终于出现在iphone上啦！

3. 编写简单的交互；

1. 双击项目下com.example.test下的ContentView.swift文件，我们会看到打开了代码编辑器与预览窗口；

拖动添加元素.jpg 代码与预览.jpg

2. 拖动元素到预览页面；

   
   添加页面元素入口.jpg

添加按钮.jpg 拖动添加元素.jpg

我们能看到一个按钮已经被添加到页面上了，所见即所得；

3. 编写交互逻辑代码；
   我们来个简单的，将“Hello, world!”更改成其他文字，例如“你好世界！”；

思路是：

• 声明一个变量如 outputText，默认值为“Hello, world!”，并将文本框的值设置为 outputText 变量；
• 按钮绑定事件，更改 outputText 变量的值即可；
  ContentView.swift 代码如下：

//
//  ContentView.swift
//  com.example.test
//
//  Created by diren on 2021/7/17.
//

import SwiftUI

struct ContentView: View {
    @State var outputText: String = "Hello, world!"
    
    var body: some View {
        VStack {
            Text(outputText)
                .padding()
            Button(action: {
                self.outputText = "你好世界！"
            }) {
                Text("这是个按钮")
            }
        }
    }
}

struct ContentView_Previews: PreviewProvider {
    static var previews: some View {
        ContentView()
    }
}

4. 验证一下；

   
   重新编译安装app

点击按钮后：

改变文本

一个简单的交互就这么完成了，简单吧~

咱们今天也不做过于深入的学习了，到此为止，有兴趣的同学可以跟着玩玩看，也可以自己深入学习，咱们有机会再继续学习app知识~

如果本文对您有帮助，麻烦动动手指点点赞？

谢谢！