【问题标题】:DragTarget onWillAccept and onAccept not firingDragTarget onWillAccept 和 onAccept 不触发
【发布时间】:2019-05-04 06:32:14
【问题描述】:

我从 Flutter 开始,我无法使拖放功能正常工作。我遵循了文档,但不知道我做错了什么。 此示例应用程序显示三个正方形,蓝色是可拖动的。其他的设置了 DragTarget,一个在正方形内,一个在正方形外。当我拖动蓝色方块时,它会打印出拖动开始的信息,但在拖放到 DragTargets 时没有打印信息。 代码如下:

import 'package:flutter/material.dart';

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

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.red,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);

  final String title;

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

class _MyHomePageState extends State<MyHomePage> {

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Container(
          constraints: BoxConstraints.expand(),
          color: Colors.grey[900],
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Container(
                width: 100,
                height: 100,
                color: Colors.red,
                child: DragTarget(
                  onWillAccept: (d) => true,
                  onAccept: (d) => print("ACCEPT 1!"),
                  onLeave: (d) => print("LEAVE 1!"),
                  builder: (a,data,c) {
                    print(data);
                    return Center();
                  },
                ),
              ),
              DragTarget(
                onWillAccept: (d){return true;},
                onAccept:(d) => print("ACCEPT 2!"),
                onLeave: (d) => print("LEAVE 2!"),
                builder: (context, candidateData, rejectedData){
                  return Container(
                    width: 150,
                    height: 150,
                    color: Colors.purple
                  );
                }
              ),
              Draggable(
                data: ["SOME DATA"],
                onDragStarted: () => print("DRAG START!"),
                onDragCompleted: () => print("DRAG COMPLETED!"),
                onDragEnd: (details) => print("DRAG ENDED!"),
                onDraggableCanceled: (data, data2) => print("DRAG CANCELLED!"),
                feedback: SizedBox(
                  width: 100,
                  height: 100,
                  child: Container(
                    margin: EdgeInsets.all(10),
                    color: Colors.green[800],
                  ),
                ),
                child: SizedBox(
                  width: 100,
                  height: 100,
                  child: Container(
                    margin: EdgeInsets.all(10),
                    color: Colors.blue[800],
                  ),
                ),
              ),
            ],
          )
        ),
      )
    );
  }
}

【问题讨论】:

    标签: dart drag-and-drop flutter


    【解决方案1】:

    如果要传递数据,显然 Draggable 和 DragTarget 需要指定泛型类型,否则不会触发 onAccept 和 onWillAccept。

    例如,如果您想将数据作为 int 传递,则使用 Draggable&lt;int&gt;DragTarget&lt;int&gt; —— 这也适用于 onAccept 和 onWillAccept,它们需要接受 int 作为参数。

    【讨论】:

    • 感谢您抽出宝贵时间回答您自己的问题,真的帮了我大忙!
    • 绝对的救星!!我花了大约一个小时试图弄清楚为什么它不起作用。
    • 哇。我在这上面花了太长时间,谢谢! onLeave 和 onAccept 也是如此,但根据我们的测试,onWillAccept 仍然在没有强类型的情况下触发
    • 除此之外,您需要提供一个数据属性,即使它不需要,例如 data:1,这就是让我失望的原因
    • 这确实应该在 Flutter 文档中指定。非常感谢您的回答!
    【解决方案2】:

    您应该在调用 onAccept 时 setState 并向您的有状态小部件添加一个布尔值。

    bool 接受 = 假;

    onAccept: (data){
          if(data=='d'){
            setState(() {
              accepted = true;
            });
          },
    

    【讨论】:

    • 欢迎来到 StackOverflow @Madison。解释为什么你的答案是一个解决方案是个好主意,而不是仅仅给出一段代码而不做任何解释。
    猜你喜欢
    • 2022-09-29
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2021-09-08
    • 1970-01-01
    • 2013-06-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多