Monzo 使用 Compose 建構更完善、品質更高的應用程式

Monzo 是一家銀行和應用程式,提供數位金融服務。他們的使命是為所有人獲利Monzo 的設計系統開始偏離 Material Design,因此希望能夠輕鬆編寫及維護不斷演進的自訂元件,因此他們選擇使用 Jetpack Compose。

具體措施

透過 Compose,Material Design 元件會以層層疊疊的方式提供,不受設計系統限制的基礎 API。Monzo 使用基礎 API 建構自己的元件程式庫,並以 Material 元件做為參考。一開始先遷移一個畫面,接著在所有新畫面中使用 Compose。目前,所有 Android 工程師都已在實際作業中使用 Compose:「我們沒有遇到任何重大問題,因此有信心開始將其用於部分特定的新功能,並最終用於所有新功能。」

結果

Monzo 團隊建立了元件,讓他們可以輕鬆建構新的畫面:「我們提供的元件可讓您在學習 Compose 的同時,輕鬆建構畫面,提供更流暢的體驗。以運算單元為基礎的 API 是一種絕佳模式,讓我們能輕鬆從大量的小型建構模塊中建構大型元件。」

有了 Compose,Monzo 團隊就能建構出更高品質的應用程式,並加入先前在衝刺期間無法處理的實用功能:「舉例來說,動畫很容易在 Compose 中加入,因此沒有理由不加入動畫,例如顏色/大小/升降變更。這些「可有可無」的動畫通常太難實作,不值得在 View 系統中花費心力和時間。」

程式碼現在變得更短,也更容易閱讀、瞭解及維護:「與操控可變 UI 階層的程式碼相比,宣告式程式碼更容易推理。當程式碼全部使用相同語言編寫且通常在相同的檔案中時,就會更容易直接追蹤程式碼,而不是在 Kotlin 和 XML 之間來回切換。更別說 XML 主題和樣式了!在 Compose 中,主題設定更容易理解。我們的主題只包含我們定義的屬性,因此各裝置的值都一致,而且因為採用 Kotlin,在 IDE 中搜尋和追蹤起來也相當容易。」

Compose 讓 Monzo 團隊輕鬆測試應用程式,並確保應用程式可供存取:「這項工具有助於我們編寫不易出錯、可靠執行的測試,並讓我們有信心,確保應用程式在使用者手中確實運作正常。透過語意系統進行測試,也能確保我們的螢幕至少在預設情況下可合理存取。」

開始使用

進一步瞭解 Compose