gridview.count 不会滚动抖动

Question

在我的应用程序中，我将 gridview.count 放在列小部件中，但 gridview.count 不会滚动并在底部溢出，因此请给出一些建议

\n

这是我的代码

\n

 @override\n Widget build(BuildContext context) {\n return Stack(\n  children: <Widget>[\n    Image.asset(\n      "images/background.png",\n      height: MediaQuery.of(context).size.height,\n      width: MediaQuery.of(context).size.width,\n      fit: BoxFit.fill,\n    ),\n    Scaffold(\n      backgroundColor: Color(0x00000000),\n      body: Center(\n          child: Column(\n            mainAxisAlignment: MainAxisAlignment.start,\n            crossAxisAlignment: CrossAxisAlignment.center,\n            children: <Widget>[\n              Container(\n                child: Padding(\n                  padding: EdgeInsets.only(top: 50,bottom: 10),\n                  child: Row(\n                    children: <Widget>[\n                      Spacer(flex: 2),\n                      Text(\n                        \'Interests\',\n                        textAlign: TextAlign.center,\n                        overflow: TextOverflow.ellipsis,\n                        maxLines: 1,\n                        style: TextStyle(\n                          color: Color(0xFF0066CB),\n                          fontSize: 20.0,\n                        ),\n                      ),\n                      Spacer(),\n                      Expanded(\n                        child:SvgPicture.asset(\n                          "images/vector.svg",\n                          height: 30.0,\n                          width: 30.0,\n                        ),\n                      )\n                    ],\n                  ),\n                ),\n              ),\n              Padding(\n                padding: EdgeInsets.only(top: 10,bottom: 90,left: 10,right: 10),\n                child: GridView.count(\n                     scrollDirection: Axis.vertical,\n                     crossAxisCount: 3,\n                     crossAxisSpacing: 5.0,\n                     mainAxisSpacing: 5.0,\n                     shrinkWrap: true,\n                     children: List.generate(20, (index) {\n                       return Padding(\n                         padding: EdgeInsets.all(5.0),\n                         child: Container(\n                           child: SvgPicture.asset(\n                             "images/register_top_logo_new.svg",\n                           ),\n                           padding: EdgeInsets.all(20.0),\n                           height: 135.0,\n                           width: 135.0,\n                           decoration: BoxDecoration(\n                             border: Border.all(\n                               width: 1.0,\n                               color: Color(0xFFF9AD16),\n                             ),\n                           ),\n                         ),\n                       );\n                     },\n                     ),\n                   ),\n              ),\n            ],\n          ),\n       ),\n     ),\n    ],\n   );\n }\n

\n

这是我运行应用程序时得到的日志

\n

I/flutter (16748): The relevant error-causing widget was:\nI/flutter (16748):   Column\nI/flutter (16748):   file:///C:/Users/mayur/AndroidStudioProjects/flutter/webinar-mobile/lib/activities/interests_activity.dart:30:22\nI/flutter (16748): \nI/flutter (16748): The overflowing RenderFlex has an orientation of Axis.vertical.\nI/flutter (16748): The edge of the RenderFlex that is overflowing has been marked in the rendering with a yellow and\nI/flutter (16748): black striped pattern. This is usually caused by the contents being too big for the RenderFlex.\nI/flutter (16748): Consider applying a flex factor (e.g. using an Expanded widget) to force the children of the\nI/flutter (16748): RenderFlex to fit within the available space instead of being sized to their natural size.\nI/flutter (16748): This is considered an error condition because it indicates that there is content that cannot be\nI/flutter (16748): seen. If the content is legitimately bigger than the available space, consider clipping it with a\nI/flutter (16748): ClipRect widget before putting it in the flex, or using a scrollable container rather than a Flex,\nI/flutter (16748): like a ListView.\nI/flutter (16748): The specific RenderFlex in question is: RenderFlex#42dda relayoutBoundary=up5 OVERFLOWING:\nI/flutter (16748):   needs compositing\nI/flutter (16748):   creator: Column \xe2\x86\x90 Center \xe2\x86\x90 _BodyBuilder \xe2\x86\x90 MediaQuery \xe2\x86\x90 LayoutId-[<_ScaffoldSlot.body>] \xe2\x86\x90\nI/flutter (16748):     CustomMultiChildLayout \xe2\x86\x90 AnimatedBuilder \xe2\x86\x90 DefaultTextStyle \xe2\x86\x90 AnimatedDefaultTextStyle \xe2\x86\x90\nI/flutter (16748):     _InkFeatures-[GlobalKey#417d7 ink renderer] \xe2\x86\x90 NotificationListener<LayoutChangedNotification> \xe2\x86\x90\nI/flutter (16748):     PhysicalModel \xe2\x86\x90 \xe2\x8b\xaf\nI/flutter (16748):   parentData: offset=Offset(0.0, 0.0) (can use size)\nI/flutter (16748):   constraints: BoxConstraints(0.0<=w<=360.0, 0.0<=h<=640.0)\nI/flutter (16748):   size: Size(360.0, 640.0)\nI/flutter (16748):   direction: vertical\nI/flutter (16748):   mainAxisAlignment: start\nI/flutter (16748):   mainAxisSize: max\nI/flutter (16748):   crossAxisAlignment: center\nI/flutter (16748):   verticalDirection: down\nI/flutter (16748): \xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\xe2\x97\xa2\xe2\x97\xa4\nI/flutter (16748): \xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\xe2\x95\x90\nI/flutter (16748): unhandled element metadata; Picture key: AssetBundlePictureKey(bundle: PlatformAssetBundle#bcd18(), name: "images/register_top_logo_new.svg", colorFilter: null)\n

\n

\n

所以这里 gridview.count 不滚动，我尝试使用 gridview.builder 但它给出了相同的错误，所以告诉我我在哪里犯了错误。

\n

Answer 1

只需像这样使用扩展小部件包装网格视图

Expanded(
   child: Padding(
                padding: EdgeInsets.only(top: 10,bottom: 90,left: 10,right: 10),
                child: GridView.count(
                     scrollDirection: Axis.vertical,
                     crossAxisCount: 3,
                     crossAxisSpacing: 5.0,
                     mainAxisSpacing: 5.0,
                     shrinkWrap: true,
                     children: List.generate(20, (index) {
                       return Padding(
                         padding: EdgeInsets.all(5.0),
                         child: Container(
                           child: SvgPicture.asset(
                             "images/register_top_logo_new.svg",
                           ),
                           padding: EdgeInsets.all(20.0),
                           height: 135.0,
                           width: 135.0,
                           decoration: BoxDecoration(
                             border: Border.all(
                               width: 1.0,
                               color: Color(0xFFF9AD16),
                             ),
                           ),
                         ),
                       );
                     },
                     ),
                   ),
              ),
)