时间戳

首页 > 解决方案 > Row 内的“TextField”导致溢出抖动

flutter - Row 内的“TextField”导致溢出抖动

问题描述

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

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

PS：有时我看不到“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:',
                        ),
                      ),
                    ),
                  ),
                ],
            ),
          ],
        ),
    ),
    ),
  ),
);
}
}

编辑：我使用对齐而不是填充并且更好但是现在我的 MaxRadius 圆形头像不起作用...当我使用不同的“Minradius”或“MaxRadius”时，图标的大小不会改变，你知道为什么吗？

标签： flutterdartflutter-layout

解决方案

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

为了在文本字段小部件中disabledBorder正确设置功能。enabled: false

推荐阅读