首页 > 解决方案 > 颤动中的“RenderBox未布置”文本字段错误

问题描述

我正在尝试放置一个文本字段,但没有出现错误,但我认为我遇到了一个逻辑错误。我想尺寸是必需的。但我不明白在哪里指定。并且屏幕是空白的。我不知道我是否能正确解释它,因为我的英语不好。

在此处输入图像描述

在此处输入图像描述

        child: Row(
          children: <Widget>[
            Column(
              children: <Widget>[
                TextFormField(
                  decoration: const InputDecoration(
                    hintText: 'Enter your email',
                  ),
                  validator: (String? value) {
                    if (value == null || value.isEmpty) {
                      return 'Please enter some text';
                    }
                    return null;
                  },
                ),
                const Padding(
                  padding: EdgeInsets.symmetric(vertical: 16.0),
                  child: ElevatedButton(
                    onPressed: null,
                    child: Text('Submit'),
                  ),
                ),
              ],
            ),
            Column(
              children: <Widget>[
                TextButton(
                  style: TextButton.styleFrom(
                    textStyle: const TextStyle(fontSize: 20),
                    backgroundColor: Colors.blueAccent,
                  ),
                  onPressed: null,
                  child: const Text('Button'),
                ),
                Row(
                  children: <Widget>[
                    TextButton(
                      style: TextButton.styleFrom(
                        textStyle: const TextStyle(fontSize: 20),
                        backgroundColor: Colors.blueAccent,
                      ),
                      onPressed: null,
                      child: const Text('Button2'),
                    ),
                  ],
                )
              ],
            )
          ],
        ),
      ),`

标签: flutter-layout

解决方案


您必须以某种方式告诉 Flutter 它应该如何调整行中两列的大小。一种可能的解决方案是将第一列包装在Expanded小部件中。结果将绘制第二列,其大小由ButtonButton2) 的文本大小决定。然后第一列将占据所有剩余空间,这就是什么Expanded意思。代码:

Row(
  children: <Widget>[
    Expanded( // <--- this is added, the rest is unchanged
      child: Column(
        children: <Widget>[
          TextFormField(
            decoration: const InputDecoration(
              hintText: 'Enter your email',
            ),
            validator: (String? value) {
              if (value == null || value.isEmpty) {
                return 'Please enter some text';
              }
              return null;
            },
          ),
          const Padding(
            padding: EdgeInsets.symmetric(vertical: 16.0),
            child: ElevatedButton(
              onPressed: null,
              child: Text('Submit'),
            ),
          ),
        ],
      ),
    ),
    Column(
      children: <Widget>[
        TextButton(
          style: TextButton.styleFrom(
            textStyle: const TextStyle(fontSize: 20),
            backgroundColor: Colors.blueAccent,
          ),
          onPressed: null,
          child: const Text('Button'),
        ),
        Row(
          children: <Widget>[
            TextButton(
              style: TextButton.styleFrom(
                textStyle: const TextStyle(fontSize: 20),
                backgroundColor: Colors.blueAccent,
              ),
              onPressed: null,
              child: const Text('Button2'),
            ),
          ],
        )
      ],
    )
  ],
),

推荐阅读