谷歌大佬強勢分享《Jetpack Compose 權威指南》,帶你參透宣告式UI的終極奧義!
一、為什麼要選擇Compose?
宣告式 UI 的大哥 Flutter
已經出道很久了,再學習 Compose
還有意義嗎,Flutter
還是 Compose
?
我先丟擲我的結論:
- 如果你想運用到實際的生產環境中,Flutter 肯定是更好的選擇,因為更多的人幫你踩過了坑。
- 如果你想
Kotlin
一把梭,只是學習嚐鮮,結合Android Jetpack
,Compose
可以很好的作為你的技術儲備。
簡單的聊聊 Compose 中還不錯的地方。
1. Android開發習慣的繼承
相信很多同學都有這樣的習慣:
- 使用 Kotlin 開發
- 必須協程
- 複雜的佈局會使用
ConstraintLayout
- ...
是的,這些東西我們依然在 Compose 中運用,從而降低我們的上手難度。
2. Android Jetpack 的支援
在 Compose 剛剛釋出的時候,Android Jetpack 中的很多其他庫都第一時間給予了 Compose 支援,從而豐富了 Compose 的開發生態。
目前,能夠直接在 Compose 上使用的 Jetpack 庫有:
- Navigation
- Paging
- ViewModel
- LiveData
- hilt
- lifecycle
理論上來講,Android Jetpack 上跟 UI 不相關的庫 Compose 應該都是支援的,在我寫的 Hoo 中,就使用了Paging、Navigation、ViewModel 和 LiveData等 Android Jetpack 庫,再有協程和 Kotlin 的加持,整個開發過程中輕鬆不少!
3. 更少的程式碼
Compose 可以使我們更加專注於 UI 的開發,宣告式UI 可以顯著的減少方法數和包體積。在谷歌官方的 《Jetpack Compose 使用前後對比》 一文說道:
Tivi應用在使用了 Compose 後,我們發現 APK 大小縮減了 41%,方法數減少了 17%
其實這些都是可以預見的,比如更加簡單的動畫和觸控事件的 Api。
4. Preview
Compose支援程式碼的Preview,如圖:
Compose 程式碼寫完後,可以直接在右邊預覽,但是更新速度差點意思,不如 Flutter 的熱過載方便。
5. 其他
其他的一些點可能就跟 Flutter 有點像了。
-
Compose 的主題原生支援黑夜模式,開發者定製主題的時候提供兩套顏色即可,想起之前,起點讀書支援黑夜模式可是花了很大的功夫。
-
通過
Scaffold
,可以輕鬆整合很多Material
元件,比如Topbar
、FloatingActionButton
和BottomNavigationBar
等,這些都可以幫助我們節省出不少的時間。 -
另外,在 Compose 中不能輕鬆實現效果的時候,藉助於
AndroidView
,可以去呼叫Android原生View。
二、如何快速學習Compose
接下來,我將會給大家介紹一份谷歌大佬強勢分享《Jetpack Compose 權威指南》,手把手教大家Jetpack Compose從入門到精通。
這份資料旨在給希望瞭解、學習、應用Android Jetpack Compose的小夥伴一個參考資料。
資料詳情
第一章 初識 Jetpack Compose
-
為什麼我們需要一個新的UI 工具?
-
Jetpack Compose的著重點
加速開發
強大的UI工具
直觀的Kotlin API
-
API 設計
-
Compose API 的原則
一切都是函式
頂層函式(Top-level function)
組合優於繼承
信任單一來源
-
深入瞭解Compose
Core
Foundation
Material
-
插槽API
第二章 Jetpack Compose構建Android UI
-
Android Jetpack Compose 最全上手指南
Jetpack Compose 環境準備和Hello World
佈局
使用Material design 設計
Compose 佈局實時預覽
……
-
深入詳解 Jetpack Compose | 優化 UI 構建
Compose 所解決的問題
Composable 函式剖析
宣告式 UI
組合 vs 繼承
封裝
重組
……
-
深入詳解 Jetpack Compose | 實現原理
@Composable 註解意味著什麼?
執行模式
Positional Memoization (位置記憶化)
儲存引數
重組
……
第三章 Jetpack Compose 專案實戰演練(附Demo)
-
Jetpack Compose應用1
開始前的準備
建立DEMO
遇到的問題
-
Jetpack Compose應用2
-
Jetpack Compose應用做一個倒計時器
資料結構
倒計時功能
狀態模式
Compose 佈局
繪製時鐘
-
用Jetpack Compose寫一個玩安卓App
準備工作
引入依賴
新建 Activity
建立 Compose
PlayTheme
畫頁面
底部導航欄
管理狀態
新增頁面
-
用Compose Android 寫一個天氣應用
開篇
畫頁面
畫背景
畫內容
……
-
用Compose快速打造一個“電影App”
成品
實現方案
實戰
不足
……