如何在Flutter中动态更改文本的颜色？

Question

这是我应用的一小部分Next Milestone。

我通过对每个细节进行硬编码来做到这一点。但我想动态地实现这一目标。

问题是-如果我编码了一段时间，我将输入编码小时数，如果达到里程碑，则里程碑文本必须变为红色，而下一个里程碑必须变为绿色。

到目前为止，这是我的代码

我的里程碑列表

List milestoneList = [10, 25, 50, 100, 250, 500, 750, 1000];

将列表映射到小部件

Row(
     mainAxisAlignment: MainAxisAlignment.center,
     children: milestoneList.map((item) {
       return Padding(
       padding: const EdgeInsets.all(8.0),
       child: Text(
       item.toString(),
       style: TextStyle(
       fontWeight: FontWeight.bold,),
    ),
   );
 }).toList(),

到目前为止，我能够破解需要将值传递给color的TextStyle参数的问题。我想不到这一点。

Answer 1

将其添加到里程碑列表下面

Color textColor = Colors.black; // Default color

这样更改文本样式，

TextStyle(
  fontWeight: FontWeight.bold,
  color: textColor,
),

并执行此操作以更新颜色，

FlatButton(
  onPressed: () {
    setState(() => textColor =
        Color((Random().nextDouble() * 0xFFFFFF).toInt() << 0)
            .withOpacity(1.0)); // this is generate random color, u can use your own..
  },
  child: Text("change color"),
),