Solucionado (ver solução)
Solucionado
(ver solução)
1
resposta

[Sugestão] Outra maneira de implementar a tela de Failure

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):

tela de erro alinhada no centro no eixo vertical e com espaçamento de 16dp entre os elementos

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()

1 resposta
solução!

Oi Murilo, tudo bem?

Muito obrigada por compartilhar sua solução para a implementação da tela de Failure no ProductDetailsScreen do curso Jetpack Compose: Navigation com Type Safety. É sempre interessante explorar diferentes abordagens e encontrar soluções mais simples e fáceis de alterar.

A sua solução utilizando o .wrapContentHeight(Alignment.CenterVertically) é uma alternativa válida para alinhar a coluna verticalmente no centro, deixando o verticalArrangement livre para outras modificações. Além disso, o uso do Arrangement.spacedBy() para definir o espaçamento entre os elementos da coluna também é uma boa prática.

A imagem que você compartilhou mostra o resultado da sua implementação, com a tela de erro alinhada no centro no eixo vertical e com espaçamento de 16dp entre os elementos. Ficou muito bom!

Continue explorando e testando diferentes abordagens, pois isso contribui para o seu aprendizado e para o desenvolvimento das suas habilidades em programação.

Um abraço e bons estudos.