Recompose 方法在 Jetpack Compose 中不起作用

Question

我正在尝试根据我的要求进行可组合重组，如：

  @Composable
    fun recomposeDemo() {
        var countState = 0
        Recompose { recompose ->
            Column  //Error in this line
                {
                Text("CountState is: " + countState)
                Button(onClick = { countState++ }) {
                    Text("Count up")
                }
                Button(onClick = {
                    recompose()
                }) {
                    Text("I want to recompose")
                }
            }
        }
    }

此处提供此代码：Site having this example

但是上面的代码会产生如下错误：

@Composable invocations can only happen from the context of a @Composable function

这是因为某些版本问题吗？我正在使用最新版本的 Compose，即。 “1.0.0-beta03”。 如何正确使用此版本的“Recompose”组合？

这是我的应用级 build.gradle：

apply plugin: 'com.android.application'
apply plugin: 'kotlin-android'

android {
    compileSdkVersion 30

    defaultConfig {
        applicationId "com.example.voodlee0125"
        minSdkVersion 21
        targetSdkVersion 30
        versionCode 1
        versionName "0.1.25"
        multiDexEnabled true

        testInstrumentationRunner "androidx.test.runner.AndroidJUnitRunner"
    }

    buildFeatures {
        viewBinding = true
        compose true
    }

    composeOptions {
        kotlinCompilerExtensionVersion '1.0.0-beta03'
    }

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }

    kotlinOptions {
        jvmTarget = JavaVersion.VERSION_1_8.toString()
        useIR = true

    }

    buildTypes {
        debug {
            minifyEnabled false
            debuggable true
//            shrinkResources true
            proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
        }
        release {
            minifyEnabled false
            debuggable true
//            shrinkResources true
            proguardFiles getDefaultProguardFile('proguard-android-optimize.txt'), 'proguard-rules.pro'
        }
    }

    compileOptions {
        sourceCompatibility JavaVersion.VERSION_1_8
        targetCompatibility JavaVersion.VERSION_1_8
    }
}

dependencies {
    def lifecycle_version = "2.3.1"

    implementation fileTree(dir: "libs", include: ["*.jar"])
    implementation 'androidx.appcompat:appcompat:1.2.0'
    implementation 'androidx.constraintlayout:constraintlayout:2.0.4'
    implementation 'androidx.cardview:cardview:1.0.0'
    implementation "androidx.drawerlayout:drawerlayout:1.1.1"
    implementation "androidx.navigation:navigation-fragment:2.3.3"
    implementation "androidx.navigation:navigation-ui:2.3.3"
    implementation 'androidx.legacy:legacy-support-v4:1.0.0'
    implementation 'com.google.android.material:material:1.3.0'
    implementation 'androidx.lifecycle:lifecycle-extensions:2.2.0'
    implementation 'com.shawnlin:number-picker:2.4.11'
    implementation 'com.karumi:dexter:6.2.1'
    implementation 'com.github.IslamKhSh:CardSlider:1.0.1'
    implementation 'com.intuit.sdp:sdp-android:1.0.6'
    implementation 'com.intuit.ssp:ssp-android:1.0.6'
    implementation 'com.github.PhilJay:MPAndroidChart:v3.1.0'
    implementation 'com.github.barteksc:android-pdf-viewer:2.8.2'
    implementation 'com.google.android.gms:play-services-auth:19.0.0'
    implementation 'com.google.android.gms:play-services-auth-api-phone:17.5.0'
    implementation 'net.yslibrary.keyboardvisibilityevent:keyboardvisibilityevent:3.0.0-RC2'
    // Lottie dependency
    implementation "com.airbnb.android:lottie:3.4.0"

    //Autostart settings open
    implementation 'com.thelittlefireman:AppKillerManager:2.1.1'

    // Retrofit
    implementation 'com.squareup.retrofit2:retrofit:2.3.0'
    implementation 'com.squareup.okhttp3:logging-interceptor:4.9.0'

    // JSON Parsing
    implementation 'com.google.code.gson:gson:2.8.6'
    implementation 'com.squareup.retrofit2:converter-gson:2.1.0'

    implementation 'com.android.support:multidex:1.0.3'

    implementation 'androidx.cardview:cardview:1.0.0'

    // ViewModel
    implementation "androidx.lifecycle:lifecycle-viewmodel-ktx:$lifecycle_version"
    // LiveData
    implementation "androidx.lifecycle:lifecycle-livedata-ktx:$lifecycle_version"

    implementation "androidx.core:core-ktx:1.3.2"
    implementation "org.jetbrains.kotlin:kotlin-stdlib-jdk7:1.4.30"

    implementation "org.koin:koin-core:2.2.2"
    implementation "org.koin:koin-androidx-viewmodel:2.2.2"
    implementation "androidx.datastore:datastore-preferences:1.0.0-alpha08"
    implementation 'com.github.pwittchen:swipe-rx2:0.3.0'
    implementation "androidx.compose.material:material:1.0.0-beta03"
    implementation "androidx.compose.ui:ui-tooling:1.0.0-beta03"
    implementation "androidx.compose.ui:ui:1.0.0-beta03"
    implementation "androidx.activity:activity-compose:1.3.0-alpha05"
    implementation "androidx.compose.animation:animation:1.0.0-beta03"
    implementation "androidx.compose.animation:animation-core:1.0.0-beta03"
    implementation "androidx.ui:ui-framework:0.1.0-dev03"
    implementation "androidx.compose.runtime:runtime-livedata:1.0.0-beta03"


    testImplementation 'junit:junit:4.13.1'
    androidTestImplementation 'androidx.test.ext:junit:1.1.2'
    androidTestImplementation 'androidx.test.espresso:espresso-core:3.3.0'


}
repositories {
    mavenCentral()
}

Answer 1

onClick 不可组合。这是一个常规函数。

onClick lambda 呢？

仅围绕可组合函数创建重构范围。事件处理程序，如 Button 的 onClick，是不可组合的，它们只是常规函数。当框架调用点击处理程序时，它是在任何重组范围之外完成的。

您可以在Scoped recomposition in Jetpack Compose — what happens when state changes? 文章中阅读更多相关信息。

按照@Gabriele Mariotti 的建议来修改您的代码。

Answer 2

不确定您的问题。 您不能在 onClick lambda 上使用 Composable 函数， 但你可以重写你的代码：

var countState = remember {mutableStateOf(0)}

Column()
{
    Text("CountState is: " + countState.value)
    Button(onClick = { countState.value++ }) {
        Text("Count up")
    }
}

当你点击按钮时：

• countState MutableState 值已更改。
• 由于countState，Text 被重构。