Flutter 无法在gridview中使用listview在页面上滚动

我正在尝试开发一个仪表板页面，一行有4个GridView，另一行有2个GridView（下图）。我正在尝试使页面可滚动，并使其看起来如下图所示：

我开发了颤振布局，代码如下：

import 'package:flutter/material.dart';
import 'package:syncfusion_flutter_charts/charts.dart';
import 'package:font_awesome_flutter/font_awesome_flutter.dart';

class Reporting extends StatefulWidget {
  @override
  _Reporting createState() => _Reporting();
}

class _Reporting extends State<Reporting> {
  SfCartesianChart _getAnimationLineChart() {
    return SfCartesianChart(
      plotAreaBorderWidth: 0,
      primaryXAxis: NumericAxis(majorGridLines: MajorGridLines(width: 0)),
      primaryYAxis: NumericAxis(
          majorTickLines: MajorTickLines(color: Colors.transparent),
          axisLine: AxisLine(width: 0),
          minimum: 0,
          maximum: 100),
    );
  }

  @override
  Widget build(BuildContext context) {
    ;

    return Scaffold(
      body: Container(
        height: MediaQuery.of(context).size.height,
        width: MediaQuery.of(context).size.width,
        decoration: BoxDecoration(
          color: Colors.grey.shade100,
        ),
        child: Container(

          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: <Widget>[
              CustomAppBar(),
              Expanded(

                child: Column(
                  children: <Widget>[
                    ListView(
                      primary: false,
                      scrollDirection: Axis.vertical,
                      shrinkWrap: true,
                      children: <Widget>[
                        GridView(
                          scrollDirection: Axis.vertical,
                          shrinkWrap: true,
                          gridDelegate:
                              SliverGridDelegateWithFixedCrossAxisCount(
                                  childAspectRatio: 6 / 3.5,
                                  crossAxisCount: MediaQuery.of(context)
                                              .size
                                              .width >=
                                          1300
                                      ? 4
                                      : MediaQuery.of(context).size.width >= 700
                                          ? 2
                                          : 1),
                          children: [
                            Card(
                              margin: EdgeInsets.all(20.0),
                              //margin: EdgeInsets.fromLTRB(80, 60, 80, 60),
                              elevation: 3.0,
                              color: Colors.white,
                              child: Padding(
                                padding: const EdgeInsets.fromLTRB(30, 0, 0, 0),
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text(
                                      "Number Of Bugs",
                                      style: TextStyle(
                                          color: Colors.black, fontSize: 30.0),
                                    ),
                                    Text(
                                      "Critical, High, Info",
                                      style: TextStyle(
                                          color: Colors.green[900],
                                          fontSize: 20.0),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                            Card(
                              margin: EdgeInsets.all(20.0),
                              elevation: 3.0,
                              color: Colors.white,
                              child: Padding(
                                padding: const EdgeInsets.fromLTRB(30, 0, 0, 0),
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text(
                                      "Tile 2",
                                      style: TextStyle(
                                          color: Colors.blue[900],
                                          fontSize: 30.0),
                                    ),
                                    Text(
                                      "Tile 2",
                                      style: TextStyle(
                                          color: Colors.blue[900],
                                          fontSize: 20.0),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                            Card(
                              margin: EdgeInsets.all(20.0),
                              elevation: 3.0,
                              color: Colors.white,
                              child: Padding(
                                padding: const EdgeInsets.fromLTRB(30, 0, 0, 0),
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text(
                                      "Tile 3",
                                      style: TextStyle(
                                          color: Colors.deepOrange[900],
                                          fontSize: 30.0),
                                    ),
                                    Text(
                                      "Tile 3",
                                      style: TextStyle(
                                          color: Colors.deepOrange[900],
                                          fontSize: 20.0),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                            Card(
                              margin: EdgeInsets.all(20.0),
                              elevation: 3.0,
                              color: Colors.white,
                              child: Padding(
                                padding: const EdgeInsets.fromLTRB(30, 0, 0, 0),
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    Text(
                                      "Tile 3",
                                      style: TextStyle(
                                          color: Colors.deepOrange[900],
                                          fontSize: 30.0),
                                    ),
                                    Text(
                                      "Tile 3",
                                      style: TextStyle(
                                          color: Colors.deepOrange[900],
                                          fontSize: 20.0),
                                    ),
                                  ],
                                ),
                              ),
                            ),
                          ],
                        ),
                        GridView(
                            shrinkWrap: true,
                            padding: EdgeInsets.only(
                                //top: 20.0,
                                left: 90.0,
                                right: 100.0),
                            gridDelegate:
                                SliverGridDelegateWithFixedCrossAxisCount(
                                    childAspectRatio: 3 / 2,
                                    crossAxisCount: MediaQuery.of(context)
                                                .size
                                                .width >=
                                            1300
                                        ? 2
                                        : MediaQuery.of(context).size.width >=
                                                700
                                            ? 2
                                            : 1),
                            children: <Widget>[
                              Card(
                                //margin: EdgeInsets.all(20.0),
                                //margin: EdgeInsets.fromLTRB(80, 60, 80, 60),
                                elevation: 3.0,
                                color: Colors.white,
                                child: Column(
                                  mainAxisAlignment: MainAxisAlignment.center,
                                  crossAxisAlignment: CrossAxisAlignment.start,
                                  children: [
                                    //mychart2Items("Conversion","0.9M","+19% of target"),
                                    _getAnimationLineChart(),
                                  ],
                                ),
                              ),
                              Card(
                                //margin: EdgeInsets.all(20.0),
                                elevation: 3.0,
                                color: Colors.white,
                                child: Padding(
                                  padding:
                                      const EdgeInsets.fromLTRB(30, 0, 0, 0),
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Text(
                                        "Tile 2",
                                        style: TextStyle(
                                            color: Colors.blue[900],
                                            fontSize: 30.0),
                                      ),
                                      Text(
                                        "Tile 2",
                                        style: TextStyle(
                                            color: Colors.blue[900],
                                            fontSize: 20.0),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                              Card(
                                margin: EdgeInsets.all(20.0),
                                elevation: 3.0,
                                color: Colors.white,
                                child: Padding(
                                  padding:
                                      const EdgeInsets.fromLTRB(30, 0, 0, 0),
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Text(
                                        "Tile 3",
                                        style: TextStyle(
                                            color: Colors.deepOrange[900],
                                            fontSize: 30.0),
                                      ),
                                      Text(
                                        "Tile 3",
                                        style: TextStyle(
                                            color: Colors.deepOrange[900],
                                            fontSize: 20.0),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                              Card(
                                margin: EdgeInsets.all(20.0),
                                elevation: 3.0,
                                color: Colors.white,
                                child: Padding(
                                  padding:
                                      const EdgeInsets.fromLTRB(10, 0, 0, 0),
                                  child: Column(
                                    mainAxisAlignment: MainAxisAlignment.center,
                                    crossAxisAlignment:
                                        CrossAxisAlignment.start,
                                    children: [
                                      Text(
                                        "Tile 3",
                                        style: TextStyle(
                                            color: Colors.deepOrange[900],
                                            fontSize: 30.0),
                                      ),
                                      Text(
                                        "Tile 3",
                                        style: TextStyle(
                                            color: Colors.deepOrange[900],
                                            fontSize: 20.0),
                                      ),
                                    ],
                                  ),
                                ),
                              ),
                            ])
                      ],
                    ),
                  ],
                ),
              ),
            ],
          ),
        ),
      ),
    );
  }
}

---

我尝试了您的代码，您可以删除几个小部件并从以下内容开始：

return Scaffold(
      body: SingleChildScrollView(
        child: Column(children: <Widget>[
          GridView(),
          GridView(),
        ]),
      ),
    );

返回脚手架(
正文：SingleChildScrollView(
子项：列（子项：[
GridView（），
GridView（），
]),
),
);

然后，您可以禁用网格视图上的滚动，并添加更多需要的内容。 希望这有帮助。请让我知道这是否解决了您的问题

return Scaffold(
      body: SingleChildScrollView(
        child: Column(children: <Widget>[
          GridView(),
          GridView(),
        ]),
      ),
    );