Flutter如何在按钮/Widget中使用条件语句动态设置颜色属性

核心逻辑：你需要通过路由回传机制拿到Video0_02页面的favorite变量，同时在当前页面声明状态变量存储该值，绑定到按钮color属性实现动态切换。

• 步骤1：在当前页面的State类中声明状态存储变量，默认值可按需求设置

// 写在State类的内部，build方法外部
bool _favorite = false;

• 步骤2：修改LearnLevelButton的color属性，用三目运算符做动态判断（Flutter widget属性不支持独立if语句块，需用表达式写法）

color: _favorite ? Colors.yellow : Colors.blue,

• 步骤3：修改onTap路由跳转逻辑，接收Video0_02返回的favorite值并更新状态

LearnLevelButton(
  color: _favorite ? Colors.yellow : Colors.blue,
  onTap: () async {
    // 接收路由返回的结果
    final returnedFavorite = await Navigator.push(
      context, 
      MaterialPageRoute(builder: (context) => const Video0_02())
    );
    // 校验返回值合法后更新UI
    if (returnedFavorite != null && returnedFavorite is bool) {
      setState(() {
        _favorite = returnedFavorite;
      });
    }
  },
),

额外配置：需要在Video0_02页面的返回逻辑中，把favorite变量作为返回值传递，示例如下：

// Video0_02页面中触发返回操作的位置调用，比如点击返回按钮的回调里
Navigator.pop(context, favorite); // 此处的favorite就是Video0_02页面中定义的同名变量

修复说明：你之前的代码没有绑定状态变量，按钮颜色是写死的固定值，自然不会跟随favorite的变化更新。Flutter要触发UI变更必须调用setState更新状态变量，widget属性的条件判断要用三目运算符等表达式写法，不能直接写独立的if语句块。

内容的提问来源于stack exchange，提问作者lele