Change TextField Text Color in Flutter 

by
Change TextField Text Color in Flutter 
 

Widget TextField is the most widely used widget in the flutter for getting input from users. Sometimes there is a UI requirement to match the Text color of the textField according to the App theme. So in this Quick Fix, I covered Change TextField Text Color in Flutter .

Change TextField Text Color in Flutter  Steps:

  • Locate the TextField where to change
  • add The Style property with TextStyle()
  • Now just Add a color property in TextStyle
  • Here is the full Code Below
TextField(
  style: TextStyle(color: Colors.green),  //<-- HERE
),

If this change needs to be done at a global level which means on the entire app here are the steps for that one as well.

TextField Text Color Globally in Flutter  Steps:

  • Go to the main file and find MaterialApp()
  • Add theme parameter with ThemeData()
  • Inside ThemeData() use Property inputDecorationTheme:
  • Add InputDecorationTheme() inside of it add TextTheme() to textTheme:
  • In TextTheme() add subtitle1: property and add TextStyle().
  • Again, TextStyle() contains color property add the required color
  • Here is the Code below
MaterialApp(
  title: 'Flutter Demo',
  theme: ThemeData(
    inputDecorationTheme: const InputDecorationTheme(
    textTheme:
        TextTheme(
      subtitle1: TextStyle(color: Colors.pinkAccent), //<-- SEE HERE
    ),
  ),
  home: HomeWidget(),
);

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

Remember FlutterDecode.com

Leave a Comment