Flutter异常Another exception was thrown: A RenderFlex overflowed by 5.0 pixels on the bottom解决方案

2022-05-09 19:25:09 浏览数 (3)

异常信息

在使用SliverFixedExtentList展示菜单列表时程序抛出一下异常:

代码语言:javascript复制
I/flutter (21190): ◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤◢◤
I/flutter (21190): ════════════════════════════════════════════════════════════════════════════════════════════════════
I/flutter (21190): Another exception was thrown: A RenderFlex overflowed by 5.0 pixels on the bottom.
I/flutter (21190): Another exception was thrown: A RenderFlex overflowed by 5.0 pixels on the bottom.
I/flutter (21190): Another exception was thrown: A RenderFlex overflowed by 5.0 pixels on the bottom.
I/flutter (21190): Another exception was thrown: A RenderFlex overflowed by 5.0 pixels on the bottom.
I/flutter (21190): Another exception was thrown: A RenderFlex overflowed by 5.0 pixels on the bottom.
I/flutter (21190): Another exception was thrown: A RenderFlex overflowed by 5.0 pixels on the bottom.

并且在程序的页面上也同样无法正常显示:

相关的代码如下:

代码语言:javascript复制
SliverFixedExtentList(
          delegate: SliverChildBuilderDelegate((BuildContext context, int index) {
            String title = titles[index];
            return Container(
              alignment: Alignment.centerLeft,
              child: InkWell(
                onTap: () {
                  print("this is the item of "   title);
                },
                child: Column(
                  children: <Widget>[
                    Padding(
                      padding: const EdgeInsets.all(15.0),
                      child: Row(
                        children: <Widget>[
                          Expanded(
                            child: Text(
                              title,
                              style: TextStyle(fontSize: 16.0),
                            ),
                          ),
                          rightArrowIcon
                        ],
                      ),
                    ),
                    Divider(
                      height: 1.0,
                    )
                  ],
                ),
              ),
            );
          }, childCount: titles.length),
          itemExtent: 50.0,
        )

异常原因及解决方法

经过尝试此问题的原因是因为padding值设置的大小超过了外层widget的高度。相关代码:

代码语言:javascript复制
padding: const EdgeInsets.all(15.0),

根据异常可看出超过了5.0 pixels(像素),那么将padding的值改为12.5或小于12.5则异常解决:

代码语言:javascript复制
padding: const EdgeInsets.all(12.5),
或
padding: const EdgeInsets.all(10.0),

原文链接:https://www.choupangxia.com/topic/detail/92

0 人点赞