ListView.builder不构建项目(不显示任何内容)

时间:2018-08-26 16:09:08

标签: dart flutter

当我在Flutter中不使用ListView.builder构造函数时,单个项目将按预期从JSON API中显示:

另一方面,当我使用ListView.builder时,什么也没有显示。

代码如下:

 import 'dart:ui';
import 'dart:async';
import 'dart:convert';
import 'package:http/http.dart'as http;

import "package:flutter/material.dart";
import 'package:flutter/painting.dart';
Map responsee={};
bool _loading = false;




class tag extends StatefulWidget{

  Map data={};
  tag(this.data);
  @override
  State<StatefulWidget> createState() {
    return tagstate(data);
  }

}

class tagstate extends State<tag>{
  List influ=[{"username":"tarun"}];

  Map data={};
  tagstate(this.data);

  Future<Null> load()async {

    responsee = await getJson1(data["tag"]);
    setState(() {
      _loading = true;
      influ=responsee["influencers"];
      new Future.delayed(new Duration(seconds: 5), _login);


    });
    print('length: ${influ}');

  }
  Future _login() async{
    setState((){
      _loading = false;
    });
  }

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

  }




  @override
   build(BuildContext context) {

    var bodyProgress = new Container(
      child: new Stack(
        children: <Widget>[

          new Container(
            alignment: AlignmentDirectional.center,
            decoration: new BoxDecoration(
              color: Colors.white70,
            ),
            child: new Container(
              decoration: new BoxDecoration(
                  color: Colors.blue[200],
                  borderRadius: new BorderRadius.circular(10.0)
              ),
              width: 300.0,
              height: 200.0,
              alignment: AlignmentDirectional.center,
              child: new Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  new Center(
                    child: new SizedBox(
                      height: 50.0,
                      width: 50.0,
                      child: new CircularProgressIndicator(
                        value: null,
                        strokeWidth: 7.0,
                      ),
                    ),
                  ),
                  new Container(
                    margin: const EdgeInsets.only(top: 25.0),
                    child: new Center(
                      child: new Text(
                        "loading.. wait...",
                        style: new TextStyle(
                            color: Colors.white
                        ),
                      ),
                    ),
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );


    return Scaffold(
      appBar: new AppBar(iconTheme: IconThemeData(color: Colors.black),backgroundColor: Colors.white,
        title: Text("Stats",style: TextStyle(color: Colors.black,fontWeight: FontWeight.w600),),
      ),
      body:  _loading ? bodyProgress : new Column(children: <Widget>[
        Flexible(child: ListView.builder(padding: const EdgeInsets.all(14.5),itemCount: influ.length,itemBuilder: (BuildContext context,int pos){
          new ListTile(
            title: Text(influ[pos]["username"],style: new TextStyle(fontSize: 17.9),),


            leading: CircleAvatar(
              backgroundColor: Colors.pink,
              child: Image.network("${influ[pos]["photo"]}"),

            ),

          );
        }),)],),


    );

  }
}
Future<Map> getJson1(String data) async{
  String apiUrl="https://api.ritekit.com/v1/influencers/hashtag/$data?client_id=a59c9bebeb5253f830e09bd9edd102033c8fe014b976";
  http.Response response = await http.get(apiUrl);
  return json.decode(response.body);

}

无论我尝试多少,错误仍然存​​在。

脚手架已加载,但ListView.builder未加载。

当我不使用ListView.builder时,将按预期显示JSON API中的单个项目。

4 个答案:

答案 0 :(得分:2)

谢谢大家... 我实际上忘了在Itembuiler函数中返回Listtile。

再次感谢

答案 1 :(得分:0)

Future<Null> load()async {
  responsee = await getJson1(data["tag"]);
  influ=responsee["influencers"];
}

应该是

Future<Null> load()async {
  responsee = await getJson1(data["tag"]);
  setState(() => influ=responsee["influencers"]);
}

await getJson1(data["tag"]);是异步的,需要在响应到达时通知Flutter重新构建。

答案 2 :(得分:0)

List influ = []移到tagState类中,并按上述答案使用setState。现在一切都应该正常工作。

请参阅thisinflu最初是全局变量,因此setState也不起作用。如果我们希望我们的Stateful widget根据某个值反应,则应为其instance变量,而不是本地变量,而不是全局变量变量。

答案 3 :(得分:0)

由于load()是异步的,因此不确定“ tagstate.build()”的作用是什么。我的建议是在父窗口小部件中进行加载,然后在完成加载后将influ传递给标签窗口小部件。例如

onPress(() {
  final influ = (await getJson1(data["tag"]))['influencers'];
  Navigator.of(context).push(
    (new MaterialPageRoute(builder: (context) {
      return tag(influ: influe);
    }));
}