flutter - 将默认 TextFormField 图标颜色从灰色更改为任何颜色，但在选择时显示原色

Question

我想更改 TextFormField 图标的默认颜色，这也会在选择时发生变化。改变颜色的方法很少，但没有一个对我有用。

1. Set icon color

当直接更改图标颜色时，如下所示，选择时图标颜色不会改变，下面是相同的代码和屏幕截图，当选择或未选择字段时显示红色。

     TextFormField(
        maxLength: 15,
        decoration: InputDecoration(
          labelText: "USER NAME",
          prefixIcon: IconTheme(data: IconThemeData(
            color: Colors.redAccent
          ), child: Icon(Icons.email,))
        ),
        onSaved: (username) => _username = username,
      ),

2. Leave it default

未选择字段时将显示灰色，选择字段时将显示原色。下面是相同的屏幕截图。在这里，我想将图标的颜色从灰色更改为红色，并希望在选择时显示原色。

NOTE:- It will be good if we can do this using theme

Answer 1

下面的代码将生成您需要管理 TextFormFields 焦点的 FocusNodes ，并在焦点从 1 改变时执行 setState领域到另一个领域。我们只是创建一个焦点节点列表，监听每个节点的变化并将它们分配给一个字段:

List<FocusNode> _focusNodes = [
  FocusNode(),
  FocusNode(),
  FocusNode(),
  FocusNode(),
];

@override
void initState() {
  _focusNodes.forEach((node){
    node.addListener(() {
      setState(() {});
    });
  });
  super.initState();
}

@override
Widget build(BuildContext context) {
  return Column(
    children: <Widget>[
      TextFormField(
        focusNode: _focusNodes[0],
        decoration: InputDecoration(
          prefixIcon: Icon(Icons.email,
            color: _focusNodes[0].hasFocus ? Theme.of(context).accentColor : Colors.grey,
          ),
        ),
      ),
      TextFormField(
        focusNode: _focusNodes[1],
        decoration: InputDecoration(
          prefixIcon: Icon(Icons.email,
            color: _focusNodes[1].hasFocus ? Theme.of(context).accentColor : Colors.grey,
          ),
        ),
      ),
      TextFormField(
        focusNode: _focusNodes[2],
        decoration: InputDecoration(
          prefixIcon: Icon(Icons.email,
            color: _focusNodes[2].hasFocus ? Theme.of(context).accentColor : Colors.grey,
          ),
        ),
      ),
    ],
  );
}