How to vertically Centre Align Text in TextField Flutter

Widget TextField is the most widely used widget in the flutter for getting input from users. Sometimes there is a UI requirement to align the textField text according to the App theme. So in this Quick Fix, we covered How to Vertically Centre Align Text in TextField Flutter

vertically Centre Align Text in TextField Flutter
vertically Centre Align Text in TextField Flutte

Vertically Centre Align Text in TextField Flutter

  • Find the text field where you want the change
  • Add the property textAlign:
  • Add value as textAlign: TextAlign.center
  • Simple, Full Code Below
TextField(
              textAlign: TextAlign.center, // <-- Main change here
              decoration: InputDecoration(
                border: InputBorder.none,
                hintText: "Centered Text",
                hintStyle: TextStyle(
                  color: Colors.grey.withOpacity(0.6),
                  fontSize: 12
                )
              ),
              onChanged: (text){

              },
            ),

I added some styling in this above code, according to my needs, but the main code there is textAlign:TextAlign.center, just copy the code and paste do some UI changes, and it’s good to go.


For more Flutter tutorials, Tips, Tricks, Free code, Questions, and Error Solving.

Remember FlutterDecode.com

Leave a Comment