旋转小部件后，GestureDetector 不在堆栈上工作

Question

当我更改小部件的旋转时，无法触摸小部件或更改小部件在紫色标记上的位置。 当旋转返回0度或改变旋转之前，将被成功触摸。

不旋转时工作正常

这是我的代码

import 'package:flutter/material.dart';
import 'dart:math' as math;

class View_Test_Design extends StatefulWidget {
  @override
  _View_Test_DesignState createState() => _View_Test_DesignState();
}

class _View_Test_DesignState extends State<View_Test_Design> {
  double x = 100;
  double y = 100;

  double w = 200;
  double h = 50;

  double r=0; // Not Working fine when change to another number 

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Rotate|Pos|Drag"),
      ),
      body: Stack(
        children: <Widget>[
          Positioned(
              left: x,
              top: y,
              child: GestureDetector(
                  onPanUpdate: (details) {
                    setState(() {
                      x = x + details.delta.dx;
                      y = y + details.delta.dy;
                    });
                  },
                  child: Transform.rotate(
                      angle: math.pi * r / 180,
                      child:
                          Container(width: w, height: h, color: Colors.red))))
        ],
      ),
    );
  }
} 

任何解决方案为什么这不起作用？

Answer 1

这是因为 Transform 小部件在父小部件的范围之外转换小部件。所以你需要让父小部件更大。

@override
Widget build(BuildContext context) {
 return Scaffold(
  appBar: AppBar(
    title: Text("Rotate|Pos|Drag"),
  ),
  body: Stack(
    overflow: Overflow.visible,
    children: <Widget>[
      Positioned(
          left: x,
          top: y,
          width: MediaQuery.of(context).size.width,
          height: MediaQuery.of(context).size.height,
          child: GestureDetector(
              onPanUpdate: (details) {
                setState(() {
                  x = x + details.delta.dx;
                  y = y + details.delta.dy;
                });
              },
              child: Transform.rotate(
                  angle: math.pi * r / 180,
                  child:
                      Container(width: w, height: h, color: Colors.red))))
     ],
   ),
 );
}

答案来自这里https://github.com/flutter/flutter/issues/27587