Triple Pattern — Um novo jeito de gerenciar seus estados
Atualmente no flutter temos diversos pacotes que nos auxiliam a gerenciar o estado de nossos apps e isto é ótimo, entretanto quando o assunto é padrão para a gerência de estado o cenário é um pouco decepcionante.
O principal objetivo do triple é segmentar o valor do estado da aplicação em três, o objeto de estado, o erro e o carregamento, juntando em um único objeto observável, e temos até um nome para este padrão, chamamos de Segmented State Pattern.
E a grande sacada é que você pode utilizá-lo com os principais padrões de gerencias de estados existentes no mundo do Flutter (BLOC, ValueNotifier, MobX, GetX, etc).
Então vamos para nosso exemplo. Vamos utilizar o mobX para este exemplo.
Primeiramente precisamos adicionar alguns package essenciais para nossa aplicação.
O DartZ, o flutter_triple e o mobx_triple.
Depois precisamos construir uma classe que por convenção colocaremos o sufixo “store” que será responsável por gerenciar o estado da minha aplicação, esta classe precisa herdar de MobXStore e passamos para ele 2 parâmetros, o tipo da minha exceção e o tipo do meu valor que será observável.
Os tipos podem ser de tipos primários(int, char, String)
Ou caso queira observar vários valores podemos criar uma classe com os atributos
Para evitarmos problemas é importante que nossa classe seja imutável
Precisamos também criar o construtor da nossa store e chamar o construtor pai passando o valor inicial do meu observável.
Então podemos criar nosso método que irá alterar o valor do meu observável, que está armazenado no atributo “state”, para isso utilizaremos a função execute.
Desta forma conseguimos atualizar o primeiro segmento do triple, para atualizar os outros seguimentos podemos utilizar o setLoading(bool) para emitir o estado de carregamento e o setError(Error) emitir o estado de erro.
Se caso estivermos utilizando a biblioteca DartZ e trabalharmos com o Either (que nós da a possibilidade de retornar um erro e um valor) conseguimos utilizar o método executeEither(Future<Either<Error, State>> Function())
Na nossa tela para fazer com que a reatividade ocorra precisamos envolver nosso widget que será atualizado no TrippleBuilder() ele funciona parecido com o Observer() do mobx, ele irá executar o parâmetro builder toda vez que houver uma alteração.
Agora quiser segmentar todos os estados pode utilizar o ScopedBuilder()
Viu só como ficou fácil trabalhar com as gerencias de estados?
Confira o exemplo que preparei para vocês
