首页 > 解决方案 > 如何在flutter中显示填充下的数据?

问题描述

    Map item;
      List data;

      Future getdata() async{
        http.Response response= await http.get(Uri.encodeFull("https://talaikis.com/api/quotes/"));
        item=json.decode(response.body);
        setState(() {
          data=item["quotes"];
        });
        debugPrint(data.toString());
      }

我想在有状态的小部件中显示这个请求,就像这样

    @override
      Widget build(BuildContext context) {
        return new Scaffold(
          drawer: drawerLeft(),
          appBar: AppBar(
              title: Text(
                "IN TIME",
                style: TextStyle(color: Colors.black, fontWeight: FontWeight.w700),
              ),
              backgroundColor: clr,
              elevation: 0.0,
              leading: MaterialButton(
                child: Icon(
                  Icons.view_headline,
                  color: Colors.black,
                ),
                onPressed: () {
                  scaffoldKey.currentState.openDrawer();
                },
              )),
          key: scaffoldKey,
          body: AnimatedContainer(
            padding: EdgeInsets.only(top: 50.0),
            duration: Duration(milliseconds: 1000),
            curve: Curves.ease,
            color: clr,
            child: PageView.builder(
              itemCount: 7, //7days
              onPageChanged: (int page) {
                this.setState(() {
                  Random rnd;
                  rnd = new Random();
                  int r = 0 + rnd.nextInt(_colors.length - 0);
                  clr = _colors[r];

                });
              },
              controller: pageViewController,
              itemBuilder: (BuildContext context, int index) {
                return Padding(
                  padding: const EdgeInsets.only(left: 10.0),
                  child: Stack(
                    children: <Widget>[
                      Container(
                        decoration: new BoxDecoration(
                          borderRadius: BorderRadius.circular(20.0),
                          color: Colors.white,
                        ),
                        height:
                            MediaQuery.of(scaffoldKey.currentContext).size.height -
                                150.0,
                        width:
                            MediaQuery.of(scaffoldKey.currentContext).size.width -
                                20.0,
                        child: Stack(
                          children: <Widget>[
                            Positioned(
                              width: MediaQuery.of(scaffoldKey.currentContext)
                                      .size
                                      .width -
                                  100.0,
                              left: index != currentPage
                                  ? getMappedValue(20.0, 100.0, 160.0, 20.0, pos)
                                  : getMappedValue(20.0, 100.0, 20.0, -120.0, pos),
                              top: 20.0,
                              child: Opacity(
                                opacity: index != currentPage
                                    ? getMappedValue(20.0, 100.0, 0.0, 01.0, pos)
                                    : getMappedValue(20.0, 100.0, 01.0, 00.0, pos),
                                child: Column(
                                  children: <Widget>[
                                    Row(
                                      mainAxisAlignment:
                                          MainAxisAlignment.spaceBetween,
                                      children: <Widget>[
                                        Text(
                                          _days[index],
                                          maxLines: 1,
                                          softWrap: true,
                                          style: TextStyle(
                                              color: Colors.deepOrange,
                                              fontSize: 22.0,
                                              fontWeight: FontWeight.w600),
                                        ),
                                      ],
                                    ),
                                    Padding(
                                      padding: const EdgeInsets.only(top: 15.0),
                                      child: Text(
                                        'Quote for the day',
                                        softWrap: true,
                                        style: TextStyle(
                                            fontSize: 30.0,
                                            fontWeight: FontWeight.w300),
                                      ),
                                    ),

                                  ],
                                ),
                              ),
                            ),
                          ],
                        ),
                      ),
                    ],
                  ),
                );
              },
            ),
          ),
        );
      }
    }

*请帮帮我*

标签: dartflutter

解决方案


如果我理解,您想在一些正在检索到您的填充下显示引号List,我将假设它是 inferenced List<String>。如果是这样,您可以ListView在小部件树中使用 a 来显示该列表中每个获取的项目,如下所示:

  (...)
   data != null
      ? Padding(
          padding: const EdgeInsets.only(top: 15.0),
          child: ListView.builder(
            itemCount: data.length,
            itemBuilder: (BuildContext context, int index) {
              return ListTile(
                title: Text(data[index]),
              );
            },
          ),
        )
      : Container(),
  (...)

推荐阅读