NEW ARTICLE
kotlin 「if」文を使用する
  1. HOME
  2. flutter
  3. Flutter エラー「A RenderFlex overflowed by xxx pixels on the bottom.」が発生した場合の対処法

Flutter エラー「A RenderFlex overflowed by xxx pixels on the bottom.」が発生した場合の対処法

Flutter エラー「A RenderFlex overflowed by xxx pixels on the bottom.」が発生した場合の対処法

Flutterで、エラー「A RenderFlex overflowed by 18053 pixels on the bottom.」が発生した場合の対処法を記述してます。「Widget」の「Text」などに枠を超える量の値が使用されている際に発生します。

目次

環境

  • OS  windows11 pro 64bit
  • Flutter 3.3.7

エラー全文

以下の「Text」に指定している変数「responseResult」が長い結果の場合に発生

body: Center(
  child: Column(
    children: [
      Text(responseResult),
      ElevatedButton(
        child: const Text('GET'),
        onPressed: () => {getFromSite()},
      ),
    ],
  ),
),

エラー全文

以下の「Text」に指定している変数「responseResult」が長い結果の場合に発生

画像

原因

「const」が設定されているため。親のWidgetに「const」が設定されていても発生します。

対処法

「SingleChildScrollView」を使用して、スクロールできるようにします。

child: SingleChildScrollView(
  child: Column(
    children: [
      Text(responseResult),
      ElevatedButton(
        child: const Text('GET'),
        onPressed: () => {getFromSite()},
      ),
    ],
  ),
),