底部溢出 224 像素的 RenderFlex答案

【问题标题】：A RenderFlex overflowed by 224 pixels on the bottom底部溢出 224 像素的 RenderFlex
【发布时间】：2021-03-08 06:51:02
【问题描述】：

如何解决以下错误？

一个 RenderFlex 在底部溢出了 224 像素。

在列小部件上

@override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Read message'),
      ),
      body: Column( //the error is here
        children: [
          Padding(
            padding: const EdgeInsets.all(20.0).copyWith(bottom: 10),
            child: Row( ...

【问题讨论】：

标签： flutter

【解决方案1】：

用SingleChildScrollView包裹你的Column

【讨论】：

【解决方案2】：

根据设备屏幕，这些小部件可能会溢出，处理它的解决方案很少。

使用包装在 SingleChildScrollView 中的 Column

SingleChildScrollView( 孩子：列（孩子：孩子）， )

使用列表视图

列表视图（孩子：孩子 )

同时使用 Column 和 ListView（您应该使用 Expanded/Flexible，或者在这样做时为 ListView 提供固定高度）。

列( 孩子们： [ ...children.take(2).toList(), // 在 Column 中显示前 2 个孩子展开（孩子：列表视图（孩子：children.getRange（3，children.length）.toList（）， ), // 其余在 ListView ), ], )

【讨论】：