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

这是因为“变换”窗口小部件在父窗口小部件的边界之外转换了窗口小部件。因此，您需要使父窗口小部件变大。

@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

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

1 个答案: