如何解决Flutter-TextFormField展开无法正常工作
我正在尝试创建自己的TextFieldForm,以通过特定的设计在我的应用中使用,如果遇到这种情况,在扩展它时会遇到一些麻烦。
当前看起来像这样:
但这实际上是这样的:
据我了解,为此,我应该将 展开 参数设置为 TRUE 和 maxLines 和 minLines 到 NULL 。
应该看起来像这样:
expands: this.expand,minLines: this.expand ? null : 1,maxLines: this.expand ? null : 1,
══╡ EXCEPTION CAUGHT BY RENDERING LIBRARY ╞═════════════════════════════════════════════════════════
The following assertion was thrown during performlayout():
BoxConstraints forces an infinite height.
These invalid constraints were provided to RenderCustomPaint's layout() function by the following
function,which probably computed the invalid constraints in question:
_Renderdecoration.performlayout (package:Flutter/src/material/input_decorator.dart:1298:17)
The offending constraints were:
BoxConstraints(w=289.8,h=Infinity)
我的自定义文本表单的CODE:
class CustomTextField extends StatelessWidget {
final String text;
final String helperText;
final double primaryFontSize;
final double secondaryFontSize;
final bool isPassword;
final String Function(String) validator;
final TextInputType keyboardType;
final bool expand;
String capitalize(String s) => s[0].toupperCase() + s.substring(1);
const CustomTextField({
@required this.text,this.primaryFontSize = 20,this.secondaryFontSize = 16,this.isPassword = false,this.validator,this.keyboardType = TextInputType.text,this.helperText,this.expand = false,});
@override
Widget build(BuildContext context) {
String _helperText = this.helperText ?? this.text;
return Column(children: [
TextFormField(
expands: this.expand,keyboardType: keyboardType,validator: validator,obscureText: isPassword,decoration: Inputdecoration(
errorStyle: TextStyle(
fontSize: secondaryFontSize,fontWeight: FontWeight.bold),border: InputBorder.none,hintText: capitalize(text),hintStyle: TextStyle(color: AppColor.fontColor),),style: new TextStyle(
fontSize: primaryFontSize,color: AppColor.fontColor,Row(
children: [
Expanded(
flex: 1,child: Divider(
color: AppColor.grayOutFontColor,thickness: 2,)),SizedBox(width: 10),Text(
_helperText,style: new TextStyle(
fontSize: secondaryFontSize,color: AppColor.grayOutFontColor,Expanded(
flex: 9,child: Divider(color: AppColor.grayOutFontColor,thickness: 2)),],mainAxisAlignment: MainAxisAlignment.start,)
]);
}
}
自定义文本表单字段的使用:
CustomTextField(
expand: true,text:
"British chef,restaurateur,write,television,personality,food city,and former footballer."
"Born in Johnston,Scotland.",primaryFontSize: correctPrimaryFontSize * 0.8,secondaryFontSize: correctSecondaryFontSize,helperText: "about you",keyboardType: TextInputType.multiline,
任何人都可以向我解释我做错了什么吗?还是我不明白 扩展 在做什么?
解决方法
将maxLines属性设置为空。
import 'package:flutter/material.dart';
class CustomTextField extends StatelessWidget {
final String text;
final String helperText;
final double primaryFontSize;
final double secondaryFontSize;
final bool isPassword;
final String Function(String) validator;
final TextInputType keyboardType;
String capitalize(String s) => s[0].toUpperCase() + s.substring(1);
const CustomTextField({
@required this.text,this.primaryFontSize = 20,this.secondaryFontSize = 16,this.isPassword = false,this.validator,this.keyboardType = TextInputType.text,this.helperText
});
@override
Widget build(BuildContext context) {
String _helperText = this.helperText ?? this.text;
return Column(children: [
TextFormField(
minLines: null,maxLines: null,keyboardType: keyboardType,validator: validator,obscureText: isPassword,decoration: InputDecoration(
errorStyle: TextStyle(
fontSize: secondaryFontSize,fontWeight: FontWeight.bold),border: InputBorder.none,hintText: capitalize(text),hintStyle: TextStyle(color: Colors.green),),style: new TextStyle(
fontSize: primaryFontSize,color: Colors.green,Row(
children: [
Expanded(
flex: 1,child: Divider(
color: Colors.grey,thickness: 2,)),SizedBox(width: 10),Text(
_helperText,style: new TextStyle(
fontSize: secondaryFontSize,color: Colors.grey,Expanded(
flex: 9,child: Divider(color: Colors.grey,thickness: 2)),],mainAxisAlignment: MainAxisAlignment.start,)
]);
}
}
使用自定义文本字段,如下所示:
CustomTextField(
text: "",helperText: "about you",keyboardType: TextInputType.multiline,
,
我通过添加名为“ expand”的参数找到了问题的答案,我正在检查该参数是否为真
0
完整代码为:
minLines: null,maxLines: !this.expand ? 1 : null,maxLength: !this.expand ? null : 200,
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。