求助：实现点击后收藏图标（Icon）颜色切换功能

要实现这个功能，核心是用状态变量控制图标和颜色的切换，结合setState更新UI，具体修改如下：

1. 在你的State类里添加一个布尔状态变量，标记是否已收藏：

bool _isFavorited = false;

2. 修改AppButtons的参数，根据状态变量动态切换图标和颜色，同时添加点击事件：

Positioned(
  bottom: 70,
  left: 80,
  right: 60,
  child: Row(
    children: [
      GestureDetector(
        onTap: () {
          setState(() {
            _isFavorited = !_isFavorited;
          });
        },
        child: AppButtons(
          size: 45,
          color: _isFavorited ? Colors.red : Color(0xFF989acd),
          backgroundColor: Colors.white,
          borderColor: _isFavorited ? Colors.red : Color(0xFF989acd),
          isIcon: true,
          icon: _isFavorited ? Icons.favorite : Icons.favorite_border,
        ),
      ),
      SizedBox(width: 15,),
      RespButton(
        isResponsive: true,
      ),
    ],
  ))

关键改动说明： #

• 用GestureDetector包裹AppButtons监听点击事件（如果你的AppButtons本身支持onPressed参数，直接用它更简洁，不用套GestureDetector）
• 点击时通过setState翻转_isFavorited的状态，触发UI更新
• 图标、颜色、边框颜色都根据_isFavorited的值动态切换：收藏状态下用实心爱心和红色，未收藏用空心爱心和原来的浅紫色

如果你的AppButtons自定义组件已经内置了点击回调（比如有onPressed属性），可以把GestureDetector去掉，直接给AppButtons加onPressed参数：

AppButtons(
  size: 45,
  color: _isFavorited ? Colors.red : Color(0xFF989acd),
  backgroundColor: Colors.white,
  borderColor: _isFavorited ? Colors.red : Color(0xFF989acd),
  isIcon: true,
  icon: _isFavorited ? Icons.favorite : Icons.favorite_border,
  onPressed: () {
    setState(() {
      _isFavorited = !_isFavorited;
    });
  },
),

这样点击图标就能实现颜色和图标的切换了。

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