Flutter: Future Builder fetch multiple data

Question

I am consulting the news section of my website. I'm using Future Builder to get the data from the web. The problem I get is related to the image that I try to show on the screen. And when there is a lot of news, the data load takes a long time and I do not know if there is a solution for loading faster.

I am consulting the text of the news through a json. At that moment you get the URL of another JSON where the image is in thumbnail format.

I hope to solve this problem, I appreciate any help.

News.dart - Code

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: searchBar.build(context),
      key: _scaffoldKey,
      body: new Container(
        color: Colors.grey[800],
        child: new RefreshIndicator(
            child: new ListView(
              children: <Widget>[
                new FutureBuilder<List<Post>>(
                  future: fetchPosts(URLWEB),
                  builder: (context, snapshot) {
                    if(snapshot.hasData) {
                      List<Post> posts = snapshot.data;
                      return new Column(
                        children: posts.map((post2) => new Column(
                          children: <Widget>[
                            new Card(
                                margin: new EdgeInsets.symmetric(vertical: 20.0, horizontal: 20.0),
                                color: Colors.white,
                                child: new GestureDetector(
                                  child: new Column(
                                    crossAxisAlignment: CrossAxisAlignment.stretch,
                                    children: <Widget>[
                                      new FutureBuilder(
                                        future: fetchPostsIMG(post2.imagen),
                                        builder: (context, AsyncSnapshot<PostImg> snapshot2){
                                          return new Container(
                                            height: 200.0,
                                            decoration: new BoxDecoration(
                                                image: new DecorationImage(
                                                    image: CachedNetworkImageProvider(snapshot2.data.imagen == null ? new AssetImage('images/logotipo.png') : snapshot2.data.imagen),
                                                    fit: BoxFit.fitWidth
                                                )
                                            ),
                                            width: MediaQuery.of(context).size.width,
                                          );
                                        },
                                      ),
                                      new ListTile(
                                        title: new Text(post2.titulo.replaceAll("&#8216;", "").replaceAll(
                                            "&#8217;", "").replaceAll("&#8211;", "")
                                            .replaceAll("&#8230;", "").replaceAll(
                                            "&#8221;", "")
                                            .replaceAll("&#8220;", ""),
                                          style: new TextStyle(
                                              color: Colors.black,
                                              fontSize: 18.0,
                                              fontWeight: FontWeight.bold),),
                                        subtitle: new HtmlView(data: post2.informacion),
                                        dense: true,
                                      )
                                    ],
                                  ),
                                  onTap: () {
                                    //Navigator.of(context).push(new MaterialPageRoute(builder: (BuildContext context)=> new WebView(url: post2.urlweb, titulo: titulo)));
                                  },
                                )
                            )
                          ],
                        )).toList(),
                      );
                    }
                    else if(snapshot.hasError)
                    {
                      return new Container();
                    }
                    return new Center(
                      child: new Column(
                        children: <Widget>[
                          new Padding(padding: new EdgeInsets.all(50.0)),
                          new CircularProgressIndicator(),
                        ],
                      ),
                    );
                  },
                ),
              ],
            ),
            onRefresh: _autoRefresh
        ),
      ),
    );
  }
}

Answer 1

It's because you are trying to access imagen on null object. You can do hasData check like below

CachedNetworkImageProvider(snapshot2.hasData ? snapshot2.data.imagen : new AssetImage('images/logotipo.png')),