How to make infinity scroll layout in flutter? (Updated)

Question

I'm trying to make listview using data from REST API, the position is below my image, but the layout reach its limit, so i can't create it, and showing this error here my code, (Updated Code)

import 'package:http/http.dart' as http;
import 'dart:async';
import 'dart:convert';
import 'package:flutter/material.dart';
import 'package:schoolofparentingalfa/assets/color/color.dart';

class Home extends StatefulWidget {
  @override
  Home2 createState() => Home2();
}

class Home2 extends State<Home> {
  var colorsop = new Colorsop();
  var apiconfig = new ApiConfig();
  var apiClient = new ApiClient();

  @override
  void initState() {
    super.initState();
  }

  //To call list from api
  Future<List<Artikel>> getNews() async {
    // future is used to handle the error when calling api > Future + async or await
var data = await http.get(
    'https://newsapi.org/v2/top-headlines?country=us&category=business&apiKey=c4349a84570648eaa7be3cd673cc262b');

var jsonData = json.decode(data.body);

var newsData =
jsonData['articles']; //to retrieve data from articles array of api

List<Artikel> news = []; // create array

for (var data in newsData) {
  //assign data into News model array list from articles array of api
  Artikel newsItem = Artikel(
      data['title'], data['description'], data['urlToImage']);
  news.add(newsItem);
}
return news;
}




    @override
  Widget build(BuildContext context) {
    return Scaffold(

      body: Stack(children: <Widget>[
        Positioned(
          top: 0,
          child: Container(
              height: 100,
              width: MediaQuery.of(context).size.width,
              color: Colors.yellow[800],
              child: Align(
                  alignment: Alignment.center,
                  child: Text("Halo, Selamat Datang", style: TextStyle(color: Colors.white, fontSize: 25),))),
        ),

        Positioned(
            top: 90,
            bottom: 0,
            right: 0,
            left: 0,
            child: Container(
              width: MediaQuery.of(context).size.width,
              height: 600,
              decoration: BoxDecoration(
                  color: Colors.white,
                  ),
              child: GridView.count(
                crossAxisCount: 1,
                children: [
                  Container( // Container 1
                    child: Row(
                      children: <Widget>[
                        Image.asset(
                          'lib/assets/image/kelas_online.png',
                          height: 120,
                          width: 150,
                        ),
                        Image.asset(
                          'lib/assets/image/tanyaahli.png',
                          height: 120,
                          width: 150,
                        ),
                      ],
                    ),
                  ),
                  Container( // Container 2
                    child: Row(
                      children: <Widget>[
                        Image.asset(
                          'lib/assets/image/workshop_online.png',
                          height: 120,
                          width: 150,
                        ),
                        Image.asset(
                          'lib/assets/image/MitraSekolah.png',
                          height: 120,
                          width: 150,
                        ),
                      ],
                    ),
                  ),
                  Container( //Container 3
                    margin: EdgeInsets.only(top: 15, bottom: 30, left: 20),
                    padding: EdgeInsets.symmetric(horizontal: 15),
                    child: FutureBuilder(
                      future: getNews(),
                      builder: (BuildContext context, AsyncSnapshot snapshot) {
                        //snapshot is same with response
                        if (snapshot.data == null) {
                          return Container(
                            child: Center(
                              child: CircularProgressIndicator(),
                            ),
                          );
                        } else {
                          return ListView.builder(
                            itemCount: snapshot.data.length,
                            // to retrieve data as all array indexes
                            itemBuilder: (BuildContext context, int index) {
                              // is same with holder

                              return InkWell(
                                // Inkwell is used to apply card view
                                onTap: () {
                                  Artikel news = new Artikel(snapshot.data[index].post_link, snapshot.data[index].description, snapshot.data[index].post_image);//is used to onclick

                                  Navigator.push(
                                      context,
                                      MaterialPageRoute(
                                          builder: (context) => new Details(news: news)
                                      ));
                                },

                                child: Card(
                                  child: Row(
                                    children: <Widget>[
                                      Container(
                                        width: 120.0,
                                        height: 110.0,
                                        child: ClipRRect(
                                          //for corner radius
                                          borderRadius:
                                          BorderRadius.all(Radius.circular(8)),

                                          //to retrieve image from array
                                          child: snapshot.data[index].post_image == null
                                              ? Image.network(
                                              'https://cdn2.vectorstock.com/i/1000x1000/70/71/loading-icon-load-icon-wait-for-a-wait-please-wait-vector-24247071.jpg')
                                              : Image.network(
                                            snapshot.data[index].post_image,
                                            width: 100,
                                            fit: BoxFit.fill,
                                          ),
                                        ),
                                      ),
                                      Expanded(
                                        child: ListTile(
                                          //include title and subtitle
                                          title: Text(snapshot.data[index].post_title),
                                          subtitle: Text(snapshot.data[index].post_link == null
                                              ? 'Unknown Author'
                                              : snapshot.data[index].post_link),
                                        ),
                                      )
                                    ],
                                  ),
                                ),
                              );
                            },
                          );
                        }
                      },
                    ),
                  ),
                ],
              ),
            )
        )
      ],),

    );
  }
}


}

