对于Flutter，Expanded和GridView具有意外填充

Question

不好意思，我的英语不好。在扑朔迷离中，我有一个不应该设置的边距。没有设置特殊的边距。有办法摆脱利润空间吗？我想将其全部保留在屏幕上，而不要滚动。（华为nova lite Android8.0.0）（Flutter 1.12.13 + hotfix.9＆Dart 2.7.2）（深层）enter image description here

“此处输入图像描述”是使用以下代码执行时的屏幕截图。

import 'package:flutter/material.dart';
import 'package:flutter/services.dart';

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  SystemChrome.setPreferredOrientations([DeviceOrientation.portraitUp])
      .then((_) {
    runApp(new MyApp());
  });
}

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(home: MyHomePage());
  }
}

class MyHomePage extends StatefulWidget {
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  List icons = [
    [true, false, Icons.filter_1],
    [false, false, Icons.filter_2],
    [false, false, Icons.filter_3],
    [false, false, Icons.filter_4],
    [false, false, Icons.filter_5],
    [false, false, Icons.filter_6],
    [false, false, Icons.filter_7],
    [false, true, Icons.undo],
    [true, true, Icons.music_note],
    [true, true, Icons.place],
    [false, false, Icons.format_color_fill],
    [false, false, Icons.category],
  ];
  final IconData muteIcon = Icons.font_download;
  int nBack = 0;

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        body: Column(
            children: <Widget>[
      Expanded(
          child: GridView.builder(
        itemCount: icons.length,
        gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
          crossAxisCount: 8,
        ),
        itemBuilder: (context, index) {
          return Container(
              decoration: BoxDecoration(
                color: icons[index][0] ? Colors.lightGreen : Colors.white,
                border: icons[index][1]
                    ? Border.all(color: Colors.black45)
                    : Border(),
              ),
              child: GestureDetector(
                  onTap: () {
                    setState(() {
                      if (0 <= index && index <= 6 && !icons[index][1]) {
                        icons[nBack][0] = false;
                        nBack = index;
                        icons[index][0] = !icons[index][0];
                      } else if (!icons[index][1]) {
                        icons[index][0] = !icons[index][0];
                      }
                    });
                  },
                  child: Icon(icons[index][2], size: 20)));
        },
      )),
          Expanded(
              child: GridView.builder(
                itemCount: 9,
                gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                  crossAxisCount: 3,
                ),
                itemBuilder: (context, index) {
                  return Container(
                      decoration: BoxDecoration(
                        border:Border.all(color: Colors.black45)
                      ),
                      child: Text(""));
                },
              ))
    ]));
  }
}

Answer 1

谢谢您的回答！我使用了SizedBox，它很好地适合屏幕。enter image description here

…
…
  Widget build(BuildContext context) {
    final size = MediaQuery.of(context).size;
    return Scaffold(
        body: Column(children: <Widget>[
      SizedBox(
          width: size.width,
          height: size.width / 3.2,
          child: GridView.builder(
            itemCount: icons.length,
…
…
      SizedBox(
          width: size.width,
          height: size.width * 1.1,
          child: GridView.builder(
            itemCount: 9,