긴 텍스트를 Text나 TextFormField에 표시하려고 하면 "A RenderFlex overflowed by xx pixels on the bottom."라는 오류 메시지와 함께 다음과 같은 화면 표시가 될 수 있습니다.

솔루션(Text)

Text의 경우 다음과 같이 Expanded를 사용합니다.

Expanded(child: Text(message))

솔루션 (TextFormField)

TextFormField는 maxLines:를 지정하면 폼내에서 HTML의 textarea적으로 사용할 수 있는 복수행 입력할 수 있는 필드를 만들 수 있습니다만, 이것이라고 대량의 텍스트를 입력했을 경우에도 역시 Overflow의 문제가 나와 버립니다. 이를 피하기 위해 다음과 같이 Flexible과 Container로 둘러싸십시오.

Flexible(
  child: Container(
    constraints:
        BoxConstraints(minHeight: 200, minWidth: double.infinity),
    child: TextFormField(
      maxLines: 10, // フィールドの高さ
      keyboardType: TextInputType.multiline,
      decoration: InputDecoration(labelText: 'メッセージ'),
    ),
  ),
),

다음과 같이 Overflow하지 않습니다.

솔루션 (TextFormField 2)

몇몇은 객체가 있는 Form 안에 multiline의 TextFormField를 넣었을 경우에 Overflow를 일으키는 일이 있는 것을 발견했습니다. 이 경우는 다음과 같은 느낌으로 ListView에서 Form을 감싸도록 하면 잘 작동했습니다. (참고: [플러터] 스크롤 가능한 FormField 처리 )

body: ListView(children: <Widget>[
          Form(
            key: _formKey,
            child: Column(
              crossAxisAlignment: CrossAxisAlignment.start,
              children: <Widget>[
              // 色々オブジェクト...
              TextFormField(
                  keyboardType: TextInputType.multiline,
                  maxLines: 10,
                  decoration: InputDecoration(
                    labelText: "メッセージ",
                  ),
                ),