class Details extends StatelessWidget{
  final Artikel news;

  Details({this.news}); // create constructor
  @override
  Widget build(BuildContext context) {
return Scaffold(
  body: Center(
    child: Container(
      child: Column(
        children: <Widget>[

          Stack( //little same with expanded
            children: <Widget>[
              Container(
                height: 400,
                child: Image.network('${this.news.post_image}',
                  fit: BoxFit.fill,),
              ),
              AppBar(
                backgroundColor: Colors.transparent,
                leading: InkWell(
                  child: Icon(Icons.arrow_back_ios),
                  onTap: () => Navigator.pop(context),
                ),

                elevation: 0,

              )
            ],
          ),

          Padding(
            padding: const EdgeInsets.all(8),
            child: Column(
              children: <Widget>[

                SizedBox( // for title
                  height: 10,
                ),
                Text(
                  '${this.news.post_title}',
                  style: TextStyle(
                      color: Colors.black87,
                      fontWeight: FontWeight.bold,
                      fontSize: 20,
                      letterSpacing: 0.2,
                      wordSpacing: 0.6
                  ),
                ),

                SizedBox( // for description
                  height: 20,
                ),
                Text(
                  this.news.post_link,
                  style: TextStyle(
                      color: Colors.black54,
                      fontSize: 16,
                      letterSpacing: 0.2,
                      wordSpacing: 0.3
                  ),
                )

              ],
            ),
          )

        ],
      ),
    ),
  ),
);


 }
}

class Artikel {


final String post_title;
  final String post_link;
  final String post_image;

  //Alt+insert > constructor

  Artikel(this.post_title, this.post_link, this.post_image);
}

Can anyone help me?

Updated Screenshot.............................................................................

Answer 1

you can replace the code and check

 return Scaffold(

     body: Stack(children: <Widget>[
      Positioned(
        top: 0,
              child: Container(
                height: 100,
                width: MediaQuery.of(context).size.width,
                color: Colors.yellow[800],
                child: Align(
                  alignment: Alignment.center,
                  child: Text("Halo, Selamat Datang", style: TextStyle(color: Colors.white, fontSize: 25),))),
      ),

      Positioned(
        top: 90,
        bottom: 0,
        right: 0,
        left: 0,
              child: Container(
                width: MediaQuery.of(context).size.width,
               height: 600,
                decoration: BoxDecoration(
                  color: Colors.white,
                  borderRadius: BorderRadius.only(topLeft:Radius.circular(20), topRight:Radius.circular(20)) ),
                  child:
                  GridView.count(
      crossAxisCount: 2,
      children: List.generate(5, (index) {
      return  Padding(
        padding: const EdgeInsets.all(24.0),
        child: GridTile(child: Image.network("https://upload.wikimedia.org/wikipedia/commons/6/6d/Good_Food_Display_-_NCI_Visuals_Online.jpg"),),
      );
      }) ,),)
      )
     ],),
     
     );