KMM + Compose: Unresolved reference: drawable

Question

I have a KMM application in which the android target uses Jetpack Compose. I am getting the following error when I try to use a drawable resource:

e: [...]/OnboardingScreen.kt: (33, 46): Unresolved reference: drawable

This is the result of trying to access a drawable via painterResource(id = R.drawable.ic_icon).

I have tried the following things to fix the issue:

Clean and build the project
Invalidate cache and restart
Fix all warnings when executing ./gradlew assembleDebug
The static R class is correctly imported

Nothing of the above solves the problem.

This is my build.gradle.kts of the android module:

plugins {
    id("com.android.application")
    kotlin("android")
}

val composeVersion = findProperty("version.compose") as String
val composeNavigationVersion = findProperty("version.composeNavigation") as String
val koinVersion = findProperty("version.koin") as String

android {

    compileSdk = (findProperty("android.compileSdk") as String).toInt()

    defaultConfig {
        applicationId = "com.app.app.android"
        minSdk = (findProperty("android.minSdk") as String).toInt()
        targetSdk = (findProperty("android.targetSdk") as String).toInt()
        versionCode = 1
        versionName = "1.0"
    }

    buildFeatures {
        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 = composeVersion
    }

    buildTypes {
        getByName("release") {
            isMinifyEnabled = false
        }
    }
}

dependencies {

    implementation(project(":shared"))

    // Android
    implementation("com.google.android.material:material:1.4.0")

    // Jetpack Compose
    implementation("androidx.compose.ui:ui:$composeVersion")
    implementation("androidx.compose.ui:ui-tooling:$composeVersion")
    implementation("androidx.compose.foundation:foundation:$composeVersion")
    implementation("androidx.compose.material:material:$composeVersion")
    implementation("androidx.compose.material:material-icons-core:$composeVersion")
    implementation("androidx.compose.material:material-icons-extended:$composeVersion")
    implementation("androidx.activity:activity-compose:$composeVersion")
    implementation("androidx.navigation:navigation-compose:$composeNavigationVersion")

    // Koin
    implementation("io.insert-koin:koin-android:$koinVersion")
}

configurations.all {
    resolutionStrategy {
        force("org.jetbrains.kotlin:kotlin-stdlib:1.5.31")
    }
}

My build.gradle.kts of the shared module:

plugins {
    kotlin("multiplatform")
    kotlin("native.cocoapods")
    id("com.android.library")
}

version = "1.0"

kotlin {
    android()
    iosX64()
    iosArm64()
    iosSimulatorArm64() // sure all ios dependencies support this target

    cocoapods {
        summary = "Some description for the Shared Module"
        homepage = "Link to the Shared Module homepage"
        ios.deploymentTarget = "14.1"
        podfile = project.file("../ios/Podfile")
        framework {
            baseName = "shared"
        }
    }

    val multiplatformVersion = findProperty("version.multiplatformSettings") as String
    val koinVersion = findProperty("version.koin") as String
    val coroutinesVersion = findProperty("version.coroutines") as String
    
    sourceSets {
        val commonMain by getting {
            dependencies {
                implementation("com.russhwolf:multiplatform-settings-no-arg:$multiplatformVersion")
                implementation("io.insert-koin:koin-core:$koinVersion")
                implementation("org.jetbrains.kotlinx:kotlinx-coroutines-core:$coroutinesVersion")
            }
        }
        val commonTest by getting {
            dependencies {
                implementation(kotlin("test-common"))
                implementation(kotlin("test-annotations-common"))
            }
        }
        val androidMain by getting
        val androidTest by getting {
            dependencies {
                implementation(kotlin("test-junit"))
                implementation("junit:junit:4.13.2")
            }
        }
        val iosX64Main by getting
        val iosArm64Main by getting
        val iosSimulatorArm64Main by getting
        val iosMain by creating {
            dependsOn(commonMain)
            iosX64Main.dependsOn(this)
            iosArm64Main.dependsOn(this)
            iosSimulatorArm64Main.dependsOn(this)
        }
        val iosX64Test by getting
        val iosArm64Test by getting
        val iosSimulatorArm64Test by getting
        val iosTest by creating {
            dependsOn(commonTest)
            iosX64Test.dependsOn(this)
            iosArm64Test.dependsOn(this)
            iosSimulatorArm64Test.dependsOn(this)
        }
    }
}

android {
    compileSdk = 31
    sourceSets["main"].manifest.srcFile("src/androidMain/AndroidManifest.xml")
    defaultConfig {
        minSdk = 22
        targetSdk = 31
    }
}

And finally, my gradle.properties:

# Gradle
org.gradle.jvmargs=-Xmx2048M -Dkotlin.daemon.jvm.options\="-Xmx2048M"

# Kotlin
kotlin.code.style=official

# Android
android.useAndroidX=true
android.compileSdk=31
android.targetSdk=31
android.minSdk=22

# MPP
kotlin.mpp.enableGranularSourceSetsMetadata=true
kotlin.mpp.enableCInteropCommonization=true
kotlin.native.enableDependencyPropagation=false
kotlin.native.ignoreDisabledTargets=true

# Common versions
version.multiplatformSettings=0.8.1
version.koin=3.1.4
version.coroutines=1.5.2-native-mt

# Android versions
version.compose=1.0.5
version.composeNavigation=2.4.0-rc01

Thanks in advance.

make sure to import R class from your package example com.blabla.blablabla — Denny Kurniawan, Dec 25 '21 at 12:27

Taras Mykhalchuk · Answer 1 · 2022-01-14T09:10:21.583

19

That's how you reference image resources:

import com.your.package.R 

val img = R.drawable.img_name

or

val img = com.your.package.R.drawable.img_name

edited Jan 14 '22 at 09:10

answered Jan 13 '22 at 21:37

Taras Mykhalchuk

829
1
9
20

Silverback · Accepted Answer · 2022-01-05T22:19:41.740

Denny Kurniawan's comment above pointed me in the right direction. I had a similar problem after changing the name of my project. At the top of your 'OnboardingScreen.kt' file, check to see if the full 'package' name matches your actual project's name, e.g. "package com.android.application".

If the package name listed in 'OnboardingScreen.kt' is not the same as your actual project's name, then the static R class is probably not being imported correctly and, hence, this error.

In other words, the full package name in 'OnboardingScreen.kt' should match the name of the folder shown under 'app->src->main->java'. Hope this helps someone as it did me.

Faisal Reza · Answer 3 · 2023-02-06T05:13:25.093

0

for me, this error happen because I drag my image to the resource manager, I solve it by importing the images manually with the "Import Drawables" button

edited Feb 06 '23 at 05:13

answered Feb 06 '23 at 05:13

Faisal Reza

1
1

Chuanqing Yang · Answer 4 · 2023-07-04T03:00:07.443

0

In my case, I just change the import androidx.compose.ui.R to import com.your.package.name.R and boom~~~

edited Jul 04 '23 at 03:00

answered Jul 04 '23 at 02:58

Chuanqing Yang

1
1

KMM + Compose: Unresolved reference: drawable

4 Answers4

Linked