Home > Net >  Toast Doesn't show in jetpack compose project
Toast Doesn't show in jetpack compose project

Time:01-31

So i began learning jetpack compose and i started following a simple tutorial on youtube to list Harry Potter actors in a LazyColumn. However, i was not able to display a simple Toast message by passing the actors name as a Lambda PArameter as shown below :

@Composable
fun HomeScreen(context: Context) {
    val viewModel = getViewModel<HomeViewModel>()
    val state by viewModel.state.collectAsState()
    LazyColumn {
        if (state.isEmpty()) {
            item {
                CircularProgressIndicator(
                    modifier = Modifier
                        .fillMaxSize()
                        .wrapContentSize(align = Alignment.Center)
                )
            }
        } else {
            items(state) { character ->
                CharacterImageCard(character) {
                    Toast.makeText(context, it, Toast.LENGTH_SHORT).show()
                    Log.e("TAG", "HomeScreen:$it ", )
                }
            }
        }
    }
}

PS: note that theres a Log.e, it prints the characters name just fine. heres the Character Image card

@Composable
fun CharacterImageCard(character: CharactersItemX, selectedItem: (String) -> Unit) {
    val imagePainter = rememberImagePainter(data = character.image)
    Card(
        shape = MaterialTheme.shapes.medium,
        modifier = Modifier
            .padding(16.dp)
    ) {
        Row(Modifier.clickable(onClick = { selectedItem(character.name) })) {
            Box {
                Image(
                    painter = imagePainter,
                    contentDescription = character.name,
                    modifier = Modifier
                        .fillMaxWidth()
                        .height(200.dp),
                    contentScale = ContentScale.Fit,
                )

                Surface(
                    color = MaterialTheme.colors.primary.copy(alpha = 0.5f),
                    modifier = Modifier
                        .align(Alignment.BottomCenter),
                    contentColor = MaterialTheme.colors.surface
                ) {

                    Column(
                        modifier = Modifier
                            .fillMaxWidth()
                            .padding(4.dp)
                    ) {
                        Text(
                            text = character.name,
                            style = MaterialTheme.typography.h6
                        )
                        Text(
                            text = character.house,
                            style = MaterialTheme.typography.body2
                        )
                    }

                }

            }

        }

    }
}

I call HomeScreen on my MainActivty

CodePudding user response:

I reproduced your code and Toast works fine. I don't know what's the problem, maybe try getting context from composable instead of passing it from the main activity.

CodePudding user response:

Example:

@Composable
fun HomeScreen(context: Context) {
    val viewModel = getViewModel<HomeViewModel>()
    val state by viewModel.state.collectAsState()
   // use localContext
    val localContext = LocalContext.current
    LazyColumn {
        if (state.isEmpty()) {
            item {
                CircularProgressIndicator(
                    modifier = Modifier
                        .fillMaxSize()
                        .wrapContentSize(align = Alignment.Center)
                )
            }
        } else {
            items(state) { character ->
                CharacterImageCard(character) {
                    Toast.makeText(localContext, it, Toast.LENGTH_SHORT).show()
                    Log.e("TAG", "HomeScreen:$it ", )
                }
            }
        }
    }
}
  • Related