WatsMyName
WatsMyName

Reputation: 4478

Flutter: Streambuilder gets called multiple times

I am working on app that displays products. The app has 4 blocks in a listview. Each block showcases the product image with its information, and can be scrolled horizontally to get more data.

I have following sample code

class Home extends StatefulWidget {
  @override
  State<StatefulWidget> createState() {
    return HomeState();
  }
}

class HomeState extends State<Home> {
    //------- other codes

  @override
  void initState() {
    bloc.fetchNewProperties(0);
    super.initState();
  }

  Widget build(BuildContext context) {


    return Scaffold(
      drawer: CustomDrawer(),
      backgroundColor: Constants.scaffoldColor,
      body: NestedScrollView(
        headerSliverBuilder: (BuildContext context, bool innerBoxIsScrolled) {
          return <Widget>[
            SliverAppBar(
              expandedHeight: 216,
              floating: false,
              titleSpacing: 0.0,
              pinned: true,
              flexibleSpace: Container(
                decoration: BoxDecoration(
                  gradient: LinearGradient(
                      begin: Alignment.topLeft,
                      end: Alignment.bottomRight,
                      colors: [Constants.gradientStart, Constants.gradientEnd]),
                ),
                child: FlexibleSpaceBar(
                  centerTitle: true,
                  background: Swiper(
                    itemBuilder: (BuildContext context, int index) {
                      return new Image.asset(
                        tempBannerImages[index],
                        fit: BoxFit.fill,
                      );
                    },
                    itemCount: 2,
                    pagination: new SwiperPagination(),
                    autoplay: true,
                    autoplayDelay: 8000,
                    autoplayDisableOnInteraction: true,
                  ),
                ),
              ),
            ),
          ];
        },
        body: ListView(
          padding: EdgeInsets.only(
              left: size.getSizePx(10), right: size.getSizePx(10)),
          children: <Widget>[
            newProductsBlock(),
            newProductsBlock(),
            newProductsBlock(),
            newProductsBlock(),
            newProductsBlock(), //have added widget multiple times to make stuff scrollable
          ],
        ),
      ),
    );
  }

    Widget newProductsBlock() {

    print("---This gets called just once---");
    return Column(
      children: <Widget>[

        Text("New Products"),
        Container(
          height: 230,
          child: StreamBuilder(
            stream: bloc.allNewProps,
            builder: (context, AsyncSnapshot<ProductsModel> snapshot) {
              print("--this gets called multiple times.---");
              if (snapshot.hasData) {
                return buildNewPropListSwipe(snapshot);
              } else if (snapshot.hasError) {
                return Text(snapshot.error.toString());
              }
              return showCirularLoadingIndicator();
            },
          ),
        )
      ],
    );
  }

}

Problem The products are loaded successfully in these blocks. But when I scrolled all the way down and back to top. The circularloading indicator gets visible, in the first block, instead of already loaded items. When I checked i found that Streambuilder is called multiple times as I scroll down and back again up.

Can anybody help me on this, i am quite new to flutter.

Thanks

Upvotes: 2

Views: 1319

Answers (1)

WatsMyName
WatsMyName

Reputation: 4478

For anybody who stumble upon same issue,

i changed Parent Listview to ScrollSingleChildView and wrapped widgets into Column and it seems to get fixed now

Upvotes: 2

Related Questions