迁移到Jetpack Compose 第一趴

好久没有更新了,接下来一段时间的博客,是以View一步步迁移到Compose的教程。

一、简介

Compose和View系统可以结合使用。

下面将使用项目Sunflow的部分界面迁移到Compose。

1.1、学习内容

通过这一系列,您将学习:

  • 您可以遵循的不同迁移路径
  • 如何逐步将应用迁移到Compose
  • 如何将Compose添加到使用Android View构建的现有界面
  • 如何在Compose中使用Android View
  • 如何在Compose中使用View系统中的主题
  • 如何使用View系统代码和Compose代码测试界面

1.2、前提条件

  • 有使用Kotlin语法(包括lambda)的经验
  • 了解Compose的基础知识

1.3、所需条件

二、迁移计划

如何迁移到Compose取决于您和您的团队。要将Jetpack Compose集成到现有Android应用中,有多种不同的方法。常用的两种迁移策略为:

  • 完全使用Compose开发一个新界面
  • 选取一个现有界面,然后逐步迁移其中的各个组件。

2.1、新界面中的Compose

在重构应用代码以适应新技术时,一种常用的方法是在为应用构建新功能中采用该技术。在这种情况下,适合使用新的界面。如果您需要为应用构建新界面,请考虑使用Compose,而应用的额其余部分可以保留在View系统中。

在这种情况下,您需要在这些已迁移功能的边缘实现Compose互操作性。

2.2、搭配使用Compose和View

对于特定界面,您可以将部分界面迁移到Compose,让其他部分保留在View系统中。例如,您可以迁移RecyclerView,同时将界面的其余部分保留在View系统中。

或者,使用Compose作为外部布局,并使用Compose中可能没有的一些现有View,比如MapView或AdView。

2.3、完成迁移

将全部的fragment或界面迁移到Compose,一次迁移一个。这种方式最为简单,但比较粗放。

三、准备工作

3.1、获取代码

从 GitHub 获取 Codelab 代码:

shell 复制代码
$ git clone https://github.com/googlecodelabs/android-compose-codelabs

或者,您可以下载代码库 Zip 文件:

下载 ZIP 文件

四、Sunflow中的Compose

Compose已添加到您从main分支下载的代码中。不过,我们先来了解一下运行这些代码所需要具备哪些条件。

打开app/build.gradle(或build.gradle(Module: compose-migration.app))文件后,请查看该文件如何导入Compose依赖项,以及如何使用buildFeatures { compose true}标记,从而让Android Studio能够运行Compose。

app/build.gradle

kotlin 复制代码
android {
    ...
    kotlinOptions {
        jvmTarget = '1.8'
        useId = true
    }
    buildFeatures {
        ...
        compose true
    }
    composeOptions {
        kotlinCompilerExtensionVersion rootProject.composeVersion
    }
}

dependencies {
    ...
    // Compose
    implementation "androidx.compose.runtime:runtime: $rootProject.composeVersion"
    implementation "androidx.commpose.ui:ui:$rootProject.composeVersion"
    implementation "androidx.compose.foundation:foundation:$rootProject.composeVersion"
    implementation "androidx.compose.foundation:foundation-layout:$rootProject.composeVersion"
    implementation "androidx.compose.material:material:$rootProject.composeVersion"
    implementation "androidx.compose.runtime:runtime-livedata:$rootProject.composeVersion"
    implementation "androidx.compose.ui:ui-tooling:$rootProject.composeVersion"
    implementation "com.google.android.material:compose-theme-adapter:$rootProject.composeVersion"
}

这些依赖项的版本在根目录下的build.gradle文件中定义。

相关推荐
雨白6 小时前
Android 快捷方式实战指南:静态、动态与固定快捷方式详解
android
hqk6 小时前
鸿蒙项目实战:手把手带你实现 WanAndroid 布局与交互
android·前端·harmonyos
LING6 小时前
RN容器启动优化实践
android·react native
恋猫de小郭9 小时前
Flutter 发布官方 Skills ,Flutter 在 AI 领域再添一助力
android·前端·flutter
Kapaseker14 小时前
一杯美式搞懂 Any、Unit、Nothing
android·kotlin
黄林晴14 小时前
你的 Android App 还没接 AI?Gemini API 接入全攻略
android
恋猫de小郭1 天前
2026 Flutter VS React Native ,同时在 AI 时代 VS Native 开发,你没见过的版本
android·前端·flutter
冬奇Lab1 天前
PowerManagerService(上):电源状态与WakeLock管理
android·源码阅读
BoomHe1 天前
Now in Android 架构模式全面分析
android·android jetpack
二流小码农2 天前
鸿蒙开发:上传一张参考图片便可实现页面功能
android·ios·harmonyos