Flutter TextField 多行文本 文本域 点击区域只有一行问题,只有点击第一行才会弹出键盘
找了半天资料没找到,只能自己调试,幸好终于找出来了。
我定义的高度是350高度,正常我们需要的是 TextField 直接铺满整个350高度,但由于我设置了 minLines最小行是1,所以 TextField 没有跟多内容撑开就导致TextField 的点击区域只有一行。
在多行文本情况下
- minLines单独使用,不设置maxLines(默认是1),只要大于1就会报错
- maxLines单独使用,不设置minLines(默认是null),maxLines多少,点击区域就有多少行
- minLines和maxLines同时使用的话可以根据内容自适应最小行数到最高行数
解决办法就是不设置minLines,把maxLines设置大一点就行,根据实际情况调整就行。
代码
Widget getTextField({
TextEditingController controller,
TextInputType keyboardType: TextInputType.multiline,
TextInputAction textInputAction: TextInputAction.next,
FocusNode focusNode,
String hintText,
int length: 32,
}) {
return Container(
width: double.infinity,
padding: EdgeInsets.symmetric(
vertical: setWidth(10),
horizontal: setWidth(20),
),
height: setHeight(350),
alignment: Alignment.topCenter,
child: TextField(
controller: controller,
focusNode: focusNode,
maxLines: 20,
textInputAction: textInputAction,
keyboardType: keyboardType,
textAlign: TextAlign.left,
style: TextStyle(fontSize: setSp(26)),
inputFormatters: <TextInputFormatter>[
LengthLimitingTextInputFormatter(length),
],
decoration: InputDecoration(
hintText: hintText,
hintStyle: TextStyle(fontSize: setSp(26), color: XColors.textColor3),
isDense: true,
contentPadding: EdgeInsets.only(
left: setWidth(0),
top: setHeight(0),
bottom: setHeight(4),
right: setWidth(0),
),
border: InputBorder.none,
),
),
decoration: BoxDecoration(
color: XColors.dividerColor,
border: Border.all(color: XColors.grayColor2, width: setWidth(2)),
borderRadius: BorderRadius.circular(setWidth(10)),
),
);
}