菜单
Jetpack Compose 官方示例与最佳实践参考。涵盖 Compose UI 实现、动画、手势、导航、Material3 主题、 性能优化、测试等所有方面。安卓开发第一要义：参考官方文档和案例！ Triggers: "Compose 怎么写", "Compose 动画", "Compose 导航", "Compose 性能", "Compose 主题", "Jetpack Compose sample", "Material3 Compose", "Compose testing", "Compose best practice"
默认使用会先检查来源的 Prompt；你也可以切换为直接命令，或下载本地副本。
决定是否安装前，请先阅读 SKILL.md，以及 SkillsMP 当前展示的配套文件。
用 Codex 或 Claude 帮你安装 复制这段 Prompt，粘贴到 Codex、Claude 或其他助手里，让它检查 Skill 页面并帮你完成安装。
直接命令不会经过审查 Prompt；运行前请先检查来源。
npx skills add https://github.com/Kototoro-app/Kototoro --skill android-compose-reference命令会保持在同一行。复制前请横向滚动并检查完整内容。
想先保存到本地？可下载 SkillsMP 当前能够提供的文件。
基于 SOC 职业分类
正在显示 SKILL.md
| name | android-compose-reference |
| description | Jetpack Compose 官方示例与最佳实践参考。涵盖 Compose UI 实现、动画、手势、导航、Material3 主题、 性能优化、测试等所有方面。安卓开发第一要义：参考官方文档和案例！ Triggers: "Compose 怎么写", "Compose 动画", "Compose 导航", "Compose 性能", "Compose 主题", "Jetpack Compose sample", "Material3 Compose", "Compose testing", "Compose best practice" |
安卓开发第一要义：参考官方文档和案例！
Compose 是现代 Android UI 开发的推荐方式。以下仓库由 Android 团队维护， 是学习 Compose 最佳实践的第一手资料。
官方的 Jetpack Compose 示例集合 — Compose 学习首选仓库。
内含多个完整应用示例：
| 示例应用 | 展示内容 |
|---|---|
| JetNews | 新闻阅读应用 — Compose 基础：列表、导航、主题 |
| Jetchat | 聊天应用 — 高级 Compose：动画、状态提升、自定义布局 |
| JetSnack | 电商应用 — 复杂布局、图片处理、BottomSheet |
| Crane | 旅行应用 — Material3、自定义绘制、MapView 集成 |
| Owl | 教育应用 — 自定义主题、深色模式、复杂排版 |
| Reply | 邮件应用 — 自适应布局（手机/平板/折叠屏）、WindowSizeClass |
关键学习路径：
compose-samples/
├── JetNews/ # 💡 新手入门：基础 Compose
├── Crane/ # 🎨 Material3 + 自定义主题
├── Jetchat/ # 🚀 进阶：动画 + 状态管理
├── Reply/ # 📱 自适应布局
└── Owl/ # 🎭 高级主题定制
生产级 Compose 应用 — 架构参考首选。
展示内容：
:core:ui, :feature:*, :core:data 等）架构模式演进 — 理解 Compose 时代的架构。
关键分支：
main：UDF + StateFlow，当前推荐views：经典 View 架构compose：Compose 架构演进View → Compose 迁移 — 适合从 View 迁移到 Compose 的项目。
展示 View 代码如何逐步迁移到 Compose。
UI 专项示例 — 深入 UI 细节。
关键示例：
WindowInsetsAnimation — 键盘动画、系统栏适配MotionLayout — 复杂交互动画CustomLayout — 自定义 Compose LayoutAccessibility — 无障碍Insets — WindowInsets 处理| 仓库 | 说明 |
|---|---|
| nav3-recipes ⭐1.3k | Navigation3 常见用例：类型安全导航、深层链接、BottomNavigation 集成、返回栈管理等 |
| codelab-android-navigation ⭐633 | Navigation Codelab |
Navigation3 类型安全导航（推荐）：
// 定义路由（类型安全，无需字符串）
@Serializable data class Profile(val id: String)
// 导航
navController.navigate(Profile(id = "123"))
参考仓库：
官方文档：Material Design 3 for Compose
参考仓库：
Compose 动画 API 层级：
animate*AsState → 简单属性动画（推荐起手）
AnimatedVisibility → 显示/隐藏动画
AnimatedContent → 内容切换动画
Crossfade → 淡入淡出
updateTransition → 多属性协同动画
rememberInfiniteTransition → 无限循环动画
AnimationSpec → 自定义动画曲线（tween, spring, keyframes）
参考仓库：testing-samples ⭐9.3k
Compose 测试三件套：
// 1. 元素查找
composeTestRule.onNodeWithText("Submit")
// 2. 交互
composeTestRule.onNodeWithText("Submit").performClick()
// 3. 断言
composeTestRule.onNodeWithText("Success").assertIsDisplayed()
含截图测试（Screenshot Testing）、语义测试等高级主题。
参考仓库：performance-samples ⭐1.4k
关键主题：
@Stable / @ImmutableLazyColumn / LazyRow 优化| 仓库 | 说明 |
|---|---|
| adaptive-apps-samples | 自适应布局示例 |
| large-screen-codelabs | 大屏/折叠屏适配 |
关键 API：
WindowSizeClass — 根据窗口尺寸调整布局BoxWithConstraints — 约束感知布局LocalConfiguration.current — 配置变化响应当需要实现 Compose 相关功能时:
1. compose-samples 中搜索相似 UI → 找到参考实现
2. nowinandroid 中搜索架构模式 → 理解状态管理
3. user-interface-samples 中搜索细节 → 手势/Insets/动画
4. 在官方实现基础上适配 → 而非从零开始
禁止：从非官方博客/教程中复制代码而不验证。任何第三方方案都要和官方示例对比。