时间戳

首页 > 解决方案 > Flutter RenderFlex 溢出

flutter - Flutter RenderFlex 溢出

问题描述

嗨，我是新来的，我正面临这个错误

A RenderFlex overflowed by 9.0 pixels on the right.
The relevant error-causing widget was Row

这是我下面的代码：

return Scaffold(
  backgroundColor: Colors.white,
  appBar: AppBar(
    backgroundColor: Colors.white,
    elevation: 0.0,
    iconTheme: IconThemeData(
      color: Colors.grey[600],
    ),
    leading: Padding(
      padding: const EdgeInsets.only(left: 8.0),
      child: GestureDetector(
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          crossAxisAlignment: CrossAxisAlignment.center,
          mainAxisSize: MainAxisSize.max,
          children: [
            Icon(
              Icons.arrow_back_ios_outlined,
            ), 
            Text(
              'Back',
              style: GoogleFonts.poppins(
                color: Colors.grey[600],
                fontSize: 20
              ),
            ),
          ],
        ),

这是我的设备模拟器的截图 在此处输入图像描述

你能帮我解决这个错误吗？

标签： flutterdartflutter-layout

解决方案

Icon用小部件包装Expanded将消除这里的错误。

return Scaffold(
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: Colors.white,
        elevation: 0.0,
        iconTheme: IconThemeData(
          color: Colors.grey[600],
        ),
        leading: Padding(
          padding: const EdgeInsets.only(left: 8.0),
          child: GestureDetector(
            child: Row(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              mainAxisSize: MainAxisSize.max,
              children: [
                Expanded(
                  child: Icon(
                    Icons.arrow_back_ios_outlined,
                  ),
                ),
                Text(
                  'Back',
                  style: GoogleFonts.poppins(
                      color: Colors.grey[600], fontSize: 20),
                ),
              ],
            ),
          ),
        ),
      ),
    );

这能解决你的问题吗？

推荐阅读