- SwiftUI 教程
- SwiftUI - 首页
- SwiftUI - 概述
- SwiftUI vs UIkit
- SwiftUI 环境
- SwiftUI - 环境设置
- SwiftUI - 基本组件
- SwiftUI - 构建第一个应用程序
- SwiftUI 视图
- SwiftUI - 视图
- SwiftUI - 自定义文本视图
- SwiftUI - 自定义图像视图
- SwiftUI - 堆栈
- SwiftUI 绘制形状
- SwiftUI - 形状
- SwiftUI - 绘制线条
- SwiftUI - 绘制矩形
- SwiftUI - 绘制圆角矩形
- SwiftUI - 绘制三角形
- SwiftUI - 绘制圆形
- SwiftUI - 绘制星形
- SwiftUI - 绘制多边形
- SwiftUI - 绘制饼图
- SwiftUI - 使用内置形状
- SwiftUI - 文本
- SwiftUI - 文本视图
- SwiftUI - 文本输入和输出
- SwiftUI - 颜色
- SwiftUI - 颜色
- SwiftUI - 颜色选择器
- SwiftUI - 渐变
- SwiftUI - 调整颜色
- SwiftUI - 效果
- SwiftUI - 效果
- SwiftUI - 混合效果
- SwiftUI - 模糊效果
- SwiftUI - 阴影效果
- SwiftUI - 悬停效果
- SwiftUI - 动画
- SwiftUI - 动画
- SwiftUI - 创建动画
- SwiftUI - 创建显式动画
- SwiftUI - 多个动画
- SwiftUI - 过渡
- SwiftUI - 非对称过渡
- SwiftUI - 自定义过渡
- SwiftUI - 图像
- SwiftUI - 图像
- SwiftUI - 图像作为背景
- SwiftUI - 旋转图像
- SwiftUI - 媒体
- SwiftUI - 视图布局
- SwiftUI - 视图布局
- SwiftUI - 视图大小
- SwiftUI - 视图间距
- SwiftUI - 视图填充
- SwiftUI - 列表和表格
- SwiftUI - 列表
- SwiftUI - 静态列表
- SwiftUI - 动态列表
- SwiftUI - 自定义列表
- SwiftUI - 表格
- SwiftUI - 表单
- SwiftUI - 表单
- SwiftUI - 将表单拆分为多个部分
- SwiftUI 有用资源
- SwiftUI - 有用资源
- SwiftUI - 讨论
SwiftUI - 构建第一个应用程序
SwiftUI 是 Apple 开发的一个框架,用于为其所有平台(包括 iOS、macOS、watchOS、tvOS、visionOS 等)创建应用程序。它使用声明式语法来创建应用程序,这意味着开发人员只需要描述用户界面应该是什么样子以及它的行为方式。
例如,我们声明列表应该做什么,而不是逐步说明如何实现列表的操作步骤。它还统一了代码库,这意味着单个代码库可以在所有 Apple 平台上运行。
SwiftUI 与 Xcode 无缝协作。Xcode 是 Apple 的集成开发环境。它为开发 UI 提供了一个强大的平台。SwiftUI 集成了 Xcode 以提供 UI 代码的实时预览、拖放设计工具以及调试和测试工具。因此,在构建新应用程序之前,首先要了解项目结构的基础知识:
- ProjectFile.swift:在项目导航器中,选择“ProjectName”。它是一个使用 SwiftUI 应用程序生命周期的应用程序,其结构符合 App 协议。此结构返回一个或多个场景,这些场景提供要显示的内容。此处,@main 属性表示应用程序的入口点。
- ContentView.swift:在项目导航器中,选择 ContentView。它包含一个视图文件和预览。此处,视图文件被声明为符合 View 协议的结构。它还包含视图内容和布局。此处,预览声明用于创建该视图的预览。
- 画布:它用于自动显示代码的预览。如果画布不可见,请转到编辑器,然后转到画布以显示它。
- 模拟器:它是一个工具,模拟真实设备的硬件和软件环境以运行应用程序并查看它们在没有物理设备的情况下将如何运行。它帮助开发人员测试和调试他们新创建的应用程序。
使用 SwiftUI 创建第一个应用程序
要在 Xcode 中创建应用程序,请按照以下步骤操作:
步骤 1 - 打开 Xcode。
步骤 2 - 点击“创建新项目”。
步骤 3 - 现在选择 iOS 作为平台,然后选择 App 模板,然后点击“下一步”按钮。
步骤 4 - 输入产品的名称,选择“SwiftUI”作为界面,选择“Swift”作为语言。现在点击“下一步”按钮。
步骤 5 - 现在选择要存储项目的存储位置,然后点击“创建”按钮。
步骤 6 - 现在我们准备创建我们的应用程序了。
步骤 7 - 将默认内容替换为以下内容。
import SwiftUI struct ContentView: View { @State private var mtext = "Hello, Tutorialspoint" var body: some View { VStack { ZStack{ Rectangle().fill(Color.green).frame(height:100) Text(mtext).font(.largeTitle).padding() } Button(action: { mtext = "Hello, SwiftUI!" }) { Text("Tap Me") .font(.title).padding() .background(Color.red) .foregroundColor(.white) .cornerRadius(15) } } } } #Preview { ContentView() }
步骤 8 - 预览将自动显示在画布上。
使用 SwiftUI 构建第一个应用程序
当 UI 代码完成后,我们可以在模拟器上运行我们的应用程序以检查它在真实设备上的运行情况,为此,请按照以下步骤操作:
步骤 1 - 打开 Xcode 并打开已完成的项目。
步骤 2 - 选择要使用的模拟设备,例如 iPhone 12、13、14、15 等。
步骤 3 - 现在点击播放按钮或按“cmd + R”或播放按钮在选定的模拟器中运行我们的应用程序。
步骤 4 - 将打开选定的模拟器。现在打开创建的应用程序。