How To Change Input Text Color Using Flutter Android

admin_img Posted By Bajarangi soft , Posted On 27-11-2020

t looks like it's caused by the splash effect on the textfield. I couldn't find a way to disable it for that specific widget but you can make it Flutter textfield background color on focus. Ask Question Asked 1 year, 6 months ago. It works good, but when user tap on it, a grey color background appears.

How To Change Input Text Color Using Flutter Android

Change Input Text Color
Complete Code For  Change Input Text Color In Flutter
main.dart

import 'package:flutter/material.dart';
void main() => runApp(new MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: MyHomePage(),
    );
  }
}
class MyHomePage extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => MyHomePageState();
}

class MyHomePageState extends State<MyHomePage> {
  TextEditingController _textFieldController =
  TextEditingController(text: "Text In Input Field");
  List<Color> _colors = [
    Colors.orange,
    Colors.green,
    Colors.blue,
    Colors.brown,
    Colors.pink
  ];

  int _currentIndex = 0;

  _onChanged() {
    //update with a new color when the user taps button
    int _colorCount = _colors.length;

    setState(() {
      if (_currentIndex == _colorCount - 1) {
        _currentIndex = 0;
      } else {
        _currentIndex += 1;
      }
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: Colors.indigo[900],
        title: Text('Change Input Text Color'),
      ),
      body: Center(
        child: Column(
          children: <Widget>[
            Expanded(
              child: Center(
                child: Padding(
                  padding: EdgeInsets.symmetric(horizontal: 25.0),
                  child: TextField(
                    decoration: InputDecoration(
                      enabledBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.all(Radius.circular(12.0)),
                        borderSide: BorderSide(color: Colors.black26),
                      ),
                      focusedBorder: OutlineInputBorder(
                        borderRadius: BorderRadius.all(Radius.circular(12.0)),
                        borderSide: BorderSide(color: Colors.grey),
                      ),
                      contentPadding: EdgeInsets.all(15),
                    ),
                    controller: _textFieldController,
                    style: TextStyle(color: _colors[_currentIndex]),
                  ),
                ),
              ),
            ),
            RaisedButton(
              onPressed: _onChanged,
              child: Text("Change Color"),
              color: Colors.indigo[900],
              textColor: Colors.white,
            ),
            SizedBox(height: 12.0),
          ],
        ),
      ),
    );
  }
}

Related Post