dart Flutter Bottom溢出143像素

iqxoj9l9  于 12个月前  发布在  Flutter
关注(0)|答案(2)|浏览(134)

我试图建立一个寿司应用程序,但当我旋转我的手机,有黑色和黄色的线,它说:“底部溢出143像素”
app screenshot
code
我在youtube上试了一些教程,但是结果是空白的

gz5pxeao

gz5pxeao1#

底部溢出143像素
意味着屏幕下方有高度为143像素的内容。
你需要一个横向移动的视图的策略。要么做一个适合整个屏幕的不同设计,要么用一个SingleChildScrollView小部件 Package 你的Column,使它成为可滚动的,溢出的内容应该是可拖动到视图中的。

编辑:

如果SingleChildScrollView中的Expanded小部件具有默认的垂直滚动方向,则它的高度为无穷大,从而导致“RenderBox was not layed out”错误
通常,这个问题与违反框约束有关,需要通过向Flutter提供有关如何约束有问题的小部件的更多信息来解决。您可以在Understanding constraints页面上了解有关Flutter中约束如何工作的更多信息。
RenderBox was not layed out错误通常由以下两个错误之一引起:

  • '垂直视口被赋予无限高度'
  • 'InputDecorator.不能具有无限宽度'
    给予你ListView一个已知的高度。

Expanded替换为SizedBox,然后指定高度。

SizedBox(
  height: 250, // Modify to your preference.
  child: ListView.builder(
    scrollDirection: Axis.horizontal,
    itemCount: foodMenu.length,
    itemBuilder: (context, index) => FoodTile(
      food: foodMenu[index],
      onTap: () => navigateToFoodDetails(index),
    ),
  ),
),

字符串

mrphzbgm

mrphzbgm2#

如果您使用SingleChildScrollView,那么它可以解决您的问题,但如果列/行部件包含任何具有无限高度的部件,那么您的屏幕将显示空白屏幕。因此,请检查您的列部件中是否有任何扩展/灵活的部件。
最好粘贴你的完整代码,这样我就可以确定问题
更新日期:
我看了你的代码我想这就是问题所在

Expanded( // Use SizedBox and set fixed height
            child: ListView.builder(
              scrollDirection: Axis.horizontal,
              itemCount: foodMenu.length,
              itemBuilder: (context, index) => FoodTile(
                food: foodMenu[index],
                onTap: () => navigateToFoodDetails(index),
              ),
            ),
          ),

字符串
如果你想要整个屏幕滚动,那么--> Wrap your Column with SingleChildScrollView --> Remove Expanded and use SizedBox with a fixed height

相关问题