GridView在SingleChildScrollView内部溢出

问题描述 投票:0回答:1

[当我尝试将GridView放到Column的子项SingleScrollChildView内时,底部溢出了几千个像素。 shrinkWrap中的GridView设置为true。 scrollphysics也设置为NeverScrollableScrollPhysics()。我竭尽全力试图使此GridViewSingleChildScrollView一起滚动。这是我的Widget build(BuildContext context)代码。任何帮助,将不胜感激。

return WillPopScope(
        child: Column(
          children: <Widget>[
            // the fixed container
            SizedBox(
              height: 80,
              width: double.infinity,
              child: Container(
                decoration: BoxDecoration(
                  color: Colors.blue.shade800,
                ),
              ),
            ),

            //Scrolling Section of the Page
            SingleChildScrollView(
              scrollDirection: Axis.vertical,
              child: Column( // Column to hold all the vertical elements including the gridview
                mainAxisAlignment: MainAxisAlignment.start,
                crossAxisAlignment: CrossAxisAlignment.center,
                children: <Widget>[
                  // Carousal slider in a sized box of height 250
                  SizedBox(
                    height: 250,
                    width: double.maxFinite,
                    child: _adSlider(),
                  ),

                  // A Text Container
                  Container(
                    padding: EdgeInsets.symmetric(vertical: 15),
                    child: Text("GridView Heading"),
                  ),

                  // gridview starts here

                  GridView.count(
                    shrinkWrap: true,
                    addAutomaticKeepAlives: true,
                    physics: NeverScrollableScrollPhysics(),
                    scrollDirection: Axis.vertical,
                    crossAxisCount: 2,
                    children: List.generate(20, (index) {
                      return productCard(index);
                    }),
                  )
                ],
              ),
            ),
          ],
        ),
        onWillPop: () async => true);

在我添加GridView之前,一切都很好。

编辑:在SizedBox处添加长的GridView也会引发溢出错误。

这是错误

RenderFlex在底部溢出603像素。

 The relevant error-causing widget was
    Column 
lib\…\home\ui_home.dart:24
The overflowing RenderFlex has an orientation of Axis.vertical.
The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and black striped pattern. This is usually caused by the contents being too big for the RenderFlex.
flutter flutter-layout
1个回答
0
投票

用扩展的小部件包装Gridview

我的工作方式:

                return Center(
                  child: Container(
                    child: Column(
                      children: [
                        Expanded(
                          child: GridView.count(
                            crossAxisCount: 2,
                            childAspectRatio: 1.0,
                            mainAxisSpacing: 4.0,
                            crossAxisSpacing: 4.0,
                            children: snapshot.data.documents
                                .map((doc) => _myGridTile(doc))
                                .toList(),
                          ),
                        ),
                      ],
                    ),
                  ),
                );

忽略来自Firestore的snapshot.data,可以将列表放在此处

© www.soinside.com 2019 - 2024. All rights reserved.