[Tutorial] Como fazer um Repeating Group com Cores Alternadas

renatoasse · September 21, 2019, 3:05pm

Fala pessoal!

Este é um rápido tutorial que fiz no Bubble 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:

Ou acesse o tutorial em texto: https://www.semcodar.com.br/tutorial-bubble-para-iniciantes-como-criar-uma-tabela-com-cores-alternadas-no-seu-aplicativo

Obrigado à Gaby Roman (Coaching No Code Apps) pela inspiração em fazer esse vídeo. Link do canal dela abaixo.
Thank you to Gaby Roman (Coaching No Code Apps) for the inspiration in doing this video. I will link her channel below.

Abraços,

Renato Asse
Meus tutoriais de Bubble no YouTube: https://www.youtube.com/channel/UCvNQuM8oPy-oO-5RZ80vf8Q
Meu tutoriais de Bubble no Blog: https://www.semcodar.com.br

Canal da Gaby Roman (Coaching No Code Apps) com excelentes tutoriais em inglês: https://www.youtube.com/channel/UCTL_mXO3qsgFc_3s2T5wlWg

apicedigital · March 6, 2020, 5:35pm

É possível criar uma entrada direto em um RepeatingGroup?
Por exemplo, adicionar um usuário como no seu exemplo, adicionar uma nova tarefa numa task list, adicionar um novo produto na lista, etc…

renatoasse · March 6, 2020, 5:40pm

Sim!
Duas formas:

Custom States (estados personalizados)
Display list

Faço isso direto quando estou editando um cadastro, por exemplo, e o usuário ainda não clicou em salvar.
Eu não posso salvar no banco de dados pois as mudanças ainda não são definitivas, então eu vou adicionando itens direto no Repeating Group (via custom states, ou usando a ação “Repeating Group > Display list” e adicionando o elemento que quero.
Depois na hora de salvar no banco, eu salvo a lista de itens do grupo repetidor.

apicedigital · March 6, 2020, 7:44pm

Estive até agora tentando fazer pelo Display List mas não estou sabendo como fazer.
Já fez algum vídeo sobre isso ou teria algum pra me indicar?

renatoasse · March 6, 2020, 8:28pm

Tenho, mas só dentro do Curso Sem Codar.

Mas em resumo é assim:

Ou seja, estamos pegando o conteúdo que já existe no grupo repetidor, e colocando (“:plus item”) mais um item nele