Question

在我的代码中，CircleAvatar带有边框。我想知道用户是否完全点击边框。为此，我需要检查tap是否在大圆圈（Container）内，而不是在小圆圈（CircleAvatar）内。有人知道我该怎么检查吗？

Widget build(BuildContext context) {
  return Listener(
    child: Container(
      key: key,
      padding: EdgeInsets.all(8.0),
      decoration: ShapeDecoration(shape: CircleBorder(), color: Colors.yellow),
      child: CircleAvatar(
        backgroundImage: NetworkImage(widget.imgSrc),
        radius: 60.0,
      ),
    ),
    onPointerDown: (event) {
      if (renderBox == null) {
        renderBox = key.currentContext?.findRenderObject();
      }
      Rect rect = renderBox.paintBounds;
      // todo ......
    },
  );
}

Answer 1

您应该使用毕氏定理检查偏移量是否为圆形：

import 'dart:math';

/// check if a [point] is in a circle of a given [radius]
bool isPointInside(Offset point, double radius) =>
  pow(point.dx, 2) + pow(point.dy, 2) < pow(radius, 2);

对大圆和小圆进行此操作，并检查结果是否符合您的要求。

编辑：按照@ randal-schwartz的建议删除了sqrt以支持pow（radius）

Answer 2

也许这不是最好的方法，但是我已经找到了解决方法

Rect bigRect = renderBox.paintBounds.shift(renderBox?.localToGlobal(Offset.zero));
Rect smallRect = bigRect.deflate(padding);
Path path = Path()
  ..fillType = PathFillType.evenOdd
  ..addOval(bigRect)
  ..addOval(smallRect);
if (path.contains(event.position)) { // todo...

P.S。 Muldec的解决方案也可以使用，也可以使用，但是我正在寻找另一种类型，例如contains

如何知道偏移量是否在圆内

2 个答案: