【问题标题】:flutter listview bottom overflowedflutter listview底部溢出
【发布时间】:2020-03-12 01:05:59
【问题描述】:

我的颤振应用程序中有两个水平列表视图。当我放置第二个列表视图时出现错误。 我用nestedscrollview滚动页面,但这个问题没有解决。如何管理小部件的高度,使这个错误不会发生?我试图为第二个listview设置高度,但它仍然出错 看看我的代码:

  @override
  Widget build(BuildContext context) {
    return new MaterialApp(
        theme: ThemeData(
          fontFamily: "Vazir",
          primaryColor: Colors.red,
          accentColor: Colors.green,
        ),
        debugShowCheckedModeBanner: false,
        home: Directionality(
          textDirection: TextDirection.rtl,
          child: Scaffold(
              drawer: myDrawerLayout(context),
              body: NestedScrollView(
                headerSliverBuilder: (context, bool innerScroll) {
                  return <Widget>[
                    SliverAppBar(
                        title: Text(
                      "فروشگاه",
                      style: TextStyle(fontFamily: "Vazir"),
                    ))
                  ];
                },
                body: Column(
                  children: <Widget>[
                    _imageSlider(),
                    _explanationTextForAmazingProduct(),//text for listview explanation
                    _SizedBox(
                      height: 190,
                      child: ListView.builder(
                          scrollDirection: Axis.horizontal,
                          padding: EdgeInsets.all(8),
                          shrinkWrap: true,
                          itemCount: productList.length,
                          itemBuilder: (BuildContext context, int index) {
                            return productList.isEmpty || productList == null
                                ? wiatingView()
                                : Card(
                                    child: Container(
                                      width: 200,
                                      height: 70,
                                      child: Column(
                                        children: <Widget>[
                                          Padding(
                                            padding:
                                                const EdgeInsets.only(top: 8),
                                            child: Container(
                                              width: 80,
                                              height: 80,
                                              decoration: BoxDecoration(
                                                  image: DecorationImage(
                                                      image: NetworkImage(
                                                          productList[index]
                                                              .getImage()))),
                                            ),
                                          ),
                                          Padding(
                                            padding: const EdgeInsets.only(
                                                right: 8, left: 8, top: 8),
                                            child: Center(
                                              child: Text(productList[index]
                                                  .getTitle()),
                                            ),
                                          ),
                                          Center(
                                            child: Text(
                                              productList[index].getPrice(),
                                              style: TextStyle(
                                                  color: Colors.green),
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                  );
                          }),
                    ),
                    explanationTextForMostSellProduct(),//text for second listview explanation
                    Expanded(
                      child: ListView.builder(
                          scrollDirection: Axis.horizontal,
                          padding: EdgeInsets.all(8),
                          shrinkWrap: true,
                          itemCount: productList.length,
                          itemBuilder: (BuildContext context, int index) {
                            return productList.isEmpty || productList == null
                                ? wiatingView()
                                : Card(
                                    child: Container(
                                      width: 200,
                                      height: 150,
                                      child: Column(
                                        children: <Widget>[
                                          Padding(
                                            padding:
                                                const EdgeInsets.only(top: 8),
                                            child: Container(
                                              width: 80,
                                              height: 80,
                                              decoration: BoxDecoration(
                                                  image: DecorationImage(
                                                      image: NetworkImage(
                                                          productList[index]
                                                              .getImage()))),
                                            ),
                                          ),
                                          Padding(
                                            padding: const EdgeInsets.only(
                                                right: 8, left: 8, top: 8),
                                            child: Center(
                                              child: Text(productList[index]
                                                  .getTitle()),
                                            ),
                                          ),
                                          Center(
                                            child: Text(
                                              productList[index].getPrice(),
                                              style: TextStyle(
                                                  color: Colors.green),
                                            ),
                                          ),
                                        ],
                                      ),
                                    ),
                                  );
                          }),
                    )
                  ],
                ),
              )),
        ));
  }

【问题讨论】:

    标签: listview flutter widget height


    【解决方案1】:

    你应该用 height:190 覆盖你的第二个 ListView.builder SizedBox,而不是像第一个 ListView.builder 那样展开,因为 ListView.builder 小部件的高度是无限的,所以你应该覆盖它特定的高度。

    示例:

     SizedBox(
      height: 190,
      child: ListView.builder(....
    

    【讨论】:

    • 我先测试一下你的代码,然后你才能检查它链接prntscr.com/pxkrkf 它会无穷大,在prntscr.com/pxksdk 之后就可以了,也许你应该重新调试应用程序,有时热加载不能正常工作跨度>
    • 我将列小部件放在 SingleChildScrollView 中,它解决了,谢谢
    • 是的,它可以解决我很高兴解决问题。不客气
    猜你喜欢
    • 2019-05-27
    • 2022-07-19
    • 2020-09-08
    • 2019-03-12
    • 2019-01-30
    • 2019-06-06
    • 1970-01-01
    • 2019-12-25
    • 2021-04-07
    相关资源
    最近更新 更多