Entendendo os tipos de Widgets do Flutter
Ao iniciar seu aprendizado com Flutter, uma das primeiras coisas que você precisará aprender é sobre os Widgets.
O que são Widgets?
Widgets nada mais são do que componentes que podem ou não possuir um estado e são usados para moldar nossa interface do usuário (UI).
O que é um “estado”?
Para exemplificar o que é estado, vamos utilizar o exemplo de um aplicativo de galeria de imagens.
Stateful Widget:
Stateful Widget são “componentes” que possuem um estado, ou seja, durante a execução pode haver alterações naquele componente sem precisar redirecionar para outra tela.
Observe a imagem acima, vemos que todos os elementos tracejados em amarelo são estados do nosso widget, caso o usuário pressione um álbum, imagem ou momento será exibido algumas opções, dentre elas a opção de exclusão.
Ao excluir um album, foto, momento, o usuário não será redirecionado para outra página, ele continuará na mesma e o estado dela sera atualizado, ou seja, o grid será recarregado com o novo estado sem os itens excluídos. Se você reparar bem, na segunda tela possui um contador, ao excluir um item, esse contador precisará ser atualizado, sendo assim, ele também é um atributo do nosso estado.
Stateless Widget:
Stateless Widget são componentes sem estado, ou seja, são componentes que não possuirão alteração após renderizado.
No exemplo da galeria ao clicar sobre uma thumb na galeria de imagens, o passo seguinte é exibir uma nova tela com a imagem em tamanho real para o usuário.
Qual o motivo dessa tela não possuir um estado?
Para responder essa pergunta, vamos listar as opções que um usuário teria nessa tela. Ele poderia compartilhar a imagem, editar a imagem ou excluir a imagem.
Alguma destas opções necessitaria que esta tela fosse atualizada?
Se você pensar bem, ao editar uma foto, o sistema abre outro aplicativo ou então chama outra página de edição. A edição de imagem geralmente não está dentro da mesma página de visualização.
Compartilhar não necessitaria atualizar o estado porque também chamaria outro widget para realizar a função de compartilhamento. Se você já tentou compartilhar alguma imagem ou qualquer coisa, já viu que abre um modal com as opções de aplicativos disponíveis para compartilhar. Essa janela modal é outro widget que sobrepõe nossa visualização.
Exclusão, este sim teria um efeito imediato na tela, porém você concorda que quando excluimos uma imagem o próximo passo é passar para a imagem seguinte ou então retornar a galeria?
Então novamente a tela não teria uma atualização do seu próprio estado.
Conclusão
Para criar um widget você pode utilizar qualquer um dos tipos disponíveis, porém é importante criar o tipo de widget certo para sua necessidade, pois a construção de um Stateful Widget consome mais memória do aparelho do que um Stateless Widget.
Sobre o autor da publicação
Sou Fabiano Santana, tenho 22 anos. Arquiteto de Sistemas com foco em .NET e Analista de Experiência do Usuário, conhecido como o famoso desenvolvedor Full Stack (prefiro chamar de fullydev) e UX Design. Amo de coração criação de UI e como ela aproxima as pessoas.
Seguem meus contatos caso queiram tirar alguma dúvida ou fazer sugestões para melhoria.
