Como atualizar um estado de widget de outro widget no Flutter usando chave global?

Question

Eu tenho uma tela de widget principal que contém dois widgets principais, um cabeçalho (marcado com vermelho) e uma lista (marcada com roxo).

Aqui está o meu código para isso:

    class ScreenClient extends StatefulWidget {
      _ClientState createState() => _ClientState();
    }
    
    class _ClientState extends State<ScreenClient> {
      @override
      Widget build(BuildContext context) {
        return Column(
          mainAxisAlignment: MainAxisAlignment.start,
          children: <Widget>[
            ClientHeader(), // this is my header widget red
            Expanded(
              child: ClientList(), // this is my list widget purple
            ),
          ],
        );
      }
    }

o widget de cabeçalho tem três opções como você pode ver Tous Bloquée ayant Retardo que estou tentando alcançar é passar o valor da opção clicada para o widget de lista marcado em roxo (porque essas opções são filtros e os elementos da lista devem ser mostrados com base no opção escolhida)
Tenho dificuldade em entender os pacotes de gerenciamento de estado e, pelo que entendi, Global Keysposso resolver o problema, mas como? . aqui está o código do widget de cabeçalho:

class ClientHeader extends StatefulWidget {
  _HeaderClientState createState() => _HeaderClientState();
}

class _HeaderClientState extends State<ClientHeader> {
  String nomSituation;
  String option = "Tous";

  @override
  Widget build(BuildContext context) {
    return Container(
      child: Row(
        children: <Widget>[
          GestureDetector(
            child: Text(
              "Tous",
              style: TextStyle(
                color: option == "Tous" ? Colors.white : Colors.grey[400],
              ),
            ),
            onTap: () {
              setState(() {
                option = "Tous";
              });
            },
          ),
          GestureDetector(
            child: Text(
              "Bloqué",
              style: TextStyle(
                color: option == "Bloqué" ? Colors.white : Colors.grey[400],
              ),
            ),
            onTap: () {
              setState(() {
                option = "Bloqué";
                //add send value to ClientList widet ?
              });
            },
          ),
          GestureDetector(
            child: Text(
              "Ayant Retard",
              style: TextStyle(
                color:
                    option == "Ayant Retard" ? Colors.white : Colors.grey[400],
              ),
            ),
            onTap: () {
              setState(() {
                option = "Ayant Retard";
              });
            },
          ),
        ],
      ),
    );
  }
}

Answer 1

Eu sugiro que você pode assistir a 2 exemplos neste vídeo Pragmatic State Management in Flutter (Google I / O'19) sobre state mangement. Este vídeo me ajudou muito quando eu aprendi flutter no começo. Eles explicam como controlar o StatefulWidgetdo outro:

1. Tornar o estado global, controlado por outro widget (a partir de 5m30s )
2. Use Provider, que é uma solução muito popular no Flutter, para controlar o compartilhamento do valor entre 2 widgets ( de 15m05s )

Se você tiver mais tempo, poderá estudar métodos de gerenciamento de estado mais sofisticados como Bloc, MobX ( Lista de abordagens de gerenciamento de estado ) ou até mesmo a versão avançada do Providernamed riverpod apenas empurrado alguns meses atrás, que tenta resolver alguns contras ao usar o Provider.