Bom dia a todos
Tava vendo o código de implementação do professor da tela de Failure do ProductDetailsScreen:
Column(
Modifier.fillMaxSize(),
verticalArrangement = Arrangement.Center,
horizontalAlignment = Alignment.CenterHorizontally
) {
Text(text = "Falha ao buscar o produto")
Spacer(modifier = Modifier.height(8.dp))
Button(onClick = onTryFindProductAgain) {
Text(text = "Tentar buscar novamente")
}
Spacer(modifier = Modifier.height(8.dp))
TextButton(onClick = onBackStack) {
Text(text = "Voltar")
}
}
}
Antes de ver esse código, eu tava tentando fazer sozinho e tinha encontrado uma solução num fórum. Ela facilita a implementação e não precisa usar o Spacer, que é o .wrapContentSize()
, que alinha o column inteiro e deixa o verticalArrangement
livre para outras modificações. Eu fiz desse jeito, com o código mais simples e mais fácil de alterar:
Column(
Modifier.fillMaxSize()
.wrapContentHeight(Alignment.CenterVertically),
verticalArrangement = Arrangement.spacedBy(8.dp),
horizontalAlignment = Alignment.CenterHorizontally,
) {
Text(text = "Falha ao buscar o produto")
Button(onClick = onTryFindProductAgain ) {
Text(text = "Tentar buscar novamente")
}
Button(onClick = onBackStack ) {
Text(text = "Voltar")
}
}
}
O resultado ficou assim (deixei o espaço de 16dp, mas podem alterar, se quiser):
Como eu falei, o .wrapContentHeight(Alignment.CenterVertically)
alinhou a column para o meio, e o verticalArrangement
ficou livre para fazer o espaçamento entre os elementos com o spacedBy()