A RenderFlex 溢出右侧 3.0 像素/Flutter

时间:2021-02-10 13:24:18

标签: flutter dart

我已经编码了几个小时。我是 flutter 新手,这个错误显示在我的项目中: 右侧的 RenderFlex 溢出了 3.0 像素。 相关的导致错误的小部件是 行 溢出的 RenderFlex 的方向为 Axis.horizo​​ntal。

请问您有解决方法吗

下面是我的代码

Padding(
  padding: const EdgeInsets.all(8.0),
  child: Card(
     elevation: 3.0,
     shape: RoundedRectangleBorder(
        borderRadius: BorderRadius.circular(15.0)
     ),
     child: Container(
       decoration: BoxDecoration(
         borderRadius: BorderRadius.circular(15.0),
         image: DecorationImage(
           fit: BoxFit.cover,
           image: AssetImage(
            'assets/brownies.jpg',
      )
    )
  ),
  child: ListTile(
    contentPadding: EdgeInsets.fromLTRB(50, 50, 50, 50),
    leading: ConstrainedBox(
      constraints: BoxConstraints(
        minWidth: 250,
        minHeight: 250,
        maxWidth: 250,
        maxHeight: 250,
      ),
      child: Column(
        children: [
          Text(
            'Čokoládové brownies',
            style: GoogleFonts.caveat(
              fontSize: 25.0,
              fontWeight: FontWeight.bold,
            ),
          ),
          Padding(
            padding: const EdgeInsets.only(top: 0),
            child: Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(10),
                color: Colors.grey.withOpacity(0.5),
              ),
              width: 75,
              child: Row(
                children: [
                  Icon(
                    Icons.access_time,
                  ),
                  Text(
                    '45 min.',
                    overflow: TextOverflow.ellipsis,
                    softWrap: true,
                    style: GoogleFonts.poppins(
                      fontSize: 15.0,
                      fontWeight: FontWeight.w400,
                    ),
                  ),
                ],
              ),
            ),
          )
        ],
      )
    ),
    trailing: Icon(
      Icons.arrow_forward_ios,
      size: 27.0,
    ),
    onTap: () {
      Navigator.push(
      context,
      PageTransition(child: Brownies(), type: PageTransitionType.rightToLeft),
      );
    },
  ),
),

),

1 个答案:

答案 0 :(得分:0)

大概是这个部分:

             Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.grey.withOpacity(0.5),
                  ),
                  width: 75,
                  child: Row(
                    children: [
                      Icon(
                        Icons.access_time,
                      ),
                      Text(
                        '45 min.',
                        overflow: TextOverflow.ellipsis,
                        softWrap: true,
                        style: GoogleFonts.poppins(
                          fontSize: 15.0,
                          fontWeight: FontWeight.w400,
                        ),
                      ),
                    ],
                  ),

您不应设置包含 Row 的容器的宽度。

             Container(
                  decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(10),
                    color: Colors.grey.withOpacity(0.5),
                  ),
                  child: Row(
                    children: [