Flutter increase height of TextFormField

Question

I am creating a Flutter app. i made the design like this.

My TextFormField form field for email and password heights are small. I want it to be the same size of the bu

Answer 1

There's another alternative to adding extra, permanent padding to cover the errorText — which would probably mess up many designer's original project.

You could create a modified version of the source's TextFormField.

To achieve just that, you can:

1. Copy-paste all of the content in the source's TextFormField.
2. Rename your custom TextFormField just so you avoid naming conflicts with the original.
   • You should probably also rename the internal state class.
   • In VS Code, you can use Ctrl + H to replace TextFormField for, say, TextFormFieldWithErrorTextOption.
3. Add another parameter to the TextFormField's constructor (below this line), say, errorTextPresent:

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

4. Change the decoration's initialization for the internal TextField:
   1. From:

      decoration: effectiveDecoration.copyWith(field.errorText)
      

   2. To:

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

5. Then, you can use your new TextFormField similarly to how you use any TextFormField:

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