为什么 Gridview.builder 溢出？ （颤振/飞镖）

Question

我一直在尝试修复这个错误，但没有成功。我正在尝试制作一个 Gridview.builder 小部件，它将包含计算器的按钮。我希望小部件适合屏幕的下部而不会溢出。我试图通过将 Gridview 包装成具有特定高度和宽度的 Contianer 或 ConstrainedBox 来修复它。但是，Gridview 仍然不断溢出。

这是我的 Gridview 代码：

           Expanded(
            child: ConstrainedBox(
              constraints: BoxConstraints(
                minHeight: ScreenHeight(context) * .3,
                maxHeight: ScreenHeight(context) * .4,
              ),
              child: Container(
                margin: EdgeInsets.only(
                    right: ScreenHeight(context) * .02,
                    left: ScreenHeight(context) * .02),
                child: GridView.builder(
                  physics: NeverScrollableScrollPhysics(),
                  itemCount: buttons.length,
                  gridDelegate: SliverGridDelegateWithFixedCrossAxisCount(
                      crossAxisCount: getCrossAxisCount(context)),
                  itemBuilder: (BuildContext context, int index) {
                    // Clear Button
                    if (index == 0) {
                      return CalcButton(
                        onTap: () {
                          setState(() {
                            userInput = '';
                            calcAnswer = '';
                          });
                        },
                        buttonText: buttons[index],
                        color: Colors.blue[50],
                        textColor: Colors.black,
                      );
                    }

                    // +/- button
                    else if (index == 1) {
                      return CalcButton(
                        buttonText: buttons[index],
                        color: Colors.blue[50],
                        textColor: Colors.black,
                      );
                    }

                    // % Button
                    else if (index == 2) {
                      return CalcButton(
                        onTap: () {
                          setState(() {
                            userInput += buttons[index];
                          });
                        },
                        buttonText: buttons[index],
                        color: Colors.blue[50],
                        textColor: Colors.black,
                      );
                    }

                    // Delete Button
                    else if (index == 3) {
                      return CalcButton(
                        onTap: () {
                          setState(() {
                            userInput = userInput.substring(
                                0, userInput.length - 1);
                          });
                        },
                        buttonText: buttons[index],
                        color: Colors.blue[50],
                        textColor: Colors.black,
                      );
                    }

                    // Equal_to Button
                    else if (index == 18) {
                      return CalcButton(
                        onTap: () {
                          setState(() {
                            equalPressed();
                          });
                        },
                        buttonText: buttons[index],
                        color: Colors.orange[700],
                        textColor: Colors.white,
                      );
                    }

                    //  other buttons
                    else {
                      return CalcButton(
                        onTap: () {
                          setState(() {
                            userInput += buttons[index];
                          });
                        },
                        buttonText: buttons[index],
                        color: isOperator(buttons[index])
                            ? Colors.blueAccent
                            : Colors.white,
                        textColor: isOperator(buttons[index])
                            ? Colors.white
                            : Colors.black,
                      );
                    }
                  },
                ),
              ),
            ),
          ),

这是我的 CalcButton 代码：

class CalcButton extends StatelessWidget {
  final color;
  final textColor;
  final String buttonText;
  final onTap;

  CalcButton({
    this.color,
    this.textColor,
    this.buttonText = "",
    this.onTap,
  });

  @override
  Widget build(BuildContext context) {
    return GestureDetector(
      onTap: onTap,
      child: Padding(
        padding: EdgeInsets.all(.3),
        child: ClipRRect(
          child: Container(
            color: getCalcButtonColor(calcTheme,
                buttonText), //gets calc button color from created method
            child: Center(
              child: Text(
                buttonText,
                style: TextStyle(
                  color: getButtonTxtColor(calcTheme,
                      buttonText), //gets button txt color from created method
                  fontSize: ScreenWidth(context) * .05,
                  fontWeight: FontWeight.bold,
                ),
              ),
            ),
          ),
        ),
      ),
    );
  }
}

这是它的外观： Image 1 Image 2

请注意，ScreenHeight() 和 ScreenWidth() 函数是返回 MediaQuery.of(context).size.width 和 MediaQuery.of(context).size.height 的值的函数

我也尝试删除 Expanded() 并只使用 ConstrainedBox，但同样的事情仍然发生。

任何帮助将不胜感激。