Flutter实现点击TextFormField的suffixIcon时不触发输入框聚焦

核心问题根源：suffixIcon区域的点击事件默认会透传给下层的TextFormField，触发输入框获焦逻辑，自动唤起键盘。只要让图标区域的点击事件被完全消费，不向下透传即可解决问题。

方案1：最简实现 #

直接把原有的IconButton替换为带HitTestBehavior.opaque属性的GestureDetector包裹图标，该属性会让组件完全消费点击事件，不会向下透传：
修改InputDecoration中suffixIcon的代码如下：

suffixIcon: GestureDetector(
  // 该属性确保点击事件被当前组件完全消费
  behavior: HitTestBehavior.opaque,
  onTap: () {
    setState(() {
      _secureText = !_secureText;
    });
  },
  child: Icon(
    _secureText ? Icons.visibility_off : Icons.visibility,
  ),
),

方案2：保留Material风格水波纹点击效果 #

如果需要保留原IconButton的水波纹交互效果，可以使用InkResponse实现，同样会消费点击事件不会透传：

suffixIcon: InkResponse(
  onTap: () {
    setState(() {
      _secureText = !_secureText;
    });
  },
  // 调整内边距保证点击区域和原IconButton一致
  child: Padding(
    padding: const EdgeInsets.all(8.0),
    child: Icon(
      _secureText ? Icons.visibility_off : Icons.visibility,
    ),
  ),
),

修改后点击图标只会切换密码显隐状态，不会触发输入框获焦，也不会自动弹出键盘。

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