Flutter TabBarView keeps calling builders

Question

I have a StatelessWidget widget for my tabBar which contains 2 statefulWidgets. The thing is that when clicking on manager to watch all my tabs(landing on my first tab as default) the tab1 widget builder keeps being called.

I have already tried this 2 approaches but they did not work:

Multi tab / page view in flutter

Flutter Switching to Tab Reloads Widgets and runs FutureBuilder

It's really annoying because in some widgets I need to make some http requests and they also kept being called as well.

 body:  TabBarView(
        children: <Widget>[
          Tab1Page(),
          Tab2Page(),

here'smy tab1 page, which is a stateFulWidget

Widget build(BuildContext context) {
// TODO: implement build
print("tab1: Builder");
return ScopedModelDescendant<MainModel>(
  builder: (BuildContext context, Widget child, MainModel model) {
    List<SolicitudDto> listadoSolicitudesAprobadas =
        model.obtenerSolicitudesPendientes();

    return Scaffold(
      body: ListView(
        children: <Widget>[
          _buildCards(context, listadoSolicitudesAprobadas)
        ],
      ),
    );
  },
);

}

This is a print capture of my debugger:

Can you share `Tab1Page` content if that is okay? – Dinesh Balasubramanian Aug 16 '18 at 16:43 — Dinesh Balasubramanian, Aug 16 '18 at 16:43
I have updated my description Dinesh :) – Matias Aug 16 '18 at 17:00 — Matias, Aug 16 '18 at 17:00

diegoveloper · Accepted Answer · 2018-08-16T17:17:59.487

2

In case you want to keep the state of your screen in your TabBarView, you can use the mixin class called AutomaticKeepAliveClientMixin in your State class.

After that you have to override the wantKeepAlive method and return true.

I wrote a post about that here: https://medium.com/@diegoveloper/flutter-persistent-tab-bars-a26220d322bc

UPDATE

You could try this way to avoid request data every time you switch tabs.

  //global variable at your state class

  List<SolicitudDto> listadoSolicitudesAprobadas; 


  Widget build(BuildContext context) {
  // TODO: implement build
  print("tab1: Builder");
  return ScopedModelDescendant<MainModel>(
    builder: (BuildContext context, Widget child, MainModel model) {
         if (listadoSolicitudesAprobadas == null){
          listadoSolicitudesAprobadas =   model.obtenerSolicitudesPendientes();
        }

      return Scaffold(
        body: ListView(
          children: <Widget>[
            _buildCards(context, listadoSolicitudesAprobadas)
          ],
        ),
      );
    },
  );

edited Aug 16 '18 at 17:17

answered Aug 16 '18 at 16:31

diegoveloper

93,875
20
236
194

Already tried that one, it's in one of the links as well. The thing is that when being in tab1 page, the builder keeps getting called recursively. – Matias Aug 16 '18 at 16:55
you have to put it inside your Tab1Page and Tab2Page – diegoveloper Aug 16 '18 at 16:56
I have removed my second tab and put that into a my tab1Page. Keeps doing the same. I can not understand why is doing that I have removed all my code from page1 as well in order to discard any bugs. Also read your blog and followed the steps described. – Matias Aug 16 '18 at 17:09
1

oh yes, I saw your code, that's is because the build method is always called, I thought that you were fetching the data in the initState method – diegoveloper Aug 16 '18 at 17:14
I updated my answer to avoid request data every time – diegoveloper Aug 16 '18 at 17:18
1

Nice that did the trick! Nevertheless I'm facing another issue I'll be posting in another question since it's kinda related but not the same thing. – Matias Aug 16 '18 at 18:51

Flutter TabBarView keeps calling builders

1 Answers1