title: Lazy loading json list view flutter
body: <p>I am trying to implement a lazy loading for a <code>list</code> that I am fetching from api. I have implemented a listener for my <code>ListView</code> to check when it reaches the bottom. The issue I have here is:</p>
  
  <p>1) How do I set an initial number of loaded items for my list?</p>
  
  <p>2) How do I automatically add items to the list while calling my loadMore() method?</p>
  
  <pre><code>class _HomeServiceState extends State&lt;HomePage&gt;
      with AutomaticKeepAliveClientMixin {
     List&lt;Mentor&gt; filteredData;
  
    List&lt;Mentor&gt; users = [];
   @override
    void initState() {
      // TODO: implement initState
      super.initState();
      _scrollcontroller.addListener(() {
        if (_scrollcontroller.position.atEdge) {
          if (_scrollcontroller.position.pixels == 0){
        // you are at top position
  
          } else{
        // you are at bottom position
            loadMore();
          }
      }
      });
    }
  
    @override
    Widget build(BuildContext context) {
      final mentors = new FutureBuilder(
        future: _future,
        builder: (BuildContext context, AsyncSnapshot snapshot) {
            return  ListView.builder(
                shrinkWrap: true,
                physics: ScrollPhysics(),
                itemCount: filteredData.length + 1,
                itemBuilder: (BuildContext context, int index) {
                  if (index == filteredData.length) {
                    return CupertinoActivityIndicator();
                  }
                  return ListTile(
                    leading: CircleAvatar(
                      maxRadius: 23,
                      backgroundImage: NetworkImage(NetworkUtils.host +
                          AuthUtils.profilePics +
                          filteredData[index].profile_image),
                    ),
                    title: Text(
                        filteredData[index].first_name +
                            " " +
                            filteredData[index].last_name,
                        style: TextStyle(
                          color: Color(0xFF041F36),
                          fontFamily: 'Muli',
                          fontSize: 16.0,
                        )),
                    subtitle: Text(capitalize(filteredData[index].industry),
                        style: TextStyle(
                          color: Color(0xFF25282A),
                          fontFamily: 'MuliLight',
                          fontSize: 12.0,
                        )),
                    trailing: Text(capitalize(filteredData[index].country),
                        style: TextStyle(
                          color: Color(0xFF25282A),
                          fontFamily: 'MuliItalic',
                          fontSize: 12.0,
                        )),
                    onTap: () {
                      Navigator.push(
                          context,
                          SlideFromRightPageRoute(
                              widget: MenteeDetailPage(filteredData[index])));
                    },
                  );
                },
              );
          }
        },
      );
  
    Future&lt;List&lt;Mentor&gt;&gt; _getUsers() async {
      sharedPreferences = await SharedPreferences.getInstance();
      var data = await http.get(
        NetworkUtils.host + AuthUtils.endPointMentors,
        headers: {
          'Authorization': "Bearer " + sharedPreferences.getString("token"),
          'Accept': 'application/json'
        },
      );
      var jsonData = json.decode(data.body);
      for (var u in jsonData["data"]) {
        Mentor user = Mentor(
          u["id"]!=null ? u["id"]: "",
          u["category"]!=null ? u["category"] : "",
          u["email"]!=null ? u["email"]: "",
          u["email_verified_at"] !=null ? u["email_verified_at"]: "",
          u["first_name"] !=null ? u["first_name"]: "",
          u["last_name"] != null ?u["last_name"]: "",
          u["other_name"] !=null ? u["other_name"]: "",
          u["country"] !=null ? u["country"]: "",
          u["industry"] !=null ? u["industry"]: "",
          u["gender"] !=null ? u["gender"]: "",
          u["bio_interest"] !=null ? u["bio_interest"]: "",
          u["phone"] !=null ?u["phone"]: "",
          u["state_of_origin"] !=null ? u["state_of_origin"]: "",
          u["fav_quote"] != null ? u["fav_quote"]: "",
          u["profile_image"] != null ? u["profile_image"] : "",
          u["terms"] !=null ? u["terms"]: "",
          u["check_status"] !=null ? u["check_status"]: "",
          u["current_job"] != null ? u["current_job"]: "",
          u["created_at"] !=null ? u["created_at"]: "",
          u["updated_at"]!=null ? u["updated_at"]: "",
          u["social_id"] !=null ? u["social_id"]: "",
          getFromList(u["employment"], 'company'),
          getFromList(u['employment'], 'position'),
          getFromList(u['education'], 'institution'),
          getFromList(u['education'], 'degree'),);
  
        users.add(user);
      }
      filteredData = users;
      return filteredData;
    }
    String getFromList(Map&lt;String, dynamic&gt; json, String key) {
      return json != null ? json[key] : "";
    }
    @override
    void dispose() {
      _scrollcontroller.dispose();
      super.dispose();
    }
  
    @override
    // TODO: implement wantKeepAlive
    bool get wantKeepAlive =&gt; true;
  
    loadMore() {
      print("edkwj");
    }
  }
  </code></pre>