Flutter aumenta la altura de TextFormField

Estoy creando una aplicación Flutter. Hice el diseño así.

Mi campo de formulario TextFormField para alturas de correo electrónico y contraseña es pequeño. Quiero que sea del mismo tamaño que el botón.

final email = TextFormField(
    keyboardType: TextInputType.emailAddress,
    autofocus: false,
    initialValue: 'sathyabaman@gmail.com', 
    style: new TextStyle(fontWeight: FontWeight.normal, color: Colors.white),
    decoration: InputDecoration(
      hintText: 'Email', 
      contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
      border: OutlineInputBorder(
        borderRadius: BorderRadius.circular(32.0)
      ),
    ),
  );

¿Cuál es la sintaxis para la altura en el campo de formulario de texto?

Simplemente ajuste el contentPadding en InputDecoration.

final email = TextFormField(
    keyboardType: TextInputType.emailAddress,
    autofocus: false,
    initialValue: 'sathyabaman@gmail.com',
    style: new TextStyle(fontWeight: FontWeight.normal, color: Colors.white),
    decoration: InputDecoration(
      hintText: 'Email',
      contentPadding: const EdgeInsets.symmetric(vertical: 25.0, horizontal: 10.0),
      border: OutlineInputBorder(borderRadius: BorderRadius.circular(32.0)),
    ),
  );

Puede cambiar la altura cambiando el valor de minLines, solo intente esto

               TextFormField(
                           keyboardType: TextInputType.multiline,
                           controller: _opTextController,
                           decoration: InputDecoration(
                               isDense: true,
                             border: OutlineInputBorder(
                               borderSide: BorderSide(color: Colors.black)
                             )

                           ),
                           maxLines: 5,
                           minLines: 3,
                           // controller: cpfcontroller,
                         )

Utilice estas dos líneas para controlar TextFormField Altura interior InputDecoration .

isDense: true, 
contentPadding: EdgeInsets.fromLTRB(10, 10, 10, 0),

Ejemplo completo

Material(
                elevation: 4,
                shadowColor: Colors.blue,
                shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(10)),
                child: Padding(
                  padding: const EdgeInsets.only(left: 12),
                  child: TextFormField(
                    controller: searchProvider.searchController,
                    keyboardType: TextInputType.text,
                    decoration: InputDecoration(
                        hintText: 'hintText',
                        isDense: true, // important line
                        contentPadding: EdgeInsets.fromLTRB(10, 10, 10, 0),// control your hints text size
                        hintStyle: TextStyle(letterSpacing: 2, color: Colors.black54, fontWeight: FontWeight.bold),
                        fillColor:  Colors.white30 ,
                        filled: true,
                        border: OutlineInputBorder(borderRadius: BorderRadius.circular(30), borderSide: BorderSide.none)),
                  ),
                ),
              ),

Selecciona el expands atributo en TextFormField ser true entonces pon TextFormField en un SizedBox con un height

SizedBox(
   height: 40.0,
   child: TextFormField(
    keyboardType: TextInputType.emailAddress,
    autofocus: false,
    expands: true, // Setting this attribute to true does the trick
    initialValue: 'sathyabaman@gmail.com', 
    style: TextStyle(fontWeight: FontWeight.normal, color: Colors.white),
    decoration: InputDecoration(
      hintText: 'Email', 
      contentPadding: EdgeInsets.fromLTRB(20.0, 10.0, 20.0, 10.0),
      border: OutlineInputBorder(
        borderRadius: BorderRadius.circular(32.0)
      ),
    ),
  ),
)

Puede usar este código para personalizar su TextFormField

new SizedBox(
  width: 200.0,
  height: 300.0,
  child: const Card(child: const Text('Hello World!')),
)

Existe otra alternativa a la adición de relleno extra permanente para cubrir el errorText – lo que probablemente estropearía el proyecto original de muchos diseñadores.

Podrías crear una versión modificada del fuentes TextFormField.

Para lograr precisamente eso, puede:

1. Copie y pegue todo el contenido en el fuentes TextFormField.
2. Renombra tu personalizado TextFormField solo para evitar conflictos de nombres con el original.
   • Probablemente también debería cambiar el nombre de la clase de estado interno.
   • En VS Code, puede usar Control + H para reemplazar TextFormField por decir, TextFormFieldWithErrorTextOption.
3. Agregar otro parámetro a la TextFormFieldconstructor de (abajo esta línea), decir, errorTextPresent:

   // `true` is the current implicit default, i.e., showing the `errorText`
   bool errorTextPresent = true 
   

4. Cambiar el inicialización de la decoración para el interior TextField:
   1. De:

      decoration: effectiveDecoration.copyWith(field.errorText)
      

   2. A:

      decoration: effectiveDecoration.copyWith(
          errorText: errorTextPresent ? field.errorText : null)
      

5. Luego, puede usar su nuevo TextFormField de manera similar a cómo usa cualquier TextFormField:

   TextFormFieldWithErrorTextOption(
     errorTextPresent: false, // `false` will disable the `errorText`
     ...
   ),
   

Captura de pantalla:

Código:

Necesitas usar un SizedBox y TextField.maxLines propiedad.

@override
Widget build(BuildContext context) {
  final height = 100.0;
  return Scaffold(
    body: SizedBox( // <--- SizedBox
      height: height,
      child: TextField(
        cursorColor: Colors.red,
        maxLines: height ~/ 20,  // <--- maxLines
        decoration: InputDecoration(
          filled: true,
          hintText: 'Hint text',
          fillColor: Colors.grey,
        ),
      ),
    ),
  );
}