Menu
CoddyTech
swift icon属于 Swift 学习旅程新学习旅程

学习 SwiftUI

免费的互动式 SwiftUI 课程。每节课都写真正的 SwiftUI 代码,在实时手机预览中看到它构建出的界面,点一点就能看到状态的变化。无需 Mac 或 Xcode,卡住时有 AI 提示,学完还能获得免费证书。

50 节课50 个挑战106 道测验题

  • 适合初学者
  • sparkles iconAI 辅助编程帮助
  • hint icon动手实践的互动课程
  • quiz icon检验所学的测验
  • certificate icon免费结业证书

课程大纲

1 个单元1 个项目50 节课50 个挑战106 道测验题

本单元属于 Swift 学习旅程。完整大纲还有更多单元:点击下方任意预览,即可在学习旅程页面查看。

  1. 单元 1基础知识86 节课
  2. 单元 2逻辑与流程56 节课
  3. 单元 3面向对象编程57 节课
  4. 开始本单元开始展开收起使用 Swift 和 SwiftUI 构建应用界面,学习视图和修饰符、堆栈与布局、状态和按钮、文本框和开关、列表、导航和共享数据。每节课都会编写真实的 SwiftUI 代码,并实时预览效果。

    简介

    2 节课28

    显示内容

    6 节课615

    堆栈与布局

    5 节课512

    修饰符

    5 节课512

    状态与按钮

    5 节课512

    用户输入

    5 节课512

    列表

    5 节课512

    导航

    5 节课512

    共享数据

    4 节课49

    项目:Coddy 咖啡馆

    5 节课52

    最终挑战

    3 节课3
你将获得
学编程所需的一切

在实践中学习

编写真实代码、查询数据库、搭建网站、掌握 AI 提示词。我们的互动课程涵盖现代开发者需要的每一项技能。

playground.js
代码编辑器
1const greeting = "Hello, Coddy!"
2function sayHi(name) {
3    return greeting + " " + name
4}
5
bottombar Collapse icon
测试 #1test Case Success icon
测试 #2test Case Success icon
测试 #3test Case Failure icon
输入
"Alex"
输出
"Hello, Coddy! Alex"

打造你的连胜

坚持下去,看着自己不断进步!记录每天的编程习惯,用冻结天数保护连胜,每天打卡都能赢取奖励。

12 天连胜

明天再来,保持你的连胜!

fire Filled icon
left icon

January 2026

right icon

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

20

21

21

22

23

24

25

26

27

28

29

30

product Double Or Nothing icon

加倍或归零

第 5 天,共 7 天

fire Freeze icon

连胜冻结

2 left

随时随地写代码

随时随地继续你的编程学习旅程!无需配置,无需下载:打开就能写代码。支持 iOS、Android 和 Web,评分高达 4.9 星。

Python
7连胜
250分数
5能量
变量
journey Hex Done Base iconjourney Hex Done Shadow iconjourney Hex Done Top iconjourney Lesson Done icon
journey Path Right Done icon
journey Hex Done Base iconjourney Hex Done Shadow iconjourney Hex Done Top iconjourney Lesson Done icon
journey Path Left Done icon
journey Hex Active Base iconjourney Hex Active Shadow iconjourney Hex Active Top iconjourney Lesson Theory Challenge icon
继续
journey Path Right icon
journey Hex Locked Base iconjourney Hex Locked Shadow iconjourney Hex Locked Top iconjourney Lesson Theory Challenge icon
journey Path Left icon
journey Hex Locked Base iconjourney Hex Locked Shadow iconjourney Hex Locked Top iconjourney Lesson All icon
学习旅程
目标
排行榜
个人主页
4.9
星星星星星
评分

你并不孤单

在全球排行榜上一较高下,邀请好友赢取奖励,为彼此的成就喝彩。和好友一起编程更有趣!

挑战者联赛
挑战者联赛前 7 名晋级
leaderboard First icon1
avatar 1 icon
fire Filled icon
Alex7+ Days
2840
leaderboard Second icon2
avatar 2 icon
fire Filled icon
Jordan7+ Days
2650
leaderboard Third icon3
avatar 3 icon
fire Filled icon
Sam7+ Days
2420
4
avatar 4 icon
Casey
2180
5
avatar placeholder icon
fire Filled icon
Morgan7+ Days
1950
leaderboard Arrow Up icon晋级区leaderboard Arrow Up icon

多种学习方式

阅读、收听、自我测验、问 AI,或者查阅学过的任何内容。每节课都配合你的节奏。

变量入门
音频

变量是一个有名字的容器,用来存储值,方便你在程序后面引用。

在 Python 中,创建变量只需写下名字、一个等号,再写上要存储的值。

值可以随时间变化。给这个名字重新赋值,它就会指向新的值。

1xSarah

获得证书

每完成一门课程都能获得证书。把证书添加到你的 LinkedIn 个人资料和简历中,向雇主展示你的编程能力。

