寫在開頭

其實自從 Jetpack Compose 面世以來，關于 Flutter 與 Compose 之間的選擇問題就開始在 Android 開發中出現，就如同之前有 iOSer 糾結在 Flutter 和 SwiftUI 之間選誰一樣，首先 Compose 是 Jetpack 系列的全新 UI 庫，理解下這點！Compose 是 Jetpack 系列的成員之一，所以可以被應用到 Android 界面開發中，所以你也可以選擇不用，用不用都能開發 Android 的 UI ，然后再說 Compose 出生的目的：就是為了重新定義 Android 上 UI 的撰寫方式，為了提高 Android 原生的 UI 開發效率，讓 Android 的 UI 開發方式能跟上時代的步伐，

** Compose 是 Android UI 的未來，現階段你可以不會，但是如果未來你會繼續在 Android 平臺的話，你就必須會，**

這里分享大佬寫的Jetpack Compose 鏈接：重磅首發！Android Jetpack Compose 完全開發手冊，從入門到精通！
接下來是分享本文大佬對Jetpack Compose原文作者鏈接：https://www.jianshu.com/p/cd8452321bb4

名詞決議：

以下用到的專業術語可能會有出入，為了避免混淆，下面做一個名詞決議表：

Compose官方檔案中，新發明了一個名詞——“微件” 微件 可以理解為Android目前用到的各種 View，也可以理解為H5前端里常說的 組件，

1 Compose是什么

Jetpack Compose 是用于構建原生界面的新款 Android 工具包，它可簡化并加快 Android 上的界面開發，使用更少的代碼、強大的工具和直觀的 Kotlin API，快速讓應用生動而精彩，

這么一聽感覺有點抽象，不知道再講什么，

我來翻譯一下：

Jetpack Compose 是一款基于Kotlin API，重新定義Android布局的一套框架，它可以更快速地實作Android原生應用，節省開發時長，減少包體積，提高應用性能，

節省開發時長，減少包體積，提高應用性能， 這個聽起來很誘人，我們來看看它的效果如何，

1.1 Android Studio 對Compose 的支持

強大的預覽

這一功能基于新版Android Studio 對Compose 的支持，

新版的Android Studio Arctic Fox(現在還是Canary版本) 中添加了許多新工具來支持Jetpack Compose新特性，比如：實時文字、影片預覽，布局檢查等等，

1.1.1 強大的預覽

新的Android Studio 增加了對文字更改實時預覽的效果，可以在Preview、模擬器、或者真機上實時預覽，

1.1.2 影片預覽

可以在AndroidStudio內查看、檢查或播放影片，還可以逐針播放，

1.1.3 布局檢查器

Android Studio Arctic Fox 增加了布局監測器對Compose的支持，可以分析Compose組件的層級，如下所示：

1.1.4 互動式預覽

在此模式下，你可以與界面組件互動、點擊組件，以及查看狀態如何變化，通過這種方式，你可以快速獲得有關界面如何反應的反饋，并可快速預覽影片，如要啟用此模式，只需點擊“互動”圖示 ，系統即會切換預覽模式，

如需停止此模式，請點擊頂部工具列中的 Stop Interactive Preview，

以上是AndroidStudio對Compose的支持，可以說是大手筆了，

1.2 Jetpack Compose 使用前后對比

你以為Compose只是添加了預覽功能？那可不是，

從普通應用切換到Compose應用，你的應用速度和性能可以得到大幅提升，

我們來看一個Google官方改造的應用示例，

1.2.1 APK 尺寸縮減

用戶最為關心的指標，莫過于 APK 大小，

下面是開啟了 資源縮減 的最小化發布版 APK (使用了 R8) 通過 APK Analyzer 所測量的結果:

關于上述數字的說明:

1、使用了 APK Analyzer 報告的 “APK file size” (而不是下載時的大小)， APK 大小分析

2、在使用了 Compose 后，我們發現 APK 大小縮減了 41%，方法數減少了 17%

1.2.2 代碼行數

源代碼行數雖然不能作為衡量軟體好壞的標準，但是可以對比出一個實驗在“瘦身”上面做了多大的努力，為觀察實驗變化提供了一個統計視角，

從圖中可以看到，XML 行數大幅減少了 76%，再見了，布局檔案，以及 styles、theme 等其他的 XML 檔案 ，

同時，Kotlin 代碼的總行數也下降了，

這就是 APK 能夠瘦身的很大一部分原因，

1.2.3 構建速度

構建速度是開發者們十分關心的一項指標，

這里需要做一些說明：

“完全接入 Compose” 使用的是最新版本的 Dagger/Hilt，該版本使用了 Android Gradle Plugin 7.0 中的新 ASM API，而其他版本使用了較舊的 Hilt 版本，其使用了不同的機制，會嚴重拖慢生成 dex 檔案的時間，

