我是一个新的flutter开发人员，所以请你能帮助我解决这个问题。问题是当验证器在TextFieldForm "工作"，它添加文本，用户做错了什么。我的容器变得太小的形式。我需要伸展容器或做其他事情，以获得更好的结果。我不知道我应该做什么，请你能帮助我，为这个。
下面是我代码：
body:Center(
child:SingleChildScrollView(
child:Column(
children[
Container(
decoration: BoxDecoration(
color: Color.fromRGBO(217, 217, 217, 1),
borderRadius: BorderRadius.all(Radius.circular(20.0)),
),
width: MediaQuery.of(context).size.width,
height: MediaQuery.of(context).size.height / 1.9,
// width: 350,
// height: 600,
child: Form(
key: _formKey,
child: ListView(
padding:
EdgeInsets.symmetric(horizontal: 20, vertical: 15),
// itemExtent: 60,
children: [
TextFormField(
validator: _validateName,
controller: _nameController,
style: TextStyle(
fontSize: 20,
color: Colors.black,
),
decoration: InputDecoration(
prefixIcon: Icon(
Icons.person,
color: Colors.grey,
),
contentPadding: EdgeInsets.all(20),
filled: true,
fillColor: Colors.white,
hintText: 'Adyňyz',
hintStyle: TextStyle(
fontSize: 20,
color: Colors.grey.shade600,
),
border: OutlineInputBorder(
borderSide: BorderSide.none,
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
),
),
SizedBox(height: 20),
TextFormField(
validator: _validatePassword,
controller: _passController,
style: TextStyle(
fontSize: 20,
color: Colors.black,
),
obscureText: _hidePass,
decoration: InputDecoration(
prefixIcon: Icon(
Icons.shield,
color: Colors.grey,
),
suffixIcon: IconButton(
color: Colors.black,
onPressed: () {
setState(() {
_hidePass = !_hidePass;
});
},
icon: Icon(
_hidePass
? Icons.visibility
: Icons.visibility_off,
)),
contentPadding: EdgeInsets.all(20),
filled: true,
fillColor: Colors.white,
hintText: 'Parol',
hintStyle: TextStyle(
fontSize: 20,
color: Colors.grey.shade600,
),
border: OutlineInputBorder(
borderSide: BorderSide.none,
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
),
),
SizedBox(height: 20),
TextFormField(
controller: _teamNameController,
validator: _validateTeam,
style: TextStyle(
fontSize: 20,
color: Colors.black,
),
decoration: InputDecoration(
prefixIcon: Icon(Icons.people),
contentPadding: EdgeInsets.all(20),
filled: true,
fillColor: Colors.white,
hintText: 'Toparyň ady',
hintStyle: TextStyle(
fontSize: 20,
color: Colors.grey.shade600,
),
border: OutlineInputBorder(
borderSide: BorderSide.none,
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
),
),
SizedBox(height: 20),
TextFormField(
controller: _phoneNumberController,
validator: _validatePhoneNumber,
keyboardType: TextInputType.number,
style: TextStyle(
fontSize: 20,
color: Colors.black,
),
decoration: InputDecoration(
helperText: "+993-6#-######",
prefixIcon: Icon(Icons.call, color: Colors.grey),
contentPadding: EdgeInsets.all(20),
filled: true,
fillColor: Colors.white,
hintText: "Telefon nomeriňiz",
hintStyle: TextStyle(
fontSize: 20,
color: Colors.grey.shade600,
),
border: OutlineInputBorder(
borderSide: BorderSide.none,
borderRadius: BorderRadius.all(
Radius.circular(10),
),
),
),
),
SizedBox(height: 20),
SizedBox(
height: 60,
child: ElevatedButton(
onPressed: () {
_submitButton();
},
child: Text(
"Register",
textAlign: TextAlign.left,
style: TextStyle(
fontSize: 20,
color: Color.fromARGB(255, 255, 255, 255),
),
),
style: ButtonStyle(
shape: MaterialStateProperty.all(
RoundedRectangleBorder(
borderRadius: BorderRadius.circular(10.0),
),
),
backgroundColor:
MaterialStateProperty.all(Colors.black),
),
),
),
],
),
),
),],
),
),
),下面是第一眼：
，
这就是问题所在
，
这就是我说的。
我不知道这是怎么回事。拜托，伙计们，我需要你们的帮助。非常感谢你们!!!
3条答案
按热度按时间6rqinv9w1#
您可以删除
ListView，因为您已经使用SingleChildScrollView进行了 Package 。您必须使用
ListView或SingleChildScrollView来实现滚动效果。hmae6n7t2#
您需要从容器
height: MediaQuery.of(context).size.height / 1.9,中删除固定高度。只需在列上使用SingleChildScrollView并删除ListView小部件。plicqrtu3#
首先你已经给了容器高度，也就是
在上面的代码中，容器高度与表单验证无关，在不显示任何验证的情况下，所有字段都将显示。但是，当验证错误发生时，将显示错误文本，这将占用额外的高度。在这里，您使用的是Single child child滚动视图，但容器高度与之前相同，没有错误文本
所以现在解决这个问题最简单的方法是
删除容器高度参数意味着不设置它的高度，因为容器会自动采用与其子容器相同的大小。现在，通过这样做，容器将在没有错误文本时自动收缩，在有错误文本时自动扩展