Flutter-TextFormField展开无法正常工作

编程问答 2022-06-10

问题描述

我正在尝试创建自己的TextFieldForm，以通过特定的设计在我的应用中使用，如果遇到这种情况，在扩展它时会遇到一些麻烦。

当前看起来像这样：

enter image description here

但这实际上是这样的：

enter image description here

据我了解，为此，我应该将 展开 参数设置为 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,
dartflutter-layoutuitextfielduitextfielduitextfield