SwiftUI 对照教程

给 Android 开发者的 SwiftUI

用 XML 与 Jetpack Compose 对照学 SwiftUI:同一界面,三种写法并排看。

SwiftUI 对照 Compose 对照 XML 约 2–3 小时 先补 Swift 语法
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 XMLJetpack ComposeSwiftUI
界面单元View / ViewGroup@ComposableView protocol
竖排LinearLayout verticalColumnVStack
横排LinearLayout horizontalRowHStack
叠放FrameLayoutBoxZStack
样式/修饰xml 属性 / styleModifier链式 .padding()
本地状态字段 + 手动刷新remember / mutableStateOf@State
列表RecyclerViewLazyColumnList / 网格 / 瀑布见第 6 章
导航Activity / NavNavHostNavigationStack
预览Layout Editor@Preview#Preview

03你怎么学最快

XML 老手

忘掉 findViewById。把属性想成链式修饰符;把嵌套 LinearLayout 想成 VStack/HStack。

Compose 老手

几乎同构:Composable ≈ View,modifier ≈ 修饰符,remember ≈ @State。重点记命名。

两边都写过

直接从第 2 章抄一个 Hello,再死磕第 5 章状态。

语法不熟

先过 Swift 基础语法对照,再回来写 UI。

SwiftUI 新手教程 · 面向 Android / Compose 开发者的对照速通