Hide Remove TextField Text Input Bottom Underline in Flutter

TextField widget has a property decoration which has a sub property border: InputBorder.none .This property would Remove TextField Text Input Bottom Underline in Flutter Android iOS mobile app. The bottom underline shows us how much area in width Text Input is occupying on mobile screen.

Contents in this project Hide Remove TextField Text Input Bottom Underline in Flutter Android iOS App:

1. Import material.dart package in your app’s main.dart file.

2. Call our main MyApp class using void main runApp() method.

3. Create our main class named as MyApp extends with State less widget.

4. Create Scaffold widget in Widget build area with SafeArea widget and Center widget.

5. Create container widget in Center widget and put TextField widget in container widget.

  • border: InputBorder.none : Hide bottom underline from Text Input widget.

6. Complete source code for main.dart file:

Screenshot before hiding underline:

Screenshot After hiding underline:

Hide Remove TextField Text Input Bottom Underline in Flutter

Leave a Reply

Your email address will not be published.