Jetpack compose 引入

前言

前言一加，这格局 “der” 的一下不就上来了吗！

一、工欲善其事必先利其器

在学习jetpack compose ( 后面统一称之为 compose ) 之前先现在最新的 Android studio , 这里不一定非要最新的工具，但是至少是白狐版本 Android Studio Arctic Fox，我建议是越新越好。

二、新建项目，并引入Compose

方式一：直接android studio 新建 Empty Compose Activity

Next -> Finish

剩下的Android studio 会自动帮你完成。

方式二：新建普通项目，配置 compose

直接上配置：

Android Gradle 插件

buildscript {      

    dependencies {      

         classpath "com.android.tools.build:gradle:7.0.0"      

     }

 }

配置 Kotlin

确保您在项目中使用的是 Kotlin 1.6.10：

配置gradle



android {

 defaultConfig {

 ...

        minSdkVersion 21

    }



 buildFeatures {

 // Enables Jetpack Compose for this module

        compose true

    }

 ...



    // Set both the Java and Kotlin compilers to target Java 8.

    compileOptions {

 sourceCompatibility JavaVersion.VERSION_1_8

                targetCompatibility JavaVersion.VERSION_1_8

    }

 kotlinOptions {

 jvmTarget = "1.8"

    }



 composeOptions {

 kotlinCompilerExtensionVersion '1.1.1'

    }

 }

dependencies {

    implementation("androidx.compose.ui:ui:1.1.1")

    // Tooling support (Previews, etc.)

    implementation("androidx.compose.ui:ui-tooling:1.1.1")

    // Foundation (Border, Background, Box, Image, Scroll, shapes, animations, etc.)

    implementation("androidx.compose.foundation:foundation:1.1.1")

    // Material Design

    implementation("androidx.compose.material:material:1.1.1")

    // Material design icons

    implementation("androidx.compose.material:material-icons-core:1.1.1")

    implementation("androidx.compose.material:material-icons-extended:1.1.1")

    // Integration with observables

    implementation("androidx.compose.runtime:runtime-livedata:1.1.1")

    implementation("androidx.compose.runtime:runtime-rxjava2:1.1.1")



    // UI Tests

    androidTestImplementation("androidx.compose.ui:ui-test-junit4:1.1.1")

}

可以了，去项目中去新建一个Compose Activity 吧

New -> compose ->Empty compose Activity

Jetpack Compose 引入

前言