Coddy结业证书
兹证明张三已成功完成
python iconPython 基础
已验证
日期2026年1月
LinkedIn添加到 LinkedIn

为什么在 Coddy 学 SwiftUI

  • 在浏览器里构建 iPhone 应用界面。无需 Mac、Xcode,也不用配置模拟器:你的代码在我们的服务器上编译,预览会显示它所描述的界面,所以你可以在 Windows、Linux 或 Chromebook 上学 SwiftUI。
  • 每个界面都会用到的 SwiftUI:文本、字体、颜色和 SF Symbols,堆栈、对齐和 Spacer,修饰符链以及顺序为什么重要,按钮和 @State,文本框、开关、滑块和选择器,ForEach 和 List,NavigationStack、弹出页和提示框,然后是用 @Binding 和可观察对象在视图之间共享数据。
  • 可以点击的实时预览。在预览中点一下按钮或拨一下开关,视图就会用新状态重新绘制,让你亲眼看到声明式 UI 是怎么工作的,而不只是读到。你还可以切换到手机外框,把做好的界面保存为截图。
  • 边学边做小应用,从价格标签、天气卡片,到计分器、购物清单和植物指南,最后的项目是一个多页面的咖啡点单应用,学完整个单元还能获得免费的 SwiftUI 证书。

关于学习 SwiftUI 的常见问题

SwiftUI 是什么?

SwiftUI 是 Apple 用 Swift 构建应用界面的框架。你不用手动摆放和更新每个元素,而是描述在当前数据下界面应该显示什么,SwiftUI 负责绘制,并在数据变化时重新绘制。界面由视图组成,视图就是带有 body 的小结构体,你用堆栈把它们组合起来,用修饰符设置样式。同一套代码可以为 iPhone、iPad、Mac、Apple Watch、Apple TV 和 Vision Pro 构建界面。

在这里学 SwiftUI 需要 Mac 或 Xcode 吗?

不需要。每节课都在浏览器里进行:代码在我们的服务器上编译,编辑器旁边的预览会显示它构建出的界面,所以 Windows、Linux 和 Chromebook 都完全可以。要在真实的 iPhone 上运行应用或发布到 App Store,最终还是需要一台装有 Xcode 的 Mac,而你在这里学到的一切都可以直接用上。

这里的预览和 Xcode 的预览一样吗?

作用相同,但它不是 iOS 模拟器。预览由 Coddy 自己实现的、课程所教的那些 SwiftUI 视图渲染,和为你的课程评分的是同一次运行,所以你看到的正是测试所检查的内容。对按钮、开关和链接的点击会在你的代码上重放,所以 @State 的变化会像在真实应用里一样显示出来。它涵盖课程中讲到的视图和修饰符,而不是整个 SwiftUI 框架,所以请把它当作学习的地方,而不是 Xcode 的替代品。

学 SwiftUI 之前应该先学 Swift 吗?

应该,至少要学会基础。SwiftUI 就是 Swift 代码:视图是结构体,@State 包装的是一个属性,列表是对数组的循环,编译器的类型错误也是 Swift 错误。这个单元紧接在 Swift 学习旅程的 Fundamentals 单元之后,那里讲变量、类型、函数、结构体和可选类型,所以如果你刚接触 Swift,就从那里开始。

SwiftUI 和 UIKit 该学哪个?

先学 SwiftUI。它是 Apple 推荐的构建新界面的方式,同样一个界面需要的代码少得多,大多数新教程、示例代码和 Apple 的技术讲座用的都是它。UIKit 是许多现有应用背后的老框架,工作中你可能会遇到,但 SwiftUI 和 UIKit 可以在同一个应用里协同工作,而 SwiftUI 是更容易迈出的第一步。

SwiftUI 难学吗?

基础很快就能上手:几行代码就能把文本、图片和按钮放到屏幕上,每次修改的结果预览都会显示出来。需要练习的是用状态来思考:你改变的是数据,让视图自己重新绘制,而不是亲手修改视图。所以这个单元从 @State 到 @Binding 再到可观察对象,一步一步推进,每章最后都有一个小应用。

可以免费在线学 SwiftUI 吗?

可以。互动式 SwiftUI 单元完全免费:完整的课程内容、每道练习都动手写代码、实时预览、最终项目和证书。开始之前无需安装任何东西,也不用注册 Apple 开发者账号。

学完 SwiftUI 课程能获得证书吗?

能。完成这个单元后,你会获得一份免费的 SwiftUI 结业证书,可以分享到 LinkedIn 或写进简历。它不是 Apple 官方认证,但配合你一路做出的应用,在申请 iOS 开发岗位时是一个有用的证明。

包含这门课程的学习路径

这门课程是一条更长路径中的一步:几门课程按导师会教的顺序排列,每门都有自己的免费证书。

Coddy 编程语言插图

用 Coddy 学习 SwiftUI 入门

开始