如何摆脱“不正确使用 ParentDataWidget”错误?

时间:2021-01-25 14:37:10

标签: flutter flutter-layout

我无法避免“不正确使用 ParentDataWidget”错误。下面的代码有效 - 我希望能够将可拖动小部件放到 bottomSheet 中的 dragTarget 上,但也希望小部件可在主体中拖动。

该代码在模拟器中运行良好,但是当 dragTarget 接受了 draggable 时,错误会在控制台中标记出来。

有什么明显的我做错了吗?


void main() => runApp(MyApp());

bool isAccepted = false;
DragMe niceBox = new DragMe('Hello', 50.0, 100.0, Colors.green);
DragMe nastyBox = new DragMe('Yucky', 150.0, 100.0, Colors.brown[300]);
TargetBox targetBox = new TargetBox();
MyDragTarget myDragTarget = new MyDragTarget();
const kTopSpace = 96; // Height of Appbar plus the icon bar above

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      theme: ThemeData( fontFamily: 'PressStart'),
      home: MyHomeScreen(),
    );
  }
}

class MyHomeScreen extends StatefulWidget {
  MyHomeScreen({Key key}) : super(key: key);
  createState() => MyHomeScreenState();
}

class MyHomeScreenState extends State<MyHomeScreen> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      backgroundColor: Colors.red[100],
      appBar: AppBar(
        toolbarHeight: 70.0,
        title: Center(child: Text('My brain hurts')),
        backgroundColor: Colors.pink,
      ),
      body: Stack(children: [niceBox, nastyBox]),
      bottomSheet: Container(
        color: Colors.lightBlue,
        height: 100.0,
        child: Row(
          mainAxisAlignment: MainAxisAlignment.center,
          mainAxisSize: MainAxisSize.max,
          children: [myDragTarget],
        ),
      ),
    );
  } // End build()
} // End class MyHomeScreenState

class DragMe extends StatefulWidget {
  DragMe(this.myText, this.xPos, this.yPos, this.myColor);
  final String myText;
  double xPos;
  double yPos;
  final Color myColor;

  @override
  _DragMeState createState() => _DragMeState();
}

class _DragMeState extends State<DragMe> {
  @override
  Widget build(BuildContext context) {
    return Positioned(
      left: widget.xPos,
      top: widget.yPos,
      // left: widget.xPos,
      // top: widget.yPos,
      child: Draggable(
        data: widget.myText,
        feedback: Container(height: 50, width: 70, color: Colors.grey),
        childWhenDragging: Container(),
        onDragStarted: () {},
        onDragEnd: (details) {
          setState(() {
            widget.xPos = details.offset.dx;
            widget.yPos = details.offset.dy - kTopSpace;
          });
        },
        onDragCompleted: () {},
        onDraggableCanceled: (velocity, offset) {},
        child: Container(
          child: Center(child: Text(widget.myText)),
          color: widget.myColor,
          height: 50,
          width: 70,
        ),
      ),
    );
  }
}

class MyDragTarget extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return DragTarget<String>(
      builder: (context, List<String> acceptedData, rejectedData) {
        if (isAccepted) {
          return niceBox;
        } else {
          return targetBox;
        }
      },
      onWillAccept: (data) {
        if (data == 'Hello') {
          isAccepted = true;
          return true;
        } else {
          isAccepted = false;
          return false;
        }
      },
      onAccept: (strData) {},
      onLeave: (strData) {
        return true;
      },
      onMove: (moveData) {
        return true;
      },
      onAcceptWithDetails: (data) {},
    );
  }
}

class TargetBox extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
        child: Center(child: Text('Drop Here')),
        color: Colors.yellow,
        height: 50.0,
        width: 100.0);
  }
}

2 个答案:

答案 0 :(得分:0)

您的堆栈没有任何可以保持的最大界限。您想要做的是将 Stack 包装成具有您选择的宽度和高度的 SizedBoxContainer。如果您希望它占用所有可用空间,请这样做:

SizedBox(
  width: MediaQuery.of(context).size.width,
  height: MediaQuery.of(context).size.height,
  child: Stack(),
)

答案 1 :(得分:0)

根据 docsPositioned 小部件必须是 Stack 的直接后代

<块引用>

Positioned 小部件必须是 Stack 的后代,并且从 Positioned 小部件到其封闭 Stack 的路径必须仅包含 StatelessWidgets 或 StatefulWidgets(而不是其他类型的小部件,如 RenderObjectWidgets)。

由于您有 Stack > DragMe > Positioned,它会因该错误而失败。

你需要有

    Stack(children: [
        Positioned(...),
    ])