在颤动中的ButtonBar中添加TextField

Question

我使用ButtonBar在Column中将按钮排列成一行。

在ButtonBar中，我放入了一个TextField：

              ButtonBar
              (
                mainAxisSize: MainAxisSize.min,
                children: <Widget>
                [
                  Expanded(
                      child: TextField(
                         maxLines: 8,
                         decoration: InputDecoration.collapsed(hintText: "Enter your text here"),
                      ),
                  ),
                ],
              ),

此ButtonBar位于列中。我能够以这种方式显示正常的按钮和文本。只有这个TextField在制造问题：

════════════════════════════════════════════════════════════════════════════════

════════ Exception caught by rendering library ═════════════════════════════════
RenderBox was not laid out: RenderRepaintBoundary#3888e NEEDS-LAYOUT NEEDS-PAINT
'package:flutter/src/rendering/box.dart':
Failed assertion: line 1930 pos 12: 'hasSize'

The relevant error-causing widget was
TextField
lib/main.dart:138`

Answer 1

您可以像这样使用

SizedBox(
      height: 40,
      width: MediaQuery.of(context).size.width,
      child: TextField(
        decoration: InputDecoration(),
      ),
    );

Answer 2

您可以将TextField包装在ConstrainedBox中，如下所示：

ConstrainedBox(
      constraints: BoxConstraints(
         maxHeight: 40 ,
         maxWidth: MediaQuery.of(context).size.width,
         ),
      width: MediaQuery.of(context).size.width,
      child: TextField(
        decoration: InputDecoration(),
      ),
    );

Answer 3

请使用put Textfield in Container，并像这样给它们提供宽度和高度：

ButtonBar(
              mainAxisSize: MainAxisSize.min,
              children: <Widget>[
                Container(
                  height: 60,
                  width: 200,
                  child: TextField(
                    maxLines: 8,
                    decoration: InputDecoration.collapsed(
                        hintText: "Enter your text here"),
                  ),
                ),
              ],
            ),