[JCConf 2022] Compose for Desktop - 開發桌面軟體的新選擇

1. 范聖佑 (Shengyou Fan) JetBrains Developer Advocate JCConf Taiwan 2022 2022/10/07 開發桌⾯軟體的新選擇 Compose for Desktop

2. 範例程式碼 — 多平台 https://github.com/shengyou/lottery-machine-multiplatform Desktop 平台 https://github.com/shengyou/lottery-machine-desktop

3. Compose 發展史 — Jim Sproch 帶領團隊開始著⼿研發 Jetpack Compose May 2017 Google I/O宣佈⽀援以 Kotlin 開發 Android May 2019 Google I/O宣佈 Android 開發將以 Kotlin 優先 May 2020 Nikolay Igotti 帶領團隊將 Compose 變成 Multiplatform September 2021 Jetpack Compose 發佈 1.0 版 July Compose Multiplatfom 發佈 1.0 版 December

4. Compose 是什麼？ — • Declarative UI 框架 • 使⽤函式來描述 UI 及狀態 • 完全使⽤ Kotlin 開發 • 提供 Typesafe APIs • 以 Skia 渲染畫⾯* * Compose for Desktop

5. Compose ⽣態系 — 多平台 Jetpack Compose 建立⼿機應⽤程式介⾯ Compose for Desktop 建立桌⾯應⽤程式介⾯ Compose for Web 建立網路應⽤程式介⾯

6. 範例：樂透抽獎機 — • 1~49 號碼球 • 以 7 x 7 矩陣排列 • 每按⼀次按鈕 • 隨機抽取 6 個 • 抽到的數字會變⾊

7. # 跟 Jetpack Compose ⼀樣的地⽅？

8. 可使⽤的 Jetpack Compose Package — • androidx.compose.runtime • androidx.compose.fundation • androidx.compose.ui • androidx.compose.material

9. ⚠ 跟 Jackpack Compose 不同的地⽅？

10. 不同運⾏環境 — • 較簡單的 Life Cycle • 較少的權限限制

11. 不同的 UI/UX — • 反思 Material Design 在 Desktop 上的適⽤性 • 社群製作的 Theme • 社群製作的 UI 元件庫

14. Desktop 特有元件 — • Window • Menu* • Tooltip • Tray • Scrollbar* • Notification*

20. Desktop 特有事件 — • MouseEnter • MouExit • MouseMove • KeyDown • KeyUp • Keyboard Shortcut

21. 不同的開發⽣態系 pt.1 — • 沒有 ViewModel • 沒有 Navigation • 沒有 Room • 沒有 Hilt • 沒有 Firebase

22. 不同的開發⽣態系 pt.2 — • 但有完整的 JVM ⽣態： - ⽤ Decompose 取代 Navigation - ⽤ SqlDelight 取代 Room - ⽤ Dagger 取代 Hilt - ⽤ Arbor 取代 Timber

23. 不同的發佈管道 — • 有打包⽤的 Gradle Task - 各作業系統要分別⽤對應機器打包 • 沒有 Play Store - ⽤ update4j 做⾃動更新

24. % 說到底，好處在哪裡？

25. Compose for Desktop 的優勢 — • 單⼀語⾔ • 相同語法 • 成熟的 JVM ⽣態系 • 可跟 Swing 互⽤ • 更重要的是…

26. & 多平台共⽤ UI！

27. Compose Multiplatform — • android → Android 主程式 • common → 共⽤ UI 及商業邏輯 - androidMain → 平台專⽤實作 (actual) - commonMain → 共⽤核⼼ (expect) - desktopMain → 平台專⽤實作 (actual) • desktop → Desktop 主程式

28. Desktop SwiftUI Android Jetpack Compose iOS Compose for Desktop Web Compose for Web Kotlin Multiplatform — Common Kotlin UI Logic

29. Kotlin Multiplatform — Desktop SwiftUI Android Jetpack Compose iOS Compose for Desktop Web Compose for Web Common Kotlin UI Logic Compose Multiplatform

30. Kotlin Multiplatform — Desktop SwiftUI Android Jetpack Compose iOS Compose for Desktop Web Compose for Web Common Kotlin UI Logic Kotlin Multiplatform Mobile

31. ' Terminal UI?!!

32. % 有實際案例嗎？

33. JetBrains Toolbox App — • Compose for Desktop 的 Production 案例

34. 可讓 UI 在多平台共⽤ Compose Multiplatform 是開發桌⾯軟體的新選擇 Compose for Desktop 快速回顧 — Kotlin 是⼀個多平台開發⽣態系

35. 了解更多 — Jetpack Compose 官網 Compose for Desktop 官網

36. 官⽅教學及範例 — • 必看資料夾 - tutorials - examples

37. 推薦影片 — What about…a desktop app? Introducing Compose for Desktop Compose Multiplatform 的故事

38. 多平台開發範例 — • 各平台開發範例⼀應俱全！

39. 2022 iThome 鐵⼈賽 — • [已完賽] 傳教⼠的 Compose for Desktop 耕讀筆記

40. 歡迎參加 Kotlin 社群 — Line 群 Telegram 群加入討論群取得最新資訊 tw.kotlin.tips

41. Kotlin Collection 全⽅位解析攻略 — collection.kotlin.tips • 詳解 200+ Collection ⽅法 • 解析標準函式庫原始碼 • 實務範例 • 免費下載速查地圖

42. 關注粉絲⾴及頻道 — Coding 職⼈塾 Kraftsman

43. 開發桌⾯軟體的新選擇 Compose for Desktop shengyou.fan@jetbrains.com fb.me/shengyoufan shengyoufan @shengyou

[JCConf 2022] Compose for Desktop - 開發桌面軟體的新選擇

Du liest eine Vorschau.

Hier ansehen

[JCConf 2022] Compose for Desktop - 開發桌面軟體的新選擇

Weitere Verwandte Inhalte

Weitere von Shengyou Fan (20)

Aktuellste (20)