给 Android 开发者的 SwiftUI
用 XML 与 Jetpack Compose 对照学 SwiftUI:同一界面,三种写法并排看。
8
对照章节
XML
声明式布局前辈
Compose
主对照体系
SwiftUI
目标框架
01 心智模型
→
02 View 与布局
→
03 状态与列表
→
04 导航实战
01这是什么 / 不是什么
给写过 Android XML 或 Compose 的人,快速建立 SwiftUI 肌肉记忆。
是什么
- SwiftUI 入门:布局、修饰符、状态、列表、导航
- 每章尽量给出 XML ↔ Compose ↔ SwiftUI 三栏对照
- 先跑通一个可预览界面,再补数据流
不是什么
- 不是 UIKit 深挖、不是完整 App 架构课
- 不是 Swift 语言教程(可先看语法篇)
- 不是动画 / 自定义 Drawing 专题
心智迁移口诀:XML 是「树状资源 + findViewById」;Compose / SwiftUI 都是「用代码描述 UI,状态变了自动重绘」。
02一张表先对齐
| 概念 | Android XML | Jetpack Compose | SwiftUI |
|---|---|---|---|
| 界面单元 | View / ViewGroup | @Composable | View protocol |
| 竖排 | LinearLayout vertical | Column | VStack |
| 横排 | LinearLayout horizontal | Row | HStack |
| 叠放 | FrameLayout | Box | ZStack |
| 样式/修饰 | xml 属性 / style | Modifier | 链式 .padding() |
| 本地状态 | 字段 + 手动刷新 | remember / mutableStateOf | @State |
| 列表 | RecyclerView | LazyColumn | List / 网格 / 瀑布见第 6 章 |
| 导航 | Activity / Nav | NavHost | NavigationStack |
| 预览 | Layout Editor | @Preview | #Preview |
03你怎么学最快
XML 老手
忘掉 findViewById。把属性想成链式修饰符;把嵌套 LinearLayout 想成 VStack/HStack。
Compose 老手
几乎同构:Composable ≈ View,modifier ≈ 修饰符,remember ≈ @State。重点记命名。
两边都写过
直接从第 2 章抄一个 Hello,再死磕第 5 章状态。
语法不熟
先过 Swift 基础语法对照,再回来写 UI。