Errortext property of InputDecorator causes padding

[Mr harilall]

I have two text inputs in the same row (refer to images), when the errortext property of the inputdecorator is shown it causes the text field to get padding somehow and pop out of place, even the label moves its position. I have read a few posts on this issue and have tried their recommendations of giving the container a fixed size, putting it into a sizedBox etc but none of the solutions worked can someone give me a suggestion.

here's my code for the row that the text fields are in

Container(
                        margin: EdgeInsets.fromLTRB(15, 0, 15, 0),
                        child: Row(
                          children: <Widget>[
                            Expanded(
                              flex: 1,
                              child: FormField<String>(
                                builder: (FormFieldState<String> state) {
                                  return InputDecorator(
                                    decoration: InputDecoration(
                                      errorStyle: TextStyle(
                                        color: Colors.redAccent,
                                        fontSize: 16.0,
                                      ),
                                      labelText: "Year :",
                                      labelStyle: TextStyle(
                                        color: Colors.black,
                                        fontWeight: FontWeight.bold,
                                        fontSize: 18,
                                      ),
                                      fillColor: Colors.white,
                                      filled: true,
                                      contentPadding: EdgeInsets.all(15),
                                      enabledBorder: OutlineInputBorder(
                                        borderSide: BorderSide(
                                          color: Colors.grey,
                                          style: BorderStyle.solid,
                                          width: 1,
                                        ),
                                      ),
                                      errorText: (!showYearError) ? null : _enteredYearValidation(),
                                    ),
                                    child: TextFormField(
                                      autocorrect: false,
                                      controller: yearTextController,  
                                      keyboardType: TextInputType.number,
                                      decoration: InputDecoration.collapsed(
                                        hintText: " ",
                                      ),
                                    ),
                                );
                              },
                            )),
                            SizedBox(
                              width: 12,
                            ),
                            Expanded(
                              flex: 1,
                              child: FormField<String>(
                                builder: (FormFieldState<String> state) {
                                  return InputDecorator(
                                    decoration: InputDecoration(  
                                      errorStyle: TextStyle(
                                        color: Colors.redAccent,
                                        fontSize: 16.0
                                      ),
                                      labelText: "Mileage  :",
                                      labelStyle: TextStyle(
                                        color: Colors.black,
                                        fontWeight: FontWeight.bold,
                                        fontSize: 18,
                                      ),
                                      fillColor: Colors.white,
                                      filled: true,
                                      hintText: 'Please select expense',  
                                      contentPadding: EdgeInsets.all(15),
                                      enabledBorder: OutlineInputBorder(
                                        borderSide: BorderSide(
                                          color: Colors.grey,
                                          style: BorderStyle.solid,
                                          width: 1,
                                        ),
                                      ),
                                    ),
                                    child: TextFormField(
                                      autocorrect: false,
                                      keyboardType: TextInputType.number,
                                      decoration: InputDecoration.collapsed(
                                        hintText: "",
                                      ),
                                    ),
                                );
                              },
                            )),
                          ],
                        ),
                      ),

[Justin McCandless]

You can use an empty helperText to give a TextField the same layout as if it had an error.  You might need to play with this idea a bit since your code is more complicated, but here is a simple example: https://dartpad.dartlang.org/95873672e387a494402c9c7d248f458b

Justin

--
You received this message because you are subscribed to the Google Groups "Flutter Development (flutter-dev)" group.
To unsubscribe from this group and stop receiving emails from it, send an email to flutter-dev...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/flutter-dev/223fd01c-1c27-4528-bd63-170d351a1c84%40googlegroups.com.