SwiftUI入门指南

SwiftUI简介
#

SwiftUI是Apple于2019年WWDC推出的声明式用户界面框架，用于构建 iOS、macOS、watchOS、tvOS和visionOS等Apple平台的应用界面。它完全基于Swift语言，让开发者用更少、更简洁的代码描述“界面应该是什么样子”，框架自动处理布局、更新和动画等细节。

主要特点
#

声明式编程：你描述最终 UI 状态（“是什么”），而非命令式步骤（“怎么做”）。
实时预览：在Xcode中即时看到界面变化，无需反复编译运行。
跨平台一致：同一套代码可在多个Apple设备上运行，自适应不同屏幕尺寸。
数据驱动：界面自动响应数据变化，减少手动刷新代码。
性能优秀：直接基于Metal渲染，效率高。

截至2026年1月，SwiftUI已非常成熟，支持从iOS13+开始的所有系统，并在最新Xcode（支持iOS18+、visionOS 等）中引入了更多高级特性，如增强的3D空间布局、富文本编辑、自定义控件等，已成为Apple 官方推荐的新App开发首选框架。

Swift和SwiftUI的相互关系
#

Swift和SwiftUI是Apple生态中紧密相关的两个核心技术，但它们本质上扮演不同的角色：

SwiftUI依赖于Swift：你必须使用Swift语言来编写SwiftUI代码。SwiftUI充分利用了Swift 的高级特性（如@state、Property Wrapper、函数构建器等），这些特性甚至部分是为 SwiftUI “量身定制”的。
Swift不依赖SwiftUI：你可以用Swift编写非UI代码（如命令行工具、后端服务），或结合其他UI框架（如传统的 UIKit）。
开发AppleApp时，通常是“用 Swift 编写代码，来控制和驱动 SwiftUI构建界面”。简单比喻：Swift 是“告诉电脑做什么的语言”，SwiftUI 是“知道怎么画按钮、文本、列表等的工具包”。

SwiftUI入门指南
#

1.环境搭建
#

推荐：Mac电脑+最新Xcode（从AppStore下载，支持SwiftUI实时预览Canvas）。
最低要求：Xcode11+（但建议最新版以获得最佳体验）。
创建项目：在Xcode中选“App”模板，Interface选SwiftUI，LifeCycle选SwiftUI App。

2.第一个程序：Hello World
#

创建一个新SwiftUI项目，Xcode会自动生成以下代码：swift

import SwiftUI

struct ContentView: View {
    var body: some View {
        Text("Hello, World!")
            .padding()
    }
}

#Preview {
    ContentView()
}

struct ContentView: View：定义一个视图的结构体。
body：返回视图内容，使用声明式语法堆叠组件。
#Preview：实时预览宏（新版 Xcode 支持）。

运行后，你会看到一个简单的 “Hello, World!” 文本。

3. 基础语法示例
#

基本视图组件：swift

VStack {// 垂直堆叠
    Text("欢迎使用 SwiftUI")
        .font(.title)
        .foregroundColor(.blue)

    Image(systemName: "heart.fill")
        .foregroundColor(.red)

    Button("点击我") {
        print("按钮被点击")
    }
}
.padding()

状态管理(@Stata)：数据变化时自动更新界面。swift

@State private var count = 0

var body: some View {
    VStack {
        Text("计数: \(count)")
        Button("加 1") {
            count += 1
        }
    }
}

常用布局容器：

VStack：垂直

HStack：水平

ZStack：叠加

Spacer()：占位推开

padding()、frame()：调整间距和尺寸

导航和列表：swift

NavigationStack {
    List {
        NavigationLink("去详情页") {
            Text("这里是详情")
        }
    }
    .navigationTitle("列表")
}

实时预览：在代码旁按 Resume 即可看到 Canvas 预览，支持多设备模拟。

4. 学习资源推荐（中文优先）
#

Fucking SwiftUI：https://goswiftui.com/ （中文手册、教程、示例，非常全面）
Apple 官方互动教程：https://developer.apple.com/tutorials/swiftui （英文，但有交互式代码；推荐结合翻译）
SwiftUI 中文教程合集：https://github.com/WillieWangWei/SwiftUI-Tutorials （官方教程翻译 + 代码）
SwiftUI 示例项目：https://github.com/jaywcjlove/swiftui-example （大量技巧和实际案例）
菜鸟教程/简书等：搜索 “SwiftUI 入门” 有很多博客。
视频：Bilibili 搜索 “SwiftUI 教程 2025” 或 “Hacking with SwiftUI” 中文字幕版。

SwiftUI学习曲线比UIKit友好得多，尤其是如果你已掌握Swift基础。从官方教程或一个小项目（如Todo List App）开始实践，就能快速上手。建议多用Canvas预览实验，边改代码边看效果。

SwiftUI简介#

主要特点#

Swift和SwiftUI的相互关系#

SwiftUI入门指南#

1.环境搭建#

2.第一个程序：Hello World#

3. 基础语法示例#

4. 学习资源推荐（中文优先）#