Nothing is printed from ListView.Builder into the emulator while initState shows that My list has 2 elements

Question

import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:flutter/material.dart';

void main() {
  runApp(MyHomePage());
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<String> ListSearch = [];
  Future getData() async {
    var data = await http.get('http://10.0.2.2/DBCON/search.php');
    var databody = jsonDecode(data.body);
    for (int i = 0; i < databody.length; i++) {
      ListSearch.add(databody[i]['NAME']);
    }
    print(ListSearch);
  }

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: Text('ss'),
        ),
        body: ListView.builder(
          itemCount: ListSearch.length,
          itemBuilder: (context, index) {
            return Column(
              children: [
                Text(ListSearch[index]),
                Text(ListSearch.length.toString()),
              ],
            );
          },
        ),
      ),
    );
  }
}

I am trying to bring some data from localhost and show them in my app in the emulator, but the emulator shows nothing and initState gives an output of 2 elements in ListSearch List, Can someone tell me why nothing is printed and how to fix that?

This is the output in the emulator

and this is the output in the initState in debug console

Answer 1

You can copy paste run full code below
Demo code has 3 seconds delay to simulate network delay
You can use bool isLoading to control when isLoading show CircularProgressIndicator(), when loading finish show ListView
code snippet

bool isLoading = true;
Future getData() async {
    ...
    print(ListSearch);

    setState(() {
      isLoading = false;
    });
...
body: isLoading
            ? Center(child: CircularProgressIndicator())
            : ListView.builder(

working demo

full code

import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:flutter/material.dart';

void main() {
  runApp(MyHomePage());
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List<String> ListSearch = [];
  bool isLoading = true;
  Future getData() async {
    //var data = await http.get('http://10.0.2.2/DBCON/search.php');
    await Future.delayed(Duration(seconds: 3), () {});
    String jsonString = '''
    [
      {"NAME": "Samsung A30"},
      {"NAME": "Samsung Note20"}
    ]
    ''';

    http.Response data = http.Response(jsonString, 200);
    var databody = jsonDecode(data.body);
    for (int i = 0; i < databody.length; i++) {
      ListSearch.add(databody[i]['NAME']);
    }
    print(ListSearch);

    setState(() {
      isLoading = false;
    });
  }

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

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        appBar: AppBar(
          title: Text('ss'),
        ),
        body: isLoading
            ? Center(child: CircularProgressIndicator())
            : ListView.builder(
                itemCount: ListSearch.length,
                itemBuilder: (context, index) {
                  return Column(
                    children: [
                      Text(ListSearch[index]),
                      Text(ListSearch.length.toString()),
                    ],
                  );
                },
              ),
      ),
    );
  }
}