Flutter signature 5.0.1签名绘制可超出Widget边界问题

signature 5.0.1版本默认未对触点坐标做边界拦截，仅给Signature组件配置width、height属性只会调整组件自身布局尺寸，不会限制超出布局范围的手势触点识别，也不会自动裁剪超出边界的绘制内容，最终出现绘制内容向左、向下无限延伸超出组件边界的现象。

方案1：裁剪+手势范围约束（无侵入，无需修改插件逻辑） #

直接将Signature组件嵌套在ClipRect组件内做绘制内容裁剪，外层用固定尺寸的SizedBox约束布局范围，代码示例：

SizedBox(
  // 替换为实际需要的签名区域宽度
  width: 300,
  // 替换为实际需要的签名区域高度
  height: 200,
  child: ClipRect(
    child: Signature(
      controller: _signatureController,
      backgroundColor: Colors.white,
      // 宽高参数和外层SizedBox保持完全一致
      width: 300,
      height: 200,
    ),
  ),
)

*如果仍存在手势越界识别的问题，可在外层补充GestureDetector，将命中测试行为设为不透明，强制手势识别范围严格限定在当前容器尺寸内：

SizedBox(
  width: 300,
  height: 200,
  child: GestureDetector(
    behavior: HitTestBehavior.opaque,
    child: ClipRect(
      child: Signature(
        controller: _signatureController,
        backgroundColor: Colors.white,
        width: 300,
        height: 200,
      ),
    ),
  ),
)

方案2：自定义控制器过滤越界触点（体验最优，从源头阻止越界绘制） #

如果需要完全避免越界内容生成，可继承SignatureController重写触点添加逻辑，直接过滤掉超出签名区域范围的点位，不会出现绘制到边界被截断的突兀感：

class BoundedSignatureController extends SignatureController {
  final double boundWidth;
  final double boundHeight;

  BoundedSignatureController({
    required this.boundWidth,
    required this.boundHeight,
    super.penColor,
    super.penStrokeWidth,
    super.exportBackgroundColor,
    super.exportPenColor,
  });

  @override
  void addPoint(Offset point, [PointerDeviceKind? kind]) {
    // 坐标超出签名区域范围时直接拦截，不录入绘制点位
    if (point.dx < 0 || point.dx > boundWidth || point.dy < 0 || point.dy > boundHeight) {
      return;
    }
    super.addPoint(point, kind);
  }
}

使用时初始化该自定义控制器，传入和签名组件一致的宽高参数即可。

• 不要给Signature组件外层嵌套Expanded、Flexible这类自适应布局组件后再单独给Signature设置固定宽高，会导致布局计算尺寸和实际手势识别范围不匹配，必须保证签名组件的实际布局尺寸和传入的width、height参数完全一致。
• 如果在可滚动组件（ListView、SingleChildScrollView、CustomScrollView等）内使用签名组件，需要在签名区域检测到按下事件时临时禁用父级可滚动组件的滚动响应，避免滑动时手势被父组件抢占导致触点坐标计算偏移。

内容的提问来源于stack exchange，提问作者Gregor Gračnar