在SingleChildScrollView中底部溢出42像素
问题描述 投票：0回答：2
我在SingleChildScrollView中使用了一个表单，一切正常：
形式：一切正常，
我用过这段代码
@override
Widget build(BuildContext context) {
double stackHeight = MediaQuery.of(context).size.height/4;
double width = MediaQuery.of(context).size.width;
return Scaffold(
body: SingleChildScrollView(
child :SafeArea(
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [const Color(0xFF3023AE), const Color(0xFFC86DD7)])),
child: Column(
children: <Widget>[
Container(
height: stackHeight*2.6,
child: IntroViewsFlutter(
pages,
onTapDoneButton: (){
Navigator.pop(context);
},
showSkipButton: false,
pageButtonsColor: btnColors,
),
),
Container(
height: stackHeight*1.4,
child: bottomHomePage(),
color: pageColor,
width: width,
),
],
),
)
),
)
);
但是当出现错误时，会发生以下情况：
我已经尝试了很多东西，我听说过布局构建器，但不知道它是否适用于我，或者还有其他可以适应运行时事件的解决方案。
更新：问题只是在列中使用扩展：这里我们再次是代码：
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
body: SingleChildScrollView(
child: Center (
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [const Color(0xFF3023AE), const Color(0xFFC86DD7)])),
child: Form(
key: _formKey,
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.only(top: 70.0, bottom: 20.0),
child: Text(
"C'est parti !",
style: TextStyle(fontSize: 32, color: Colors.white),
),
),
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Container(
width: width_textFormField + 15.0,
child: Text(
" Avant de commencer, sache que pour utiliser pleinement ta BanKids tu devras demander à tes parents de s'inscrire pour te débloquer toutes les fonctionnalités",
style: TextStyle(
fontSize: 14,
color: Colors.white,
),
textAlign: TextAlign.center,
)),
),
Container(
alignment: Alignment.center,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
child: Text(
"Client Bank ?",
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white),
),
),
Container(
child: Row(
children: <Widget>[
Text(
"Oui",
style: TextStyle(color: Colors.white),
),
Radio(
value: 1,
activeColor: Colors.white,
groupValue: _grpVal,
onChanged: _handleRadioValueChange1,
),
],
)),
Container(
child: Row(
children: <Widget>[
Text(
"Non",
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white),
),
Radio(
activeColor: Colors.white,
value: 2,
groupValue: _grpVal,
onChanged: _handleRadioValueChange1,
),
],
)),
],
)),
Container(
child: Column(
children: <Widget>[
customizedTextFormField(
hintText: "Nom",
width: width_textFormField + 10.0,
txtColor: Colors.black),
customizedTextFormField(
hintText: "Prénom",
width: width_textFormField + 10.0,
txtColor: Colors.black),
customizedTextFormField(
hintText: "Date de Naissance",
width: width_textFormField + 10.0,
txtColor: Colors.black),
customizedTextFormField(
hintText: "CIN",
width: width_textFormField + 10.0,
txtColor: Colors.black),
customizedTextFormField(
hintText: "Email",
width: width_textFormField + 10.0,
txtColor: Colors.black)
],
),
),
Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Container(
width: width_textFormField,
child: Row(
children: <Widget>[
Checkbox(
checkColor: Color(0xFF3023AE),
value: isCheck,
activeColor: Colors.white,
onChanged: _handleCheckBox,
),
Expanded(
child: Text(
"En continuant l'inscription, je déclare accepter ces conditions d'utilisations ",
style: TextStyle(color: Colors.white),
),
),
],
),
),
),
//************ next work
Container(
width: 200,
height: 60,
margin: EdgeInsets.only(right: 8.0,bottom: 8.0),
alignment: Alignment.center,
child: new Row(
children: <Widget>[
Button_with_icon(
backgroundColor: Color(0xFF7CB342),
textColor: Colors.white,
textButton: "Continuer",
onPressed: (){
if(_formKey.currentState.validate()){
print("say l3adab");
}
},
icon: Icon(Icons.arrow_forward_ios),
),
],
)
),
],
),
)),
),
)
),
);
2个回答
0
投票
投票
将列子项放在singlechildscrollview上，然后为每个表单元素创建一行，并将它们放在展开的小部件中
SingleChildScrollView(
physics: BouncingScrollPhysics(),
child: Material(
elevation: 0,
child: Container(
padding: EdgeInsets.all(16),
child: Column(
children: <Widget>[
Column(
children: <Widget>[
Form(
onChanged: () {
_tcFormKey.currentState.validate();
if (_tcController.text.length != 11) {
setState(() {
tcValidated = false;
});
}
},
key: _tcFormKey,
child: TextFormField(
controller: _tcController,
maxLength: 11,
inputFormatters: <TextInputFormatter>[
WhitelistingTextInputFormatter.digitsOnly,
],
validator: (String value) {
if (value.isEmpty) {
return 'Zorunlu alan';
}
if (value.length != 11) {
return 'Kimlik numarası 11 haneli olmalıdır';
}
if (value.length == 11 && !Functions.validateTC(value.toString())) {
return 'Hatalı TC. Kimlik No';
} else {
setState(() {
tcValidated = true;
});
}
},
keyboardType: TextInputType.numberWithOptions(),
decoration: InputDecoration(
counterText: '',
suffixIcon: tcValidated
? Icon(
Icons.check,
color: Colors.green,
)
: Text(''),
labelText: 'TC Kimlik No',
border: OutlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 1),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.black26, width: 1),
),
),
),
),
SizedBox(
height: 12,
),
Form(
onChanged: () {
_uavtFormKey.currentState.validate();
},
key: _uavtFormKey,
child: TextFormField(
controller: _uavtController,
maxLength: 11,
inputFormatters: <TextInputFormatter>[WhitelistingTextInputFormatter.digitsOnly],
validator: (String value) {
if (value.isEmpty) {
return 'Zorunlu alan';
}
},
keyboardType: TextInputType.numberWithOptions(),
decoration: InputDecoration(
labelText: 'UAVT Adres Kodu',
suffixIcon: Icon(Icons.location_on),
counterText: '',
border: OutlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 1),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.black26, width: 1),
),
),
),
),
SizedBox(
height: 12,
),
Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
mainAxisSize: MainAxisSize.max,
children: <Widget>[
Expanded(
child: Form(
onChanged: () {
_adFormKey.currentState.validate();
},
key: _adFormKey,
child: TextFormField(
controller: _adController,
maxLength: 64,
validator: (String value) {
if (value.isEmpty) {
return 'Zorunlu alan';
}
},
inputFormatters: [
WhitelistingTextInputFormatter(
RegExp("[a-zA-ZĞğÜüÖöŞşçÇİı]"),
),
],
decoration: InputDecoration(
labelText: 'Ad',
counterText: '',
border: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.blue,
width: 1,
),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.black26,
width: 1,
),
),
),
),
),
),
SizedBox(
width: 8,
),
Expanded(
child: Form(
onChanged: () {
_soyadFormKey.currentState.validate();
},
key: _soyadFormKey,
child: TextFormField(
controller: _soyadController,
maxLength: 64,
validator: (String value) {
if (value.isEmpty) {
return 'Zorunlu alan';
}
},
inputFormatters: [
WhitelistingTextInputFormatter(
RegExp("[a-zA-ZĞğÜüÖöŞşçÇİı]"),
),
],
decoration: InputDecoration(
labelText: 'Soyad',
counterText: '',
border: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.blue,
width: 1,
),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.black26,
width: 1,
),
),
),
),
),
),
],
),
SizedBox(
height: 12,
),
Form(
onChanged: () {
_telFormKey.currentState.validate();
},
key: _telFormKey,
child: TextFormField(
controller: _telController,
maxLength: 10,
validator: (String val) {
if (val.isEmpty) {
return 'Zorunlu alan';
}
},
inputFormatters: <TextInputFormatter>[
WhitelistingTextInputFormatter.digitsOnly,
],
keyboardType: TextInputType.numberWithOptions(),
decoration: InputDecoration(
errorStyle: TextStyle(color: Colors.red),
hintText: '10 Haneli Telefon Numarası',
labelText: 'Telefon Numarası',
hintStyle: TextStyle(color: Colors.black38),
suffixIcon: Icon(Icons.phone_iphone),
counterText: '',
border: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.blue,
width: 1,
),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(
color: Colors.black26,
width: 1,
),
),
),
),
),
SizedBox(
height: 12,
),
OutlineButton(
highlightColor: Colors.transparent,
splashColor: Colors.blue.shade50,
shape: BeveledRectangleBorder(borderRadius: BorderRadius.circular(2)),
borderSide: BorderSide(color: !emptyDateError ? Colors.black26 : Colors.red),
onPressed: () {
selectedBDate = '';
DatePicker.showDatePicker(context,
showTitleActions: true,
minTime: DateTime(1910, 1, 1),
maxTime: DateTime.now(),
onChanged: (date) {}, onConfirm: (date) {
int y = int.parse(DateFormat.y().format(date));
int m = int.parse(DateFormat.M().format(date));
int d = int.parse(DateFormat.d().format(date));
setState(() {
selectedBDate = '$y-$m-$d';
emptyDateError = false;
});
print('confirm $date');
}, currentTime: DateTime.now(), locale: LocaleType.tr);
},
child: Padding(
padding: const EdgeInsets.only(left: 2, right: 2, top: 16, bottom: 16),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Expanded(
child: Row(
children: <Widget>[
Icon(Icons.calendar_today, size: 16,),
Padding(
padding: const EdgeInsets.only(top: 2),
child: Text(
' Doğum Tarihi',
style: TextStyle(fontSize: 15),
),
),
],
),
),
selectedBDate != ''
? Expanded(
child: Align(
alignment: Alignment.centerRight,
child: Text('$selectedBDate'),
),
)
: emptyDateError
? Expanded(
child: Align(
alignment: Alignment.centerRight,
child: Text(
'Zorunlu Alan',
style: TextStyle(color: Colors.red),
),
),
)
: Container(),
],
),
),
),
SizedBox(
height: 12,
),
Form(
onChanged: () {
_mailFormKey.currentState.validate();
},
key: _mailFormKey,
child: TextFormField(
controller: _mailController,
validator: (String val) {
if (val.isEmpty) {
return 'Zorunlu alan';
}
if(!Functions.isEmail(val)){
return 'Geçerli bir mail adresi belirtiniz';
}
},
decoration: InputDecoration(
suffixIcon: Icon(Icons.mail_outline),
labelText: 'Mail Adresi',
border: OutlineInputBorder(
borderSide: BorderSide(color: Colors.blue, width: 1),
),
enabledBorder: OutlineInputBorder(
borderSide: BorderSide(color: Colors.black26, width: 1),
),
),
),
),
SizedBox(
height: 12,
),
Material(
elevation: 8,
shadowColor: Colors.green,
borderRadius: BorderRadius.circular(4),
color: Colors.green,
child: InkWell(
onTap: () {
if (_tcController.text != '' &&
_uavtController.text != '' &&
_adController.text != '' &&
_soyadController.text != '' &&
_telController.text != '' &&
_mailController.text != '' &&
selectedBDate != '' &&
Functions.validateTC(_tcController.text)) {
_tcFormKey.currentState.validate();
_uavtFormKey.currentState.validate();
_adFormKey.currentState.validate();
_soyadFormKey.currentState.validate();
_telFormKey.currentState.validate();
_mailFormKey.currentState.validate();
print(_telController.text.length);
var oprt = _telController.text.trim().split(' ')[0];
oprt = oprt.replaceAll('(', '');
oprt = oprt.replaceAll(')', '');
print(oprt);
_pageController.nextPage(duration: Duration(milliseconds: 300), curve: Curves.ease);
} else {
if (selectedBDate == '') {
setState(() {
emptyDateError = true;
});
}
_tcFormKey.currentState.validate();
_uavtFormKey.currentState.validate();
_adFormKey.currentState.validate();
_soyadFormKey.currentState.validate();
_telFormKey.currentState.validate();
_mailFormKey.currentState.validate();
}
},
child: Container(
width: double.infinity,
height: 48,
child: Center(
child: Row(
mainAxisAlignment: MainAxisAlignment.center,
children: <Widget>[
Text(
'İlerle ',
textAlign: TextAlign.center,
style: TextStyle(color: Colors.white, fontSize: 18),
),
Icon(
Icons.arrow_forward,
color: Colors.white,
),
],
),
),
),
),
),
],
),
],
),
),
),
),
0
投票
投票
问题只是在我的表单中使用扩展，所以我删除并删除了我给容器的高度和宽度：
@override
Widget build(BuildContext context) {
return SafeArea(
child: Scaffold(
body: SingleChildScrollView(
child: Center (
child: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.topLeft,
end: Alignment.bottomRight,
colors: [const Color(0xFF3023AE), const Color(0xFFC86DD7)])),
child: Form(
key: _formKey,
child: Column(
children: <Widget>[
Padding(
padding: const EdgeInsets.only(top: 70.0, bottom: 20.0),
child: Text(
"C'est parti !",
style: TextStyle(fontSize: 32, color: Colors.white),
),
),
Padding(
padding: const EdgeInsets.only(bottom: 8.0),
child: Container(
width: width_textFormField + 15.0,
child: Text(
" Avant de commencer, sache que pour utiliser pleinement ta BanKids tu devras demander à tes parents de s'inscrire pour te débloquer toutes les fonctionnalités",
style: TextStyle(
fontSize: 14,
color: Colors.white,
),
textAlign: TextAlign.center,
)),
),
Container(
alignment: Alignment.center,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
crossAxisAlignment: CrossAxisAlignment.center,
children: <Widget>[
Container(
child: Text(
"Client Bank ?",
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white),
),
),
Container(
child: Row(
children: <Widget>[
Text(
"Oui",
style: TextStyle(color: Colors.white),
),
Radio(
value: 1,
activeColor: Colors.white,
groupValue: _grpVal,
onChanged: _handleRadioValueChange1,
),
],
)),
Container(
child: Row(
children: <Widget>[
Text(
"Non",
style: TextStyle(
fontWeight: FontWeight.bold,
color: Colors.white),
),
Radio(
activeColor: Colors.white,
value: 2,
groupValue: _grpVal,
onChanged: _handleRadioValueChange1,
),
],
)),
],
)),
Container(
child: Column(
children: <Widget>[
customizedTextFormField(
hintText: "Nom",
width: width_textFormField + 10.0,
txtColor: Colors.black),
customizedTextFormField(
hintText: "Prénom",
width: width_textFormField + 10.0,
txtColor: Colors.black),
customizedTextFormField(
hintText: "Date de Naissance",
width: width_textFormField + 10.0,
txtColor: Colors.black),
customizedTextFormField(
hintText: "CIN",
width: width_textFormField + 10.0,
txtColor: Colors.black),
customizedTextFormField(
hintText: "Email",
width: width_textFormField + 10.0,
txtColor: Colors.black)
],
),
),
Padding(
padding: const EdgeInsets.only(top: 8.0),
child: Container(
width: width_textFormField,
child: Row(
children: <Widget>[
Checkbox(
checkColor: Color(0xFF3023AE),
value: isCheck,
activeColor: Colors.white,
onChanged: _handleCheckBox,
),
Expanded(
child: Text(
"En continuant l'inscription, je déclare accepter ces conditions d'utilisations ",
style: TextStyle(color: Colors.white),
),
),
],
),
),
),
//************ next work
Container(
width: 200,
height: 60,
margin: EdgeInsets.only(right: 8.0,bottom: 8.0),
alignment: Alignment.center,
child: new Row(
children: <Widget>[
Button_with_icon(
backgroundColor: Color(0xFF7CB342),
textColor: Colors.white,
textButton: "Continuer",
onPressed: (){
if(_formKey.currentState.validate()){
print("say l3adab");
}
},
icon: Icon(Icons.arrow_forward_ios),
),
],
)
),
],
),
)),
),
)
),
);
最新问题
- PySimpleGUI 需要添加对事件 == WIN_CLOSED 错误的检查
- AWS CDK：如何将 CDK 上下文变量传递给 C# Lambda 启动代码
- 访问 EC2 实例上的前端服务器
- chrome.bookmarks.onChildrenReordered 何时被触发？
- 将 IConfiguration 注入模型类是错误的吗？ [重复]
- 带有 EF Core 8 发件箱的 NServiceBus 8
- Hibernate（Spring Boot）中 Map<Enum, Entity> 上的 OneToMany 创建唯一约束？
- 在没有实体的文件中进行 Hibernate 本机查询
- brainfuck 中的 Divmod 算法
- 从 Rails 发送数据以在 JSON 模式中进行验证
- Google AI Platform：副本主服务器 0 以非零状态 127 退出
- 闪亮的 htmlTemplate 未正确链接到 css 表
- 如何定义命名函数的类型？
- 寻求图像路径优化算法帮助
- 在遍历之外如何使用 select？ Groovy Gremlin 与 Nodejs Gremlin
- 在脚本中使用公式
- 如何访问用 Xcode 编写的命令行工具
- Matplotlib：如何调整 x 轴和第一个水平条之间的间距
- 定位除 terraform 中的资源之外的所有资源（与“-target”参数相反）
- 我想要一个 mathjax 表达式，例如 sin{(x+y)} 以在 A 框架环境中显示
© www.soinside.com 2019 - 2024. All rights reserved.