Flutter : How to Recover a Screen with Data in Navigator Stack

Asked

Viewed 162 times

0

I’m making a sales app, where I use a Drawer to move between the screens using the commands of Navigator, and found the following situation

1 - When opening the app it enters the main screen where the sale is made

2 - I select two products to sell

3 - soon after I leave the sale screen that has the two products and go to customers screen

4 - now I need to go back to sales screen, and the two products that had already been selected should still be there

Okay, in this part 4, using the button to get back on the phone it comes back a screen and goes to this sales screen (with the two products there), but if I go on Drawer and select the option to go to the sales screen, how do I search this screen at the beginning of the stack instead of creating a new sales screen (which comes empty without both products). I want this because, if it is only a screen on top of the stack, no problem, the user presses back and ready, but if there are for example 5 or 6 screens on top, it is a great wear for the user to have to go back all, pressing several times on the back, to not lose what has already been done on the sale screen. Is there a Navigator command that does this ? I’ve looked for some things, but I haven’t found anything that helps me.

Code of the Drawer

    @override
  Widget build(BuildContext context) {
    Size size = MediaQuery.of(context).size;
    return MultiLevelDrawer(
            backgroundColor: Color(0xfff0f3f4),
            rippleColor: Colors.white,
            subMenuBackgroundColor: Color(0xfff0f3f4),
            divisionColor: Colors.grey,
            header: Container(
              height: size.height * 0.25,
              child: Center(
                child: Column(
                  mainAxisAlignment: MainAxisAlignment.center,
                  children: <Widget>[
                  Image.asset(
                  "Imagens/ACMIL_CIRCULAR.png",
                  width: 100,
                  height: 100,
                ),
                SizedBox(
                  height: 10,
                ),
                Text("Usuario : Iury")
              ],
            )),
            ),
            children: [
            MLMenuItem(
                leading: Icon(Icons.person),
                trailing: Icon(Icons.arrow_right),
                content: Text(
                  "Cadastro",
                ),
                subMenuItems: [
                  MLSubmenu(
                      onClick: () {
                        Navigator.of(context).pop();
                        Navigator.of(context).push(MaterialPageRoute(builder: (context) => ClientePesquisa("",0,"",0)));
                      },
                      submenuContent: Text("Cliente")),
                  MLSubmenu(onClick: () {
                        Navigator.of(context).pop();
                        Navigator.of(context).push(MaterialPageRoute(builder: (context) => ProdutoPesquisa(0,"",0,0,"")));
                  }, 
                  submenuContent: Text("Produto")),
                  MLSubmenu(onClick: () {
                        Navigator.of(context).pop();
                        Navigator.of(context).push(MaterialPageRoute(builder: (context) => VendedorPesquisa(0,"",0)));
                  }, 
                  submenuContent: Text("Vendedor")),
                  MLSubmenu(onClick: () {
                        Navigator.of(context).pop();
                        Navigator.of(context).push(MaterialPageRoute(builder: (context) => CondPGTOPesquisa("","","","")));
                  }, 
                  submenuContent: Text("Cond. de Pagamento")),
                  MLSubmenu(onClick: () {
                        Navigator.of(context).pop();
                        Navigator.of(context).push(MaterialPageRoute(builder: (context) => FormaPGTOPesquisa(0,"")));
                  }, 
                  submenuContent: Text("Forma de Pagamento")),
                ],
                onClick: () {}),
            MLMenuItem(
              leading: Icon(Icons.local_grocery_store),
              content: Text("Pré-Venda"),
              onClick: () {
                Navigator.of(context).push(MaterialPageRoute(builder: (context) => PedidoVenda()));
              },
            ),
            MLMenuItem(
              leading: Icon(Icons.settings),
              content: Text("Configuração"),
              onClick: () {
                Navigator.of(context).push(MaterialPageRoute(builder: (context) => Configuracao()));
              }
            )],
          );
  }
}

1 answer

1


I believe that what you need is to understand and apply Instance Management in your app. For this there are Packages that help as Getx.

For you to be able to recover the same instance of an object on any screen of the app you can do the following using Getx.

Let’s say you have a class that has a list of products, which you need to add and remove products from and retrieve on other screens in your app.

class CarrinhoController {

List<Produto> produtos = [];

}

Here we will register the above class as a Singleton, so that we can always retrieve the same instance later.

void main() {

  WidgetsFlutterBinding.ensureInitialized();

// Aqui você registra sua classe, basicamente é um singleton
  Get.put(CarrinhoController());

  runApp(MyApp());
}

There are two ways to access your English:

CarrinhoController carrinhoController = Get.find();

You can add products to your list:

carrinhoController.produtos.add(novoProduto);
// Ou de forma direta, que seria a segunda forma de acesso ao singleton
Get.find<CarrinhoController>().produtos.add(novoProduto);

Now you are on another screen and need to recover the cart, the products present in the list, you can do:

CarrinhoController carrinhoController = Get.find();
print(carrinhoController.products.length); // vai imprimir 2, ja que adicionou 
                                           // dois produtos em um outra tela.

Anywhere you recover the instance with Get.find(), you will recover it, where your variables, objects etc will be...

Give a read on this package Getx, in it explains well about management of memory and state how to use, things that I think will be essential for your app and in my opinion is the easiest way to use currently with Flutter.

  • Thank you very much, helped me a lot, I will study and deploy in my code to solve my question

  • If my answer is correct I could mark it as the correct one?

Browser other questions tagged

You are not signed in. Login or sign up in order to post.