📱 Compose 声明式UI

从零开始学 ✨ 第1课
🎯 什么是声明式UI? 你只需要描述“界面应该长什么样”, 框架自动处理状态变化与更新。就像告诉朋友“我想要一杯橙汁”, 不用关心榨汁机如何运作 —— Compose 帮你搞定一切刷新逻辑。

Compose vs 传统 View 系统

对比维度传统 View (XML + findViewById)Jetpack Compose (声明式)
📐 编程范式 命令式:手动创建 View、调用 setText / addView 等 声明式:描述 UI 状态,自动重组更新
⚙️ 状态管理 需要手动同步状态(find + set),容易遗漏 通过 State / MutableState 自动观察,重组仅更新变化部分
🧩 代码量 通常较多:布局XML + Activity/Fragment + Adapter 更少:一个 Composable 函数搞定布局与逻辑
🔄 刷新机制 手动 notifyDataSetChanged / invalidate 状态变化 → 自动重组 (Recomposition),智能跳过不变部分
🧪 可测试性 依赖 Activity / Fragment,测试较复杂 纯函数式 Composable,轻松单元测试 & 语义树测试

🚀 Compose 核心优势

⚡ 更少代码 · 更高效率
🧩 自然状态驱动
🎨 实时预览 (Live Preview)
🔄 单向数据流
📱 跨平台 (Android, Desktop, Web)
🧪 可组合 & 复用
📣 声明式 UI “描述界面,而非控制步骤” 📊 State 状态变化 🔄 Recomposition 自动重组 @Composable fun 描述UI
🧭 Compose 声明式架构:状态 → 重组 → 界面

📝 直观对比 · 传统 vs Compose

🔧 传统 View (命令式)
// 手动创建 + 更新
TextView tv = findViewById(R.id.tv);
tv.setText(“Hello”);
// 更新时再次 setText
tv.setText(“World”);
✨ Compose (声明式)
@Composable
fun Greeting(name: String) {
    Text(“Hello $name”)
}
// 只需改变 name 状态
// UI 自动重组更新

📍 适用场景 · 什么时候选择 Compose?

🆕 全新项目 📱 多平台 (KMP) ⚡ 快速原型 🧪 高测试要求 🎨 复杂动画/自定义UI 🔄 状态频繁变化 🧩 组件化/复用 📚 学习现代Android

💡 小提示: Compose 与 View 可以混合使用,但新功能推荐纯 Compose 构建, 享受声明式带来的开发效率与愉悦感。