快速入门

为了获得最佳的 Compose 开发体验,请下载并安装 Android Studio。它包含许多智能编辑器功能,例如新的项目模板以及立即预览 Compose 界面和动画的功能。

获取 Android Studio

按照以下说明创建新的 Compose 应用项目、为现有应用项目设置 Compose,或导入用 Compose 编写的示例应用。

创建支持 Compose 的新应用

如果您想默认支持 Compose 来启动新项目,Android Studio 提供了各种项目模板来帮助您入门。要正确设置 Compose 以创建新项目,请按以下步骤操作:

  1. 如果您在 欢迎使用 Android Studio 窗口中,请点击 启动新的 Android Studio 项目。如果您已打开 Android Studio 项目,请从菜单栏中选择 文件 > 新建 > 新建项目
  2. 选择项目模板窗口中,选择空 Activity,然后点击下一步
  3. 配置您的项目窗口中,执行以下操作:
    1. 照常设置名称软件包名称保存位置。请注意,在语言下拉菜单中,Kotlin 是唯一可用的选项,因为 Jetpack Compose 仅适用于用 Kotlin 编写的类。
    2. 最低 API 级别下拉菜单中,选择 API 级别 21 或更高版本。
  4. 点击完成

现在,您已准备好使用 Jetpack Compose 开发应用。为了帮助您入门并了解该工具包的功能,请尝试Jetpack Compose 教程

为现有应用设置 Compose

首先,使用Compose 编译器 Gradle 插件配置 Compose 编译器。

然后,将以下定义添加到应用的 build.gradle 文件中:

Groovy

android {
    buildFeatures {
        compose true
    }
}

Kotlin

android {
    buildFeatures {
        compose = true
    }
}

在 Android BuildFeatures 块内将 compose 标志设置为 true 即可在 Android Studio 中启用Compose 功能

最后,将 Compose BOM 和您需要的 Compose 库依赖项子集添加到以下代码块中的依赖项中:

Groovy

dependencies {

    def composeBom = platform('androidx.compose:compose-bom:2025.05.00')
    implementation composeBom
    androidTestImplementation composeBom

    // Choose one of the following:
    // Material Design 3
    implementation 'androidx.compose.material3:material3'
    // or Material Design 2
    implementation 'androidx.compose.material:material'
    // or skip Material Design and build directly on top of foundational components
    implementation 'androidx.compose.foundation:foundation'
    // or only import the main APIs for the underlying toolkit systems,
    // such as input and measurement/layout
    implementation 'androidx.compose.ui:ui'

    // Android Studio Preview support
    implementation 'androidx.compose.ui:ui-tooling-preview'
    debugImplementation 'androidx.compose.ui:ui-tooling'

    // UI Tests
    androidTestImplementation 'androidx.compose.ui:ui-test-junit4'
    debugImplementation 'androidx.compose.ui:ui-test-manifest'

    // Optional - Included automatically by material, only add when you need
    // the icons but not the material library (e.g. when using Material3 or a
    // custom design system based on Foundation)
    implementation 'androidx.compose.material:material-icons-core'
    // Optional - Add full set of material icons
    implementation 'androidx.compose.material:material-icons-extended'
    // Optional - Add window size utils
    implementation 'androidx.compose.material3.adaptive:adaptive'

    // Optional - Integration with activities
    implementation 'androidx.activity:activity-compose:1.10.1'
    // Optional - Integration with ViewModels
    implementation 'androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5'
    // Optional - Integration with LiveData
    implementation 'androidx.compose.runtime:runtime-livedata'
    // Optional - Integration with RxJava
    implementation 'androidx.compose.runtime:runtime-rxjava2'

}

Kotlin

dependencies {

    val composeBom = platform("androidx.compose:compose-bom:2025.05.00")
    implementation(composeBom)
    androidTestImplementation(composeBom)

    // Choose one of the following:
    // Material Design 3
    implementation("androidx.compose.material3:material3")
    // or Material Design 2
    implementation("androidx.compose.material:material")
    // or skip Material Design and build directly on top of foundational components
    implementation("androidx.compose.foundation:foundation")
    // or only import the main APIs for the underlying toolkit systems,
    // such as input and measurement/layout
    implementation("androidx.compose.ui:ui")

    // Android Studio Preview support
    implementation("androidx.compose.ui:ui-tooling-preview")
    debugImplementation("androidx.compose.ui:ui-tooling")

    // UI Tests
    androidTestImplementation("androidx.compose.ui:ui-test-junit4")
    debugImplementation("androidx.compose.ui:ui-test-manifest")

    // Optional - Included automatically by material, only add when you need
    // the icons but not the material library (e.g. when using Material3 or a
    // custom design system based on Foundation)
    implementation("androidx.compose.material:material-icons-core")
    // Optional - Add full set of material icons
    implementation("androidx.compose.material:material-icons-extended")
    // Optional - Add window size utils
    implementation("androidx.compose.material3.adaptive:adaptive")

    // Optional - Integration with activities
    implementation("androidx.activity:activity-compose:1.10.1")
    // Optional - Integration with ViewModels
    implementation("androidx.lifecycle:lifecycle-viewmodel-compose:2.8.5")
    // Optional - Integration with LiveData
    implementation("androidx.compose.runtime:runtime-livedata")
    // Optional - Integration with RxJava
    implementation("androidx.compose.runtime:runtime-rxjava2")

}

试用 Jetpack Compose 示例应用

试用 GitHub 上托管的Jetpack Compose 示例应用是体验 Jetpack Compose 功能的最快方式。要从 Android Studio 导入示例应用项目,请按以下步骤操作:

  1. 如果您在欢迎使用 Android Studio 窗口中,请选择导入 Android 代码示例。如果您已打开 Android Studio 项目,请从菜单栏中选择文件 > 新建 > 导入示例
  2. 浏览示例向导顶部的搜索栏中,输入“compose”。
  3. 从搜索结果中选择一个 Jetpack Compose 示例应用,然后点击下一步
  4. 更改应用名称项目位置,或保留默认值。
  5. 点击完成

Android Studio 会将示例应用下载到您指定的路径并打开项目。然后,您可以检查每个示例中的 MainActivity.kt,以在 IDE 内预览中查看 Jetpack Compose API,例如交叉淡入淡出动画、自定义组件、使用排版以及显示浅色和深色。

如需将 Jetpack Compose 用于 Wear OS,请参阅在 Wear OS 上设置 Jetpack Compose