2023 年 O 基础学习 SwiftUI

关于 SwiftUI

SwiftUI 于2019年6月3日在苹果的全球开发者大会（WWDC）上首次亮相。在这次活动中，苹果正式宣布了 SwiftUI，并将其列为 iOS 13 和 macOS Catalina 的一部分。

SwiftUI 是一种用于构建用户界面的 UI 框架。SwiftUI 的设计目标是简化用户界面开发过程，提高开发效率，并在不同的环境里实现更高程度的代码共享。自发布以来，SwiftUI 已经经历了多个版本的更新，不断增强其功能和性能。以下是 SwiftUI 的一些主要特点：

声明性语法： SwiftUI 使用声明式语法，开发人员可以通过描述界面的方式来定义用户界面。这种方式更加直观、简洁，开发者只需关注描述用户界面的内容，而无需处理底层的实现细节。
实时预览： SwiftUI 提供实时预览功能，使开发者能够在代码编写的同时即时查看界面的外观和行为。这有助于快速调整和测试界面，提高开发效率。
自动化布局： SwiftUI 通过使用自动布局来处理不同设备和屏幕尺寸之间的差异。这简化了适配工作，开发者无需手动管理所有细节。
数据驱动视图： SwiftUI 的视图是数据驱动的，当数据发生变化时，界面会自动更新以反映最新的状态。这降低了手动管理界面状态的复杂性。
可组合性： SwiftUI 鼓励使用小型、可组合的视图来构建复杂的用户界面。这使得代码更易于理解、维护和重用。
深度集成： SwiftUI 深度集成了其他苹果生态系统的技术，如 Combine 框架用于响应式编程，以及 Swift 语言的特性。这样，开发者可以更好地利用整个苹果开发平台。

通过 SwiftUI，开发者能够更高效地构建出现代化、动态且易于维护的用户界面，同时充分发挥 Swift 编程语言的优势。它后续必然会逐渐成为苹果生态系统中应用程序界面开发的首选框架。

多么简单？

如果你了解产品设计，比如微信首页，点击进入详情页，知道导航是什么，那你应该可以看得懂下面的代码。

swift
复制代码
struct WechatView: View {
    var users: [User] = []
    var body: some View {
        NavigationView {
            ScrollView {
                ForEach(users) { user in
                    NavigationLink {
                        WechatDetailView(user: user)
                    } label: {
                        HomeCellView(user: user)
                    }
                }
            }.navigationTitle("Wechat")
        }
    }
}

从上面的代码里，有几个关键字，简单解释下：

NavigationView：也就是我们的导航栏，首页显示微信名字和加号按钮的地方就是导航，并且在各个页面也基本都存在的，由他来控制着页面的加载和返回；
ScrollView：也就是让页面可以滑动；
ForEach：也就是循环，用来展示首页的列表数据；
NavigationLink：也就是点击首页的聊天列表，可以进入到详情页；
HomeCellView：首页显示的每个聊天内容；
WechatDetailView：首页聊天点击进入的详情页；
navigationTitle：显示导航栏里的微信名称。如果你看得懂这些知识，那基本可以判定你可以学习 SwiftUI，当然如果真正做到和微信首页可以使用的效果，还需要有一些更加细节的修改，但是这些基础的知识如果你能了解，对于学习使用 SwiftUI 基本难度不大，只需要详细了解各个模块里对应代码的使用即可。

适合 O 基础的人群

在之前 Apple 应用的开发里，需要涉及到不同的内容，比如按钮，输入框，日期选择都是不同的类型元素，我们每个都需要仔细去了解学习才可以更好的使用，就像是有的是陨石，有的是足球，而有的是海水，而在 SwiftUI 来，每个使用的元素基本都是一个 View，只是这个 View 的属性可能不一样，比如 View 就是人类，而 SwiftUI 里的元素，有的是白皮肤，有的是黄皮肤，有的蓝色眼球，而有的耳朵比较大，因为都是人类，这些不同的种族作为人的共性都是通用的，比如双脚直立行走，比如可以适应环境。

SwiftUI 的这种特性，使得初学者在入门难度上大大降低，0 基础入门，2-3 天就可以写一个最简单的静态页面，随着最近几年 SwiftUI 的逐步稳定，已经逐步成为很多开发者的首选，特别是刚入门的开发者。

可以用 SwiftUI 来做什么？

互联网发展到 2023 年，基本所有的产品形态都已经存在，作为独立开发者，我们还能做什么成为一个比较尖锐的问题，有几点建议可以参考。

选择工具类型的产品，相对比来说这类产品复杂度不高，架构相对简单，使用 SwiftUI 可以很好的满足这类产品需求。
从自身发现小需求，如果你作为一个 0 基础小白，那最好的方法是从自身的需求来寻找一个出发点，然后查看市场上已经存在的同类产品，找到一个不一样的切入点，满足一个特定的需求，然后运营你的目标用户。
从新思考，在已经存在的这些产品类目里，我们常用的笔记熟悉的产品里，从新去思考，发现一些可以优化或者现在满足的不太好的产品点，去满足。大家熟知的产品经理纯银老师在微博里透露的下一款工具类型的打卡记录的产品，就属于这种类型。
即使你现在暂时没有特别好的点子，只是对这个感兴趣也是可以的，不同的点子在你接触和使用产品的过程中总会自动跳跃出来的，而那个时候你已经有了开发这个技能。

一些可能的问题

SwiftUI 从 2019 年上线之后，经历了几个大版本的变动，现在已经基本上处于稳定的状态，但是在各种未知的情况下依然可能存在一些小的问题，比如某些版本导航可能出问题了，但是我们终究有些办法去解决。

SwiftUI 提供了一个可以嫁接 Swift 的方法，一些存在问题的内容我们可以直接使用 Swift 的功能，而不需要担心你不会，存在的问题在互联网上基本都已经有解决方案。
改变设计方案，有些可能存在的问题，我们可以通过修改设计方案来改变问题，以我使用 SwiftUI 到目前为止的经验，存在的问题都是可以解决的。
版本支持，在越老的版本上可能存在的问题越多，因此建议如果我们使用 SwiftUI 开发应用，就支持最近的 1-2 个大版本即可，无法做到适配到太低的版本。

学习资源

SwiftUI 作为一个如此简单的入门开发框架，作为一个 0 基础的小白，该如何入门呢，有很多的开发资源我们可以学习使用。

苹果的官方教程，各种涉及到的内容都可以在官方网站找到释义。
Hacking with Swift，Paul Hudson有大量开发方面的内容，免费和付费的都有，提供了大量优秀的免费内容，100 Days of SwiftUI 便是面向 SwiftUI 初学者的一个合集。
Raywenderlich 是一个技术的老牌书籍出版公司，提供了大量的免费课程，同时有有很多 SwiftUI 的内容，可以进行学习。
ChaoCode 是一位台湾女生的视频讲解内容，适合有一定基础之后，更深入的了解很多背后的原理。
肘子的 Swift 记事本，肘子老师关于 SwiftUI 开发内容的博客，涉及到的内容比较全面，可以多多关注。

以上的资源更偏向于已经有一定基础的人群，在我们学习和使用 SwiftUI 的过程中发现，对于 0 基础用户的教程相对较少，因此我们开发了「做个应用」这个 App，将我们学习到的内容整理出来，让一个 0 基础的人，可以从 0 开始到做一个完整的上线应用，从 Xcode 的使用，到基础元素，到设计模式，到测试，到打包上线，到应用商店内容设置等等，详细的描述了各个环节涉及到的内容，让你只需要按照章节进行学习即可，帮助你快速获得 SwiftUI 这项技能。

关于「做个应用」

支持 iPhone、iPad 和 Mac 端，可以在 App Store 搜索「做个应用」或者「SwiftUI」下载。

O 基础模式

按照章节的难易程度，我们划分为了 0 基础模式和中高级模式，作为初学者，你可以直接筛选 0 基础模式，更快的了解 SwiftUI，更容易的上手，学习完 SwiftUI 的基础知识，你也就可以做出一个最简单的基础应用。

每日小知识

每日推送的小知识，涉及到方方面面，让你每天学到一点新鲜的内容，在不知不觉中可以得到更多的提高，同时也可以督促你进行学习，了解更多方面的内容，日积月累你也可以很熟练的掌握 SwiftUI 的内容。

代码块

针对不是在章节里的一些内容，我们以代码块的形式展示给你，比如 Mac 下如何设置开机启动，iOS 下页面返回按钮隐藏的时候如何设置页面左侧滑动返回，这些涉及到开发里的方方面面的细节内容可以更好的帮助你进行快速开发，不会卡在一些常见的难点上，让你学习的难度大大降低。

和你一起做个练习

学习的目的在于掌握内容，因此我们在学习的过程中需要大量的练习，针对练习的内容，我们主要提供了两个大类：

首先是章节练习，针对每个章节里设计到的内容，我们都会提供相应的内容来进行练习，通过练习来巩固学习到的内容，并且进行深化。
其次是一起做个应用，我们里面包含了一个完整的开源应用，我们会带着你一起从 0 开始，逐步完善到上线。带你了解开发的各个环节。

视频教学

如果文字的教学过于无聊，我们提供了视频的教学内容，可以在设置里关注我们的各个视频平台进行学习。与其他博主的视频相比，更偏向于教学如何使用，可能暂时不会有太多的原理性的讲解，待后续内容都完善之后会带来 SwiftUI 更多原理性的讲解视频。

笔记

对于入门学习 SwiftUI 前期可能存在各种问题，就像我们学习的时候需要一个笔记来记录我们学到的并没有完全掌握的内容，做个应用也推出了笔记功能，你可以把平时学习到的内容，需要后续复习，或者可能在未来会用到的内容，添加到笔记里，方便后续随时寻找使用。另外一个点就是我们平时可能会看到很多的文章内容，但是这些内容在我们下次希望使用的时候却没办法快速找到，因此在笔记里我们可以通过快捷分享的方式添加到笔记里，方便后期的查找。笔记的管理也是提高我们在使用笔记时能快速找到内容的方法，我们可以通过文件夹和标签进行管理，相同类型的内容我们可以设置文件夹，比如 iOS 和 Mac，比如编辑器，或者网页，也可以通过设置标签来管理内容，在添加的时候给内容打上相应的标签，就可以直接筛选标签找到相应的内容。

另外对于目前 iOS 端，我们可以通过分享来添加链接到笔记里，大大节省了操作时间。

练习

就像我们作为学生的学习，需要大量的练习，在你入门之后，需要大量的练习来让我们更深化对元素的时候，对概念的理解，除去跟随应用里的练习，我们还可以自行寻找内容进行练习。需要注意的是找内容来自己练习是可以的，但是如果要发布的时候，注意版权问题。

Figma 社区，Figma 是一款设计软件，在社区里有很多的开源设计，我们可以找到相应的内容，就得到一份 UI 设计稿，我们就可以根据设计来实现出来，当你看到自己实现出来的设计，会有很大的成就感，可以很大的激励你的学习。
Dribble 和 Behance 社区，是国外的设计社区，有点是设计内容更丰富，缺点是大部分都只有图片，需要自己根据图片大致开发。
UI 中国等国内的设计社区，也可以在里面找到很多相关的设计，可以自行用来练习。

万事开头难，如果你想「做个应用」，希望 SwiftUI 可以帮助到你。