+imageResource from R.drawable causes IllegalArgumentException in Jetpack Compose

Issue

I was testing out Jetpack Compose with a new empty JC activity called HomeActivity. I am trying to load a drawable resource into my code. This is my function:

@Composable
fun home() {
    MaterialTheme(
        colors = colors,
        typography = typography
    ) {
        val menuIcon = +imageResource(R.drawable.ic_baseline_menu_24)
        val bottomActions = listOf<Image>()
        var (drawerState, onDrawerStateChangeListener) = +state { DrawerState.Closed }

        BottomDrawerLayout(drawerState = drawerState, onStateChange = onDrawerStateChangeListener, drawerContent = {
            Text(text = "Drawer")
        }) {
            Column(
                crossAxisSize = LayoutSize.Expand
            ) {
                BottomAppBar(
                    navigationIcon = {
                        drawerState = DrawerState.Opened
                        AppBarIcon(icon = menuIcon, onClick = {})
                    },
                    actionData = bottomActions,
                    action = {
                        AppBarIcon(icon = it, onClick = {})
                    }
                )
            }
        }
    }
}

According to the JC website, +imageResource(R.drawable.xyz) should load the resource as andX.ui Image object imageResource function returns Effect<Image>, it doesn't crash the app but I don't know how to resolve it to Image object needed for AppBarIcon

Some of the Logcat outputs:

java.lang.RuntimeException: Unable to start activity ComponentInfo{com.craftmyspace/com.craftmyspace.activities.HomeActivity}: java.lang.IllegalArgumentException: Parameter specified as non-null is null: method kotlin.jvm.internal.Intrinsics.checkParameterIsNotNull, parameter bitmap
        at android.app.ActivityThread.performLaunchActivity(ActivityThread.java:2913)
        at android.app.ActivityThread.handleLaunchActivity(ActivityThread.java:3048)
        ...os.ZygoteInit.main(ZygoteInit.java:858)


     Caused by: java.lang.IllegalArgumentException: Parameter specified as non-null is null: method kotlin.jvm.internal.Intrinsics.checkParameterIsNotNull, parameter bitmap
        at androidx.ui.graphics.AndroidImage.<init>(Unknown Source:2)
        at androidx.ui.graphics.AndroidImageKt.imageFromResource(AndroidImage.kt:29)
        at androidx.ui.res.ImageResourcesKt$imageResource$1$1.invoke(ImageResources.kt:45)
        at androidx.ui.res.ImageResourcesKt$imageResource$1$1.invoke(Unknown Source:0)
        at androidx.compose.ComposerKt.remember(Composer.kt:1867)
        at androidx.compose.EffectsKt$memo$2.invoke(Effects.kt:287)
        at androidx.compose.EffectsKt$memo$2.invoke(Unknown Source:2)
        at androidx.compose.Effect.resolve(Effects.kt:106)
        at androidx.compose.Effect.resolve$default(Effects.kt:843)
        at androidx.compose.Effect.unaryPlus(Effects.kt:115)
        at androidx.ui.res.ImageResourcesKt$imageResource$1.invoke(ImageResources.kt:45)
        at androidx.ui.res.ImageResourcesKt$imageResource$1.invoke(Unknown Source:2)
        at androidx.compose.Effect.resolve(Effects.kt:106)
        at androidx.compose.Effect.resolve$default(Effects.kt:843)
        at androidx.compose.EffectsKt.unaryPlus(Effects.kt:841)
        at com.craftmyspace.activities.HomeActivityKt$home$1$1$1.invoke(HomeActivity.kt:66)

HomeActivity.kt:66 is this val menuIcon = +imageResource(R.drawable.ic_baseline_menu_24)

Solution

UPDATE: Compose_version = '1.0.0-beta01'

val painter = painterResource(id = R.drawable.img)
Image(
       painter = painter,
       contentDescription = "Profile pic",
       modifier = imageModifier,
       contentScale = ContentScale.Crop
  )

UPDATE: 02/09/2020

In compose version 1.0.0-alpha01 you can use vectorResource(id = R.drawable.my_vector_resource_id) to load vector resources.

Ex: Image(asset = vectorResource(id = R.drawable.my_vector_resource_id)) or Icon(asset = vectorResource(id = R.drawable.my_vector_resource_id))

Old Answer

I have faced the same issue and observed that imageFromResource() and imageResource() can't load vector resources. You need to create a effectOf<VectorAsset> by providing the resource id and use DrawVector() to draw vector assets. You can use below @Composable function to draw vector resources.

@Composable
fun VectorImage(@DrawableRes id: Int, tint: Color = Color.Transparent) {
    val vector = +vectorResource(id)
    WithDensity {
        Container(
            width = vector.defaultWidth.toDp(),
            height = vector.defaultHeight.toDp()
        ) {
            DrawVector(vectorImage = vector, tintColor = tint)
        }
    }
}

Answered By - islamdidarmd