How to pass variables from a reusable widget to a flutter screen?

Question

Hello, I’m seeking to reuse some widgets from my app, I’ll give a brief example.
I have an Appbar, which in case is my General Menu, present on all screens.

import 'package:flutter/material.dart';
class MenuGeral extends StatelessWidget  implements PreferredSize {
  bool exibirConteudo = false;
  @override
  Size get preferredSize => const Size.fromHeight(100);
  Widget build(BuildContext context) {
    return AppBar( // CABEÇALHO
      title: "Text",
      actions: <Widget>[
        IconButton(
            icon: Icon(Icons.menu,color: Colors.white),
            onPressed: (){
              exibirConteudo= !exibirConteudo;
              print("$exibirConteudo");
            }
        )
      ],
       ...
    );
  }

As seen, it has a variable called displayConteud

I need to pass this variable displayConference to another screen call

import 'package:flutter/material.dart';
import 'package:meuPackage/widgets/menu_geral.dart';
class Home extends StatefulWidget {
  @override
  _HomeState createState() => _HomeState();
}

class _HomeState extends State<Home> {
 bool _exibirConteudo = false;
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: MenuGeral(),
      body: Visibility(
          visible: exibirConteudo,
          return widgetQueQueroExibir(),
      )
      ...
    );
}

I already managed to put the widget on the necessary screens, but I can’t get the value of the active variable.
I need to take the value of this variable, because in the body of my Home, has a Visibility widget that receives this value, to obviously display or not another Widget

What is a good way to do this, without giving a Navigator.Placement passing the variable from the Menugeral?

Briefly, I want to be able to use a Boolean variable from a reusable Widget (Stateless) on all other screens of my app (Statefull), to perform an action, without using Navigator.push, if possible.

Answer 1

Follow an example of suggestion:

• In your Appbar class, set a callback function as a parameter:

class MenuGeral extends StatelessWidget  implements PreferredSize {
  MenuGeral({this.callback});
  final Function callback;
  bool exibirConteudo = false;
  @override
  Size get preferredSize => const Size.fromHeight(100);
  Widget build(BuildContext context) {
    return AppBar( // CABEÇALHO
      title: "Text",
      actions: <Widget>[
        IconButton(
            icon: Icon(Icons.menu,color: Colors.white),
            onPressed: (){
              exibirConteudo= !exibirConteudo;
              print("$exibirConteudo");
              callback(exibirConteudo); // Chame-a aqui.
            }
        )
      ],
       ...
    );
  }

Obs: Don’t forget to call her inside the onTap:

• In the status class of your screen, create this function that will be passed by parameter:

class _HomeState extends State<Home> {
    void callbackDaAppBar(bool variavel){
        setState((){_exibirConteudo = variavel;});
    }
    bool _exibirConteudo = false;
    [...]
}

• When creating appBar, pass the created function as parameter:

[...]
appBar: MenuGeral(callback:callbackDaAppBar),
[...]

This should be enough to make it work what you want. So each screen can do whatever you want with information from appBar. If all screens do the same thing, you can create another own widget but that already contains what was done above, and automatically calls setState when the visibility changes, but there is already a much more sophisticated solution.

There are many other ways to resolve such a situation. They involve greater knowledge and planning of your state management. For this, I strongly suggest reading that source and that answer as additional queries.