除此之外，Kotlin 編譯器與 Compose 編譯器插件為我們所做的事情，如 位置記憶化、細粒度重組 等作業，構建時間能夠 減少 29%， 可以說十分驚人，

2 如何優雅地使用Compose

上面講了很多Compose的優點，那么，接下來我們如何使用它呢，

2.1 準備

在開始使用Compose之前，你需要具備一下基礎，

• 下載 Android Studio Arctic Fox 或更高版本
• Kotlin 1.4.32 或更高版本
• Kotlin 語言使用無障礙

2.2 如何快速學習Compose

接下來，我將會給大家介紹一份2021年最新整理出來的《Jetpack Compose 完全開發手冊》，手把手教大家Jetpack Compose從入門到精通，

這份資料旨在給希望了解、學習、應用Android Jetpack Compose的小伙伴一個參考資料，

資料詳情

有需要的朋友可以【點擊此處】或者通過下方代碼塊找我免費領取，

//wechat number:
study5233
1
2

希望這份資料可以給希望了解、學習、應用Android Jetpack Compose的小伙伴一個參考，

第一章 初識 Jetpack Compose

1. 為什么我們需要一個新的UI 工具？

2. Jetpack Compose的著重點
   加速開發
   強大的UI工具
   直觀的Kotlin API
   

3. API 設計
   

4. Compose API 的原則
   一切都是函式
   頂層函式（Top-level function）
   組合優于繼承
   信任單一來源
   

5. 深入了解Compose
   Core
   Foundation
   Material
   

6. 插槽API

第二章 Jetpack Compose構建Android UI

1. Android Jetpack Compose 最全上手指南
   Jetpack Compose 環境準備和Hello World
   布局
   使用Material design 設計
   Compose 布局實時預覽
   ……
   

2. 深入詳解 Jetpack Compose | 優化 UI 構建
   Compose 所解決的問題
   Composable 函式剖析
   宣告式 UI
   組合 vs 繼承
   封裝
   重組
   ……
   

3. 深入詳解 Jetpack Compose | 實作原理
   @Composable 注解意味著什么？
   執行模式
   Positional Memoization (位置記憶化)
   存盤引數
   重組
   ……
   

第三章 Jetpack Compose 專案實戰演練（附Demo）

1. Jetpack Compose應用1
   開始前的準備
   創建DEMO
   遇到的問題
   

2. Jetpack Compose應用2

3. Jetpack Compose應用做一個倒計時器
   資料結構
   倒計時功能
   狀態模式
   Compose 布局
   繪制時鐘
   !](https://upload-images.jianshu.io/upload_images/26079141-4d23a67f86c3d631.image?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)

4. 用Jetpack Compose寫一個玩安卓App
   準備作業
   引入依賴
   新建 Activity
   創建 Compose
   PlayTheme
   畫頁面
   底部導航欄
   管理狀態
   添加頁面
   

5. 用Compose Android 寫一個天氣應用
   開篇
   畫頁面
   畫背景
   畫內容
   ……
   

6. 用Compose快速打造一個“電影App”
   成品
   實作方案
   實戰
   不足
   ……
   

3 Compose是否值得一試

前面講到Compose的特性，優缺點，以及如何快速入門、如何正確使用，

那么Compose是否值得應用到專案中來呢？

這些還需要具體情況具體分析，

如果你是新專案，

我建議你大膽嘗鮮，畢竟聰明的“部分重繪”機制，是提高頁面性能的重要手段，而且宣告式布局在未來應該會取代傳統的xml布局形式，這是大勢所趨，

如果你是現有專案改造，

首先，你可以評估一下是否已經具備開始Compose的基礎能力——kotlin語言的靈活運用，

Compose可以說是為Kotlin量身定制的、與View model緊密結合的一種衍生物，有了Kotlin和View model，Compose的作用可以發揮到極致，也就能實作前面的目標：

• 構建時間能夠 減少 29%
• XML 行數大幅減少了 76%
• APK 大小縮減了 41%
• 方法數減少了 17%

如果你已經具備了上述能力，那么可以在小范圍進行試點，或者從性能要求比較高的頁面入手，

建議先單個頁面引入，最后再做全量替換，Google官方的改造案例也是這么做的，

最后，放開手，擼起來吧！

社區需要你我共建，更需要走在前沿的實踐者，期待看到更多、更好的文章出現，這就是我寫作的動力，

最后

我把自己這段時間整理的Android最重要最熱門的學習方向資料放在了我的GitHub里面還有不同方向的自學編程路線、面試題集合/面經、及系列技術文章等，

資源持續更新中，歡迎大家一起學習和探討，