In Android Studio, how to pass an image as a parameter to a function with Jetpack Compose?-CodePudding

I am making a "business card" app which basically displays my photo with my contact info underneath. The contact info consists of rows, with each row displaying the app icon (eg: Instagram) on the left, and my info on the right (eg: My Instagram username).

I've made separate composable functions for each app and called them and it works fine.

For example:-

@Composable
fun InstagramContactInfo() {
    Row(modifier = Modifier
        .fillMaxWidth()
        .padding(start = 30.dp, end = 30.dp, bottom = 16.dp),
        horizontalArrangement = Arrangement.SpaceBetween,
        verticalAlignment = Alignment.CenterVertically) {
        Image(
            painter = painterResource(R.drawable.icons8_instagram_48),
            contentDescription = "Instagram Icon",
            modifier = Modifier.size(50.dp)
        )
        Text(
            text = "@username",
            fontFamily = FontFamily.Monospace,
            color = Color.White,
        )
    }
}

But I want to create a function that just accepts an image as the icon, a userhandle as a String, and then displays this exact same thing.

How do I pass an image as a parameter?

PS: I was trying to embed the resource Id but it doesn't work

@Composable
fun ContactInfo(icon: String, handle: String) {
    Row(modifier = Modifier
        .fillMaxWidth()
        .padding(start = 30.dp, end = 30.dp, bottom = 16.dp),
        horizontalArrangement = Arrangement.SpaceBetween,
        verticalAlignment = Alignment.CenterVertically) {
        Image(
            painter = painterResource(R.drawable.${icon}),
            contentDescription = "App Icon",
            modifier = Modifier.size(50.dp)
        )
        Text(
            text = handle,
            fontFamily = FontFamily.Monospace,
            color = Color.White,
        )
    }
}

CodePudding user response：

You should be getting drawable from string like below. But its not compile time safe. If the particular image not available in drawable folder it might throw Exception If you have drawable with id R.drawable.your_icon , you should pass as "your_icon"

@Composable
fun ContactInfo(icon: String, handle: String) {
    Row(modifier = Modifier
        .fillMaxWidth()
        .padding(start = 30.dp, end = 30.dp, bottom = 16.dp),
        horizontalArrangement = Arrangement.SpaceBetween,
        verticalAlignment = Alignment.CenterVertically) {
     Image(
                painter = painterResource(
                    LocalContext.current.resources.getIdentifier(icon, "drawable", LocalContext.current.packageName)),
                contentDescription = "App Icon",
                modifier = Modifier.size(50.dp)
            )
         Text(
            text = handle,
            fontFamily = FontFamily.Monospace,
            color = Color.White,
        )
    }
}

But if its possible to use Resource Id directly, you can have it like below instead of string.

@Composable
fun ContactInfo(@DrawableRes icon: Int, handle: String) {
    Row(modifier = Modifier
        .fillMaxWidth()
        .padding(start = 30.dp, end = 30.dp, bottom = 16.dp),
        horizontalArrangement = Arrangement.SpaceBetween,
        verticalAlignment = Alignment.CenterVertically) {
        Image(
            painter = painterResource(icon),
            contentDescription = "App Icon",
            modifier = Modifier.size(50.dp)
        )
        Text(
            text = handle,
            fontFamily = FontFamily.Monospace,
            color = Color.White,
        )
    }
}

Here you can pass like R.drawable.your_icon .