Flutter 如何像TabBar一样更改图标按钮的颜色？

我想在Appbar标题旁边而不是下方有一个选项卡，但我无法在“操作”中添加选项卡。所以我做了一排图标按钮。 我的图标按钮的目的是更改GridView的crossAxisCount编号。 我的目标是更改选定图标按钮的颜色：

导入“包装：颤振/材料.省道”；
类TestingPage扩展StatefulWidget{
@凌驾
_TestingPageState createState（）=>\u TestingPageState（）；
}
类_TestingPageState扩展状态{
int gridNumber=3；
bool-isSelected=true；
@凌驾
小部件构建（构建上下文）{
返回DefaultTabController(
长度：2，
孩子：脚手架(
背景颜色：Colors.white，
appBar:appBar(
背景颜色：颜色。灰色，
标题：文本（“主页”），
标题：对，
行动：[
图标按钮(
图标：图标(
Icons.format_align_left，
颜色：isSelected？颜色。青色强调：颜色。白色，
),
已按下：（）{
设置状态（）{
gridNumber=3；
isSelected=true；
});
},
),
图标按钮(
图标：图标(
Icons.format_align_center，
颜色：isSelected？颜色。青色强调：颜色。白色，
),
已按下：（）{
设置状态（）{
gridNumber=1；
isSelected=true；
});
},
),
图标按钮(
图标：图标(
Icons.format_align_right，
颜色：isSelected？颜色。青色强调：颜色。白色，
),
已按下：（）{
设置状态（）{
网格数=5；
isSelected=true；
});
},
),
],
底部：选项卡栏(
选项卡：[
标签(
图标：图标(
图标、方向和汽车，
),
子项：文本（“第一个选项卡”），
),
标签(
图标：图标(
图标。方向和交通工具，
),
子项：文本（“第二个选项卡”），
),
],
),
),
正文：选项卡视图(
儿童：[
GridView.count(
crossAxisCount:gridNumber，
儿童：[
容器（颜色：Colors.red，高度：150.0），
容器（颜色：Colors.purple，高度：150.0），
容器（颜色：Colors.green，高度：150.0），
容器（颜色：Colors.orange，高度：150.0），
容器（颜色：Colors.yellow，高度：150.0），
容器（颜色：Colors.pink，高度：150.0），
容器（颜色：Colors.cyan，高度：150.0），
容器（颜色：Colors.indigo，高度：150.0），
容器（颜色：Colors.blue，高度：150.0），
],
),
容器（），
],
),
),
);
}
}

您将在上面的代码中看到，我的颜色会根据bool“isSelected”而改变，但这会改变所有图标按钮的颜色。因此，我尝试为每个按钮设置不同的变量，如下所示：

bool colorOne = true;
bool colorTwo, colorThree = false;

actions: <Widget>[
            IconButton(
              icon: Icon(
                Icons.format_align_left,
                color: colorOne ? Colors.cyanAccent : Colors.white,
              ),
              onPressed: () {
                setState(() {
                  gridNumber = 3;
                  colorOne = true;
                  colorTwo = false;
                  colorThree = false;
                });
              },
            ),
            IconButton(
              icon: Icon(
                Icons.format_align_center,
                color: colorTwo ? Colors.cyanAccent : Colors.white,
              ),
              onPressed: () {
                setState(() {
                  gridNumber = 1;
                  colorOne = false;
                  colorTwo = true;
                  colorThree = false;
                });
              },
            ),
            IconButton(
              icon: Icon(
                Icons.format_align_right,
                color: colorThree ? Colors.cyanAccent : Colors.white,
              ),
              onPressed: () {
                setState(() {
                  gridNumber = 5;
                  colorOne = false;
                  colorTwo = false;
                  colorThree = true;
                });
              },
            ),
          ],

<Widget>[
        IconButton(
          icon: Icon(
            Icons.format_align_left,
            color: selectedIndex == 1 ? Colors.cyanAccent : Colors.white,
          ),
          onPressed: () {
            setState(() {
              gridNumber = 3;
              selectedIndex = 1;
            });
          },
        ),
        IconButton(
          icon: Icon(
            Icons.format_align_center,
            color: selectedIndex == 2 ? Colors.cyanAccent : Colors.white,
          ),
          onPressed: () {
            setState(() {
              gridNumber = 1;
              selectedIndex = 2;
            });
          },
        ),
        IconButton(
          icon: Icon(
            Icons.format_align_right,
            color: selectedIndex == 3 ? Colors.cyanAccent : Colors.white,
          ),
          onPressed: () {
            setState(() {
              gridNumber = 5;
              selectedIndex = 3;
            });
          },
        ),
     ],

bool colorOne=true；
布尔色二，色三=假；
行动：[
图标按钮(
图标：图标(
Icons.format_align_left，
颜色：colorOne？颜色。青色强调：颜色。白色，
),
已按下：（）{
设置状态（）{
gridNumber=3；
colorOne=真；
颜色二=假；
颜色三=假；
});
},
),
图标按钮(
图标：图标(
Icons.format_align_center，
颜色：colorTwo？颜色。青色口音：颜色。白色，
),
已按下：（）{
设置状态（）{
gridNumber=1；
colorOne=false；
colorTwo=真；
颜色三=假；
});
},
),
图标按钮(
图标：图标(
Icons.format_align_right，
颜色：colorThree？颜色。青色口音：颜色。白色，
),
已按下：（）{
设置状态（）{
网格数=5；
colorOne=false；
颜色二=假；
颜色三=真；
});
},
),
],

但当我这样做时，我会得到以下错误：

---

“断言失败：布尔表达式不能为null”

发生此问题的原因是，

colorTwo

未初始化，默认为null。您必须更改您的声明，如：

bool colorTwo = false, colorThree = false;

我想建议，不要使用3个不同的布尔值，而是使用一个整数来保持选中的按钮索引（不会说这是最好的方法，但比保持3个不同的变量要好）

更改按钮如下：

bool colorOne = true;
bool colorTwo, colorThree = false;

actions: <Widget>[
            IconButton(
              icon: Icon(
                Icons.format_align_left,
                color: colorOne ? Colors.cyanAccent : Colors.white,
              ),
              onPressed: () {
                setState(() {
                  gridNumber = 3;
                  colorOne = true;
                  colorTwo = false;
                  colorThree = false;
                });
              },
            ),
            IconButton(
              icon: Icon(
                Icons.format_align_center,
                color: colorTwo ? Colors.cyanAccent : Colors.white,
              ),
              onPressed: () {
                setState(() {
                  gridNumber = 1;
                  colorOne = false;
                  colorTwo = true;
                  colorThree = false;
                });
              },
            ),
            IconButton(
              icon: Icon(
                Icons.format_align_right,
                color: colorThree ? Colors.cyanAccent : Colors.white,
              ),
              onPressed: () {
                setState(() {
                  gridNumber = 5;
                  colorOne = false;
                  colorTwo = false;
                  colorThree = true;
                });
              },
            ),
          ],

<Widget>[
        IconButton(
          icon: Icon(
            Icons.format_align_left,
            color: selectedIndex == 1 ? Colors.cyanAccent : Colors.white,
          ),
          onPressed: () {
            setState(() {
              gridNumber = 3;
              selectedIndex = 1;
            });
          },
        ),
        IconButton(
          icon: Icon(
            Icons.format_align_center,
            color: selectedIndex == 2 ? Colors.cyanAccent : Colors.white,
          ),
          onPressed: () {
            setState(() {
              gridNumber = 1;
              selectedIndex = 2;
            });
          },
        ),
        IconButton(
          icon: Icon(
            Icons.format_align_right,
            color: selectedIndex == 3 ? Colors.cyanAccent : Colors.white,
          ),
          onPressed: () {
            setState(() {
              gridNumber = 5;
              selectedIndex = 3;
            });
          },
        ),
     ],

[
图标按钮(
图标：图标(
Icons.format_align_left，
颜色：selectedIndex==1？颜色。青色强调：颜色。白色，
),
已按下：（）{
设置状态（）{
gridNumber=3；
selectedIndex=1；
});
},
),
图标按钮(
图标：图标(
Icons.format_align_center，
颜色：selectedIndex==2？颜色。青色强调：颜色。白色，
),
已按下：（）{
设置状态（）{
gridNumber=1；
选择指数=2；
});