代码之家  ›  专栏  ›  技术社区  ›  Chris

颤振传递手势检测细节到下堆栈小部件

  •  0
  • Chris  · 技术社区  · 5 年前

    我有一个 Stack 有两个 widgets 在上面。下一个应该能够探测到 GestureDetection 但这是不可能的,因为上面提到的是 舞台调度 信息技术我的设置:

        return Stack(
      children: [
        Hero(
          tag: month.name + 'image',
          child: Container(
            height: _scaledWidth,
            width: _scaledWidth,
            child: PaintService.getCollageImagesFromCollageOption(
              month.collageOption,
              month.images,
              _scaledWidth,
            ),
          ),
        ),
        Hero(
          tag: month.name + 'shape',
          child: Container(
            height: _scaledWidth,
            width: _scaledWidth,
            child: PaintService.getShapeFromCollageOption(
                month.collageOption, _scaledWidth),
          ),
        ),
      ],
    );
    

    enter image description here

    上面的小部件是图片中的白色框架,它必须位于图像的顶部。但图像应该是 transformable 我喜欢这样:

      Widget build(BuildContext context) {
    final _zoom = useState<double>(1.0);
    final _previousZoom = useState<double>(1.0);
    final _offset = useState<Offset>(Offset.zero);
    final _previousOffset = useState<Offset>(Offset.zero);
    final _startingFocalPoint = useState<Offset>(Offset.zero);
    
    final _zoom_2 = useState<double>(1.0);
    final _previousZoom_2 = useState<double>(1.0);
    final _offset_2 = useState<Offset>(Offset.zero);
    final _previousOffset_2 = useState<Offset>(Offset.zero);
    final _startingFocalPoint_2 = useState<Offset>(Offset.zero);
    return Stack(
      children: [
        Positioned(
          top: 0,
          left: 0,
          right: 0,
          bottom: 0,
          child: GestureDetector(
            onTap: () => print("tapped"),
            onScaleStart: (details) {
              _startingFocalPoint.value = details.focalPoint;
              _previousOffset.value = _offset.value;
              _previousZoom.value = _zoom.value;
            },
            onScaleUpdate: (details) {
              _zoom.value = _previousZoom.value * details.scale;
              final Offset normalizedOffset =
                  (_startingFocalPoint.value - _previousOffset.value) /
                      _previousZoom.value;
              _offset.value =
                  details.focalPoint - normalizedOffset * _zoom.value;
            },
            child: ClipPath(
              clipper: _Position1ClipperImage(),
              child: Transform(
                transform: Matrix4.identity()
                  ..translate(_offset.value.dx, _offset.value.dy)
                  ..scale(_zoom.value),
                child: Image.asset(widget.images[0].path,
                    width: widget.width,
                    height: widget.width,
                    fit: BoxFit.fill),
              ),
            ),
          ),
        ),
        Positioned(
          top: 0,
          left: 0,
          right: 0,
          bottom: 0,
          child: GestureDetector(
            onTap: () => print("tapped"),
            onScaleStart: (details) {
              _startingFocalPoint_2.value = details.focalPoint;
              _previousOffset_2.value = _offset_2.value;
              _previousZoom_2.value = _zoom_2.value;
            },
            onScaleUpdate: (details) {
              _zoom_2.value = _previousZoom_2.value * details.scale;
              final Offset normalizedOffset =
                  (_startingFocalPoint_2.value - _previousOffset_2.value) /
                      _previousZoom_2.value;
              _offset_2.value =
                  details.focalPoint - normalizedOffset * _zoom_2.value;
            },
            child: ClipPath(
              clipper: _Position2ClipperImage(),
              child: Transform(
                transform: Matrix4.identity()
                  ..translate(_offset_2.value.dx, _offset_2.value.dy)
                  ..scale(_zoom_2.value),
                child: Image.asset(widget.images[1].path,
                    width: widget.width,
                    height: widget.width,
                    fit: BoxFit.fill),
              ),
            ),
          ),
        ),
      ],
    );
    
    
    }
    

    就像我说的如果我有第二个 widget 在图像上方(第一个代码片段)。

    我知道我可以简单地移动 GestureDetector top-level 小部件。但是我怎样才能把这些信息传递给我的图片呢?我被困在这里了。。。

    如果你需要更多信息,请告诉我!

    0 回复  |  直到 5 年前
        1
  •  3
  •   Jigar Patel    5 年前

    尝试用一个 IgnorePointer 小装置。

      IgnorePointer(
        child: Hero(
          tag: month.name + 'shape',
          child: Container(
            height: _scaledWidth,
            width: _scaledWidth,
            child: PaintService.getShapeFromCollageOption(
                month.collageOption, _scaledWidth),
          ),
        ),
      )