Flutter中InkWell的onLongPress()方法无法正常工作的原因排查

我正在开发一款应用，大量Container组件被InkWell包裹。目前点击容器可以正常跳转新页面，但长按容器改变颜色的功能失效——onTap方法正常生效，onLongPress方法完全没执行，容器颜色也没变化。这个功能在测试项目里能正常跑，放到实际代码里就不行了，相关代码如下：

class ToolsScreen2 extends StatefulWidget {
  ToolsScreen2({super.key});

  @override
  State<ToolsScreen2> createState() => ToolsScreen2State();
}

class ToolsScreen2State extends State<ToolsScreen2> {
  late Color colorContainer = Colors.white24;
  void initState() {
    colorContainer = Color(
      GetStorage().read<int>('colorContainer') ?? Colors.white24.value,
    );
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Choose A CLL Case:'),
        iconTheme: const IconThemeData(
          color: Colors.deepOrangeAccent, 
        ),
      ),
      body: ListView(
        children: [
          InkWell(
            onLongPress: () {
              setState(() {
                colorContainer = colorContainer == Colors.white24
                    ? Colors.green.shade600
                    : Colors.white24;
                GetStorage().write('colorContainer', colorContainer.value);
              });
            },  // 这个长按事件没反应
            onTap: () {
              Navigator.push(
                context,
                MaterialPageRoute(
                  builder: (context) => const Sune_CLL(),
                ),
              );
            },
            child: Container(
              width: 500,
              color: Colors.white24,
              height: 125,
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: [
                  Image.asset(
                    'images/SuneOrtega BR.png',
                  ),
                  const Padding(
                    padding: EdgeInsets.only(right: 70.0),
                    child: Text(
                      'Sune Cases',
                      style: TextStyle(fontSize: 30),
                    ),
                  ),
                ],
              ),
            ),
          ),

1. 修复容器颜色的状态绑定 #

你的Container颜色写死成了Colors.white24，完全没用到状态变量colorContainer——就算长按触发了状态更新，界面也不会有变化。把Container的color属性改成绑定状态变量：

child: Container(
  width: 500,
  color: colorContainer, // 替换成状态变量
  height: 125,
  // 其余代码不变
)

2. 补上initState里的super调用 #

你漏了调用super.initState()，这会破坏State的生命周期，导致状态更新逻辑异常。修正后的initState应该是：

late Color colorContainer;

@override
void initState() {
  super.initState(); // 必须加这行
  colorContainer = Color(
    GetStorage().read<int>('colorContainer') ?? Colors.white24.value,
  );
}

3. 强制InkWell接收所有手势 #

如果Container内部有其他可交互组件（比如图片），会抢占InkWell的长按事件。给InkWell加上behavior: HitTestBehavior.opaque，强制它处理所有点击/长按手势：

InkWell(
  behavior: HitTestBehavior.opaque, // 添加这一行
  onLongPress: () {
    // 长按逻辑不变
  },
  onTap: () {
    // 点击逻辑不变
  },
  // 其余代码不变
)

4. 排查颜色判断的精度问题 #

Colors.white24和Colors.green.shade600是Material颜色，但如果GetStorage里存的颜色值有偏差，可能导致判断colorContainer == Colors.white24永远为true。可以改成直接比较颜色值：

colorContainer = colorContainer.value == Colors.white24.value
    ? Colors.green.shade600
    : Colors.white24;

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