close

flutter textfield background color on focus

by

Need to add textfield foundation tone on concentration in Flutter? It would appear that it’s brought about by the sprinkle impact on the textfield. I was unable to figure out how to debilitate it for that particular gadget yet you can make it straightforward by enveloping your TextField by a Theme gadget and setting the splashColor to straightforward:


Theme(
  data: Theme.of(context).copyWith(splashColor: Colors.transparent),
  child: TextField(
    autofocus: false,
    style: TextStyle(fontSize: 22.0, color: Color(0xFFbdc6cf)),
    decoration: InputDecoration(
      filled: true,
      fillColor: Colors.white,
      hintText: 'Username',
      contentPadding:
          const EdgeInsets.only(left: 14.0, bottom: 8.0, top: 8.0),
      focusedBorder: OutlineInputBorder(
        borderSide: BorderSide(color: Colors.white),
        borderRadius: BorderRadius.circular(25.7),
      ),
      enabledBorder: UnderlineInputBorder(
        borderSide: BorderSide(color: Colors.white),
        borderRadius: BorderRadius.circular(25.7),
      ),
    ),
  ),
);

Thanks for being with us on a Flutter Journey!!!

Leave a Comment