如何更新 Flutter 中的 ListView

Question

I am a beginner in flutter , and I want to update my listview when i load all files in mandarin directory. I am sure i have got all files and added them to tests , but i have no ideas what's wrong with my code, why listview doesn't display anything. Any ideas?

 class _TeachersState extends State<TeachersList> {
      final _biggerFont = const TextStyle(fontSize: 18.0);
      List tests = List();

      Widget _buildSuggestions(BuildContext context) {
        initTests();
        return ListView.builder(
            itemCount: tests.length,
            padding: const EdgeInsets.all(16.0),
            itemBuilder: (context, i) {
              if (i.isOdd) return Divider();

              return _buildRow(tests[i]);
            });
      }

      void gotoTest(String title) {
        Navigator.push(
            context, MaterialPageRoute(builder: (context) => TestList(title)));
      }

      Widget _buildRow(String pair) {
        return ListTile(
          onTap: () => gotoTest(pair),
          title: Text(
            pair,
            style: _biggerFont,
          ),
        );
      }

      void initTests() async {
        List t = List();
        String baseDir = await ExtStorage.getExternalStorageDirectory();
        String waDir = "$baseDir/mandarin";
        Directory dir = new Directory(waDir);
        dir.list().forEach((element) {
          t.add(element.path);
        });
        setState(() {
          tests.addAll(t);
        });
      }

      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(title: Text("请选择老师")),
          body: _buildSuggestions(context),
        );
      }
    }

Answer 1

Have you tried using the FutureBuilder widget?

Check the code below:

Pass a snapshot to your buildSuggestion method

      Widget _buildSuggestions(BuildContext context, AsyncSnapShot snapshot) {
        initTests();
        return ListView.builder(
            itemCount: snapshot.data.length,
            padding: const EdgeInsets.all(16.0),
            itemBuilder: (context, i) {
              if (i.isOdd) return Divider();

              return _buildRow(snapshot.data[i]);
            });
      }

Change the function return type

 Future initTests() async {
        List t = List();
        String baseDir = await ExtStorage.getExternalStorageDirectory();
        String waDir = "$baseDir/mandarin";
        Directory dir = new Directory(waDir);
        dir.list().forEach((element) {
          t.add(element.path);
        });
        setState(() {
          tests.addAll(t);
        });
        return tests;
      }

Use a future builder widget in your body:

     @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(title: Text("请选择老师")),
          body: FutureBuilder(
            future: initTests(),
            builder: (context, snapshot){
              if (snapshot.hasData){
                return _buildSuggestions(context, snapshot);
              } else {
                return CircularProgressIndicator();
              }
            },
          );
        );
      }

It will show a Circle Progress Indicator until all the files have been read and then display them when done.