Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to change TextFormField input text color in Flutter

Tags:

flutter

dart

Doing UI for a flutter app at uni, I just want the text typed into the TextFormField to be white. It seems unnecessarily difficult. I've tried googling etc but can't see an obvious answer.

  new Theme(     // this colors the underline     data: theme.copyWith(       primaryColor: Colors.white,       hintColor: Colors.transparent,      ),     child: new Padding(       padding: const EdgeInsets.fromLTRB(32.0, 40.0, 32.0, 4.0),       child: TextFormField(            key: Key('username'),           keyboardType: TextInputType.text,           controller: usernameController,           decoration: InputDecoration(                fillColor: Colors.black.withOpacity(0.6),               filled: true,               border: new OutlineInputBorder(                  borderRadius: const BorderRadius.all(                    const Radius.circular(8.0),                 ),                 borderSide: new BorderSide(                   color: Colors.transparent,                   width: 1.0,                 ),               ),               labelText: 'Username',               labelStyle:                   new TextStyle(color: Colors.white, fontSize: 16.0)),           style:               TextStyle(fontSize: 20.0, color: textTheme.button.color),           validator: validateUserName,           onSaved: (val) => this.loginFields._username = val),     ),   ), 
like image 219
poujo Avatar asked Oct 02 '18 07:10

poujo


People also ask

How do you change the text color in a string flutter?

Step 1: Locate the file where you have placed the Text widget. Step 2: Inside the Text widget, add the Style parameter and assign the TextStyle widget. Step 3: Inside the TextStyle widget, add the color parameter and set the color of your choice. For example, color: Colors.

How do you change the selected TextField color in flutter?

2021 answer If you are using a custom theme, you can define the textSelectionTheme and use the TextSelectionThemeData to define cursorColor and highlighted color to your liking.


2 Answers

This will do:

TextFormField(   style: TextStyle(color: Colors.white), ) 
like image 72
dshukertjr Avatar answered Sep 21 '22 12:09

dshukertjr


Puedes usar style: TextStyle

body: Center(     child: Column(         mainAxisAlignment: MainAxisAlignment.center,         children: <Widget>[             Form(                 key: _formKey,                 child: Column(                     crossAxisAlignment: CrossAxisAlignment.center,                     children: <Widget>[                         TextFormField(                             TextFormField(                                 controller: field,                                 style: TextStyle(fontSize: 18, color: Colors.red),                                 decoration: const InputDecoration(                                     contentPadding: const EdgeInsets.only(                                         left: 15,                                         top: 8,                                         right: 15,                                         bottom: 0                                     ),                                     hintText: 'name',                                 ),                                 validator: (value) {                                     if (value.isEmpty) {                                         return 'Please enter some text';                                     }                                     return null;                                 },                             ),                         )                     ]                 )             )         ]     ) ) 
like image 28
Jairo Rodriguez Avatar answered Sep 23 '22 12:09

Jairo Rodriguez