Row 内的“TextField”导致溢出抖动答案

【问题标题】："TextField " inside Row causes overflow flutterRow 内的“TextField”导致溢出抖动
【发布时间】：2020-09-06 03:43:22
【问题描述】：

我在 Row 小部件中有一个“TextField”，我的问题是，如果我使用“填充”将它向上移动，它会给我一个溢出，可能是因为它是“扩展的”，但如果我删除“扩展”，我赢了'没有看到“TextField”，它消失了......在“TextField”上方有一个图像。

我希望只有 TextField 的边框是彩色的，其余的必须是透明的。

附： : 有时我看不到“TextField”，如果我改变颜色，似乎什么都没有改变。

这是我的代码：

body: SafeArea(
    child: GestureDetector(
      onTap: ()
       {
        FocusScope.of(context).requestFocus(new FocusNode());
        },
        child : SingleChildScrollView(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.spaceBetween,
              children: <Widget>[
                Row(
                  children: <Widget>[
                    Align(
                      alignment : Alignment.center,
                      child: Container(
                        width: MediaQuery.of(context).size.width*0.99,
                        height: MediaQuery.of(context).size.height*0.49,
                        child : GestureDetector(
                          //onTap: getImage,
                          child : _image == null
                            ? CircleAvatar(
                            backgroundImage: AssetImage('assets/images/empty_profile.png'),
                            maxRadius: 80,
                            )
                            : CircleAvatar(
                            backgroundImage: FileImage(_image),
                            maxRadius: 80),
                        ),
                      ),
                    ),
                  ],
              ),
            Row(
                children: <Widget>[
                  Align(
                    alignment: Alignment.bottomCenter,
                    child: SizedBox(
                      width: MediaQuery.of(context).size.width*0.99,
                      height: MediaQuery.of(context).size.height*0.49,
                      child: TextField(
                        maxLines: 1,
                        obscureText: false,
                        decoration: InputDecoration(
                          disabledBorder: OutlineInputBorder(
                            borderSide: BorderSide(
                              color: Colors.yellowAccent,
                              width: 3.0,
                            ),
                          ),
                          labelText: 'Descrizione:',
                        ),
                      ),
                    ),
                  ),
                ],
            ),
          ],
        ),
    ),
    ),
  ),
);
}
}

编辑：我使用 Align 而不是 Padding，效果更好，但现在 MaxRadius 的 Circle Avatar 不起作用...当我使用不同的“Minradius”或“时，图标的大小不会改变MaxRadius”，你知道为什么吗？

【问题讨论】：

您希望文本字段正确地位于图像旁边，而不是位于图像下方？
@Unbreachable 它应该在下面，对不起我迟到的答案。

标签： flutter dart flutter-layout

【解决方案1】：

添加到@Unbreachable 答案，如果您想使用大尺寸/填充，您可能会考虑将Column 包装在SingleChildScrollView 中，否则，当您键入并显示键盘时，您的TextField 可能会消失, 被键盘溢出。

【讨论】：

【解决方案2】：

Row 小部件不会对其子级施加任何约束。您在 Container 中有 Circle Avatatar。由于您为 Container 小部件提供了特定的宽度和高度，因此它将采用这些测量值并应用它们，但这样做，它将忽略其子级大小（在本例中为最小和最大半径）。您可以在此处阅读有关约束的更多信息：https://flutter.dev/docs/development/ui/layout/constraints

为了使disabledBorder 正常工作，请在文本字段小部件中设置enabled: false。

【讨论】：

它们不必并排，它们应该在上面和下面。
我不明白，“sizedbox(width:20.0)”的第一个尺寸是多少？