[TUTORIAL BUBBLE] Para iniciantes – Como criar uma tabela com cores alternadas no seu aplicativo
Introdução
Este é um rápido tutorial que fiz para mostrar uma das táticas que uso para deixar meus aplicativos mais atraentes: as linhas zebradas.
Quando você tem muitos dados para mostrar, as tabelas facilmente ficam poluídas e difíceis de compreender para o usuário do App, e por isso é importante que deixemos a tabela mais simples de se visualizar.
Ao fazermos uma simples mudança, colocando cores alternadas na planilha, todo o aplicativo fica mais organizado e mais agradável de se usar.
Para isso, basta criar um grupo dentro do Grupo Repetidor que você colocou no seu aplicativo, e criar uma Formatação Condicional da seguinte forma:
Como funciona
O índice da célula atual nada mais é que o número da célula dentro do grupo repetidor. Ou seja, se for a primeira célula, o índice será 1. Se for a segunda célula, o índice será 2, e por aí vai.
A operação módulo é usada para obter o resto de uma divisão. Calma, eu sei que parece confuso, mas é simples:
Quando o índice da célula atual modulo 2 resulta em 1, estamos pedindo para o Bubble usar esse resto para decidir a cor da célula. Em termos práticos, se o resto for 1, a célula fica com uma cor; se for 0, com outra.
Quando fazemos a formatação Índice da célula atual modulo 2 = 1, pintamos a célula com uma cor mais escura, e quando o modulo = 0, pintamos a célula com uma cor mais clara.
E assim temos o resultado abaixo:
Conseguiu?
Se tiver dúvidas, fale comigo por aqui ou pelo Youtube!
Links úteis
Canal do YouTube Coaching No Code Apps (Tutoriais Bubble em Inglês)