Flutter - 多个图标改变了每个图标的颜色

Question

我的应用程序底部栏中有 4 个图标，我需要将图标的颜色从灰色更改为白色，我遵循了这个 question，但是当我按下任何图标时，所有图标同时改变了颜色，我需要按下例如（主页）图标时只需按下（主页）图标。

我该怎么做？

我怎样才能设置主页图标总是第一页而不按？ （我的意思是当用户打开应用程序时向他显示主页（白色图标）。

代码：

import 'package:flutter/material.dart';

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}

class _HomePageState extends State<HomePage> {

  _HomePageState();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
  }
  bool isPressed = false;

  _pressed() {
  var newVal = true;
  if(isPressed) {
    newVal = false;
  } else {
    newVal = true;
  }

  setState((){
  isPressed = newVal;
  });
}

@override
Widget build(BuildContext context) {
  return Scaffold(

    appBar: AppBar(
      title: Image.asset('assets/logo.png', fit: BoxFit.cover,),
      centerTitle: true,
      backgroundColor: Colors.grey[900],
    ),
    bottomNavigationBar: BottomAppBar(
      color: Colors.grey[900],
      child: Row(
        mainAxisSize: MainAxisSize.max,
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: <Widget>[
          IconButton(icon: Icon(Icons.info), color: isPressed ? Colors.white:Colors.grey[600], iconSize: 30, onPressed: () {
          setState(() {
            _pressed();
          });
        }),
          IconButton(icon: Icon(Icons.local_mall), color: isPressed ? Colors.white:Colors.grey[600], iconSize: 30, onPressed: () {
          setState(() {
            _pressed();
          });
        }),
          IconButton(icon: Icon(Icons.bookmark), color: isPressed ? Colors.white:Colors.grey[600], iconSize: 30, onPressed: () {
          setState(() {
            _pressed();
          });
        }),
          IconButton(icon: Icon(Icons.home), color: isPressed ? Colors.white:Colors.grey[600], iconSize: 30, onPressed: () {
          setState(() {
            _pressed();
          });
        }),
      ],
    ),
  ),

);
}
}

Answer 1

你可以这样做！确实是切换图标颜色的最佳技巧

   IconButton( icon:  ImageIcon(AssetImage("images/edit.png",) ,size: 30,),
                            disabledColor: Color.fromRGBO(32, 127, 195, 1),
                            color: Colors.white,
                            onPressed: a == 1
                                ? null
                                : () => setState(() => a = 1)),
 IconButton( icon:   ImageIcon(AssetImage("images/notify.png",) ,size: 30,),
                            disabledColor: Color.fromRGBO(32, 127, 195, 1),
                            color: Colors.white,
                            onPressed: a == 2
                                ? null
                                : () => setState(() {
                                      a = 2;
                                      dateTemp = '';
                                    })),

Answer 2

您为每个按钮使用相同的布尔变量。尝试使用整数索引（每个按钮 1-4，每次按下按钮都会设置状态，整数设置为其索引），然后在定义颜色时检查按下了哪个索引。