Error in JetPack Compose when trying to load screen

Question

I have a categories screen that I am trying to load but when attempting to do so, I get the following error message

"FATAL EXCEPTION: main Process: com.example.newsapp, PID: 4645 Java.lang.IllegalArgumentException: Wrong source was used: 2130968578, The source should be one of ImageBitmap, ImageVector, or Painter."

@Composable
fun Categories(onFetchCategory: (String) -> Unit={}, newsManager: NewsManager) {
    val tabsItems = getAllArticlesCategory()
    Column {
        LazyRow() {
            items(tabsItems.size) {
                val category = tabsItems[it]
                CategoryTab(
                    category = category.categoryName, onFetchCategory = onFetchCategory,
                    isSelected = newsManager.selectedCategory.value == category
                )
            }
        }
        ArticleContent(articles = newsManager.getArticleByCategory.value.articles ?: listOf())
    }
}


@Composable
fun CategoryTab(category: String, isSelected: Boolean = false, onFetchCategory: (String) -> Unit) {
    val background = if (isSelected) colorResource(id = R.color.purple_200) else colorResource(id = R.color.purple_500)
    Surface(
        modifier = Modifier
            .padding(horizontal = 4.dp, vertical = 16.dp)
            .clickable {
                onFetchCategory(category)
            },
        shape = MaterialTheme.shapes.small,
        color = background
    ) {
        Text(
            text = category,
            style = MaterialTheme.typography.body2,
            color = Color.White,
            modifier = Modifier.padding(8.dp)
        )
    }
}

@Composable
fun ArticleContent(articles: List<TopNewsArticle>, modifier: Modifier = Modifier) {
    LazyColumn {
        items(articles) {
            article ->
            Card(modifier.padding(8.dp), border = BorderStroke(2.dp, color = colorResource(id = R.color.purple_500))) {
                Row(
                    modifier
                        .fillMaxWidth()
                        .padding(8.dp)) {
                    CoilImage(
                        imageModel = article.urlToImage,
                        modifier = Modifier.size(100.dp),
                        placeHolder =
                            painterResource(
                                id = R.drawable.breaking_news
                            ),
                        error = R.drawable.breaking_news
                    )
                    Column(modifier.padding(8.dp)) {
                        Text(
                            text = article.title ?: "Not Available",
                            fontWeight = FontWeight.Bold,
                            maxLines = 3, overflow = TextOverflow.Ellipsis
                        )
                        Row(
                            modifier.fillMaxWidth(),
                            horizontalArrangement = Arrangement.SpaceBetween,
                        ) {
                            Text(text = article.author ?: "Not Available")
                            Text(text = MockData.stringToDate(article.publishedAt ?: "2021-11-10T14:25:20Z").getTimeAgo())
                        }
                    }
                }
            }
        }
    }
}

@Preview
@Composable
fun ArticleContentPreview() {
    ArticleContent(articles =
        listOf(TopNewsArticle(
                author = "Namita Singh",
                title = "Cleo Smith news — live: Kidnap suspect 'in hospital again' as 'hard police grind' credited for breakthrough - The Independent",
                description = "The suspected kidnapper of four-year-old Cleo Smith has been treated in hospital for a second time amid reports he was “attacked” while in custody.",
                publishedAt = "2021-11-04T04:42:40Z"
            )
        )
    )
}

When trying to load this view I am getting this error

FATAL EXCEPTION: main Process: com.example.newsapp, PID: 4645  java.lang.IllegalArgumentException: Wrong source was used: 2130968578, The source should be one of ImageBitmap, ImageVector, or Painter.

I am not sure what I am supposed to do differently. These are my dependencies

implementation "com.github.skydoves:landscapist-coil:1.4.1"
implementation("com.squareup.moshi:moshi-kotlin:1.15.0")
implementation("com.squareup.retrofit2:converter-moshi:2.9.0")
implementation("com.squareup.retrofit2:retrofit:2.9.0")
implementation("androidx.compose.material:material:1.4.3")
implementation "androidx.compose.material:material-icons-extended:1.4.3"
implementation("androidx.navigation:navigation-compose:2.6.0-rc02")
implementation 'androidx.core:core-ktx:1.8.0'
implementation platform('org.jetbrains.kotlin:kotlin-bom:1.8.0')
implementation 'androidx.lifecycle:lifecycle-runtime-ktx:2.3.1'
implementation 'androidx.activity:activity-compose:1.5.1'
implementation platform('androidx.compose:compose-bom:2022.10.00')
implementation 'androidx.compose.ui:ui'
implementation 'androidx.compose.ui:ui-graphics'
implementation 'androidx.compose.ui:ui-tooling-preview'
implementation 'androidx.compose.material3:material3'
testImplementation 'junit:junit:4.13.2'
androidTestImplementation 'androidx.test.ext:junit:1.1.5'
androidTestImplementation 'androidx.test.espresso:espresso-core:3.5.1'
androidTestImplementation platform('androidx.compose:compose-bom:2022.10.00')
androidTestImplementation 'androidx.compose.ui:ui-test-junit4'
debugImplementation 'androidx.compose.ui:ui-tooling'
debugImplementation 'androidx.compose.ui:ui-test-manifest'

the thing thats causing this problem is the CoilImage you are using it seems that it doesn't accept the type that you have passed to it. honesly why don't you just use the normal official Coil library it has everything needed to load images it just need a Url — Ayman Ait, Jun 17 '23 at 01:03

score 0 · Answer 1 · answered Jun 16 '23 at 15:21

As mentioned here, you have to pass An ImageBitmap, ImageVector, or Painter to the error parameter

@param error An [ImageBitmap], [ImageVector], or [Painter] for showing instead of the target image when images are failed to load.

Pass the error parameter in the same way you have done for the placeholder.

painterResource(
    id = R.drawable.breaking_news
)

Error in JetPack Compose when trying to load screen

1 Answers1