[Flutter] FutureBuilder do Jeito Certo

Como utilizar o FutureBuilder no Flutter?

Bastante gente tem feito essa pergunta, então resolvi criar esse post.

Como esse cara funciona?

O FutureBuilder executa a função informada em sua propriedade future.
Até aqui tudo certo, mas temos um problema quando envolve o setState: A função é carregada novamente.

Por quê esse problema acontece?

O Flutter trabalha com duas árvores:

1. Árvore de Widgets
   A Árvore de Widgets é o código que escrevemos para montar o layout.
2. Árvore de Elementos
   A Árvore de Elementos é um "esqueleto" da UI, uma das sacadas para o Flutter ser tão rápido em desenhar na tela e atualizar seus desenhos nas animações.
3. Árvore de Renderização
   A Árvore de Renderização é a UI em si, a parte visual que o usuário consegue ver.

O setState executa novamente o método build. A estrutura de Widgets se vira muito bem com isso e não reconstrói toda a UI, mas métodos de dentro do build são executados novamente.
Essa é a causa do problema, pois o pessoal costuma colocar a função diretamente na propriedade future do FutureBuilder.

Como resolver esse problema?

Essa pergunta é fácil de responder, basta criar uma variável do tipo Future<Tipo> e iniciá-la no InitState de seu widget. Dessa forma, podemos utilizar essa variável na propriedade future do FutureBuilder, impedindo que a função seja executada novamente.

Resumão

Sempre que quiser trabalhar com FutureBuilder, não coloque a função diretamente na propriedade future, pois o setState sempre executa o método build, iniciando novamente sua função.

Crie uma variável do tipo Future<Tipo> e inicie a função no InitState de seu widget;

Utilize essa variável na propriedade future, dessa forma não iniciará novamente a função com um setState;

Exemplo

1. Quando os segundos da hora atual forem par, será apresentado um quadrado verde;
2. Quando os segundos da hora atual forem ímpar, será apresentado um quadrado vermelho;
3. O número capturado, e os setStates serão printados no DEBUG CONSOLE;
4. O código está comentado para facilitar o entendimento;

Código do exemplo no GIST

Valeu pessoal, até a próxima!