Question

我正在尝试使Polymer Dart元素可拖动，并将信息与列表中的其他项交换。我最近的尝试是使用＆lt; core-drag-drop＆gt;元件。我正在使用trackstart，track和trackend这个元素创建的事件。我可以让他们开火，但我无法弄清楚如何获得拖动效果的直观表示，就像你可以使用常规＆lt; div＆gt;通过将其draggable属性设置为true来实现元素。不仅如此，我无法弄清楚我应该如何从这些JS事件中获取信息。我已经设法从Dart事件中获取了一些数据，但我确信＆lt; core-drag-drop＆gt;设置了一些缺失的数据。元素，（或者有吗？）。

<link rel="import" href="../../packages/polymer/polymer.html">

<link rel="import" href="../../packages/core_elements/core_drag_drop.html">

<link rel="import" href="draggable-item.html">

<polymer-element name="item-list">
    <template>
        <core-drag-drop></core-drag-drop>
        <draggable-item id="item1" on-trackstart="{{ dragStart }}" on-track="{{ dragIt }}" on-trackend="{{ dragEnd }}"></draggable-item>
        <draggable-item id="item2" on-trackstart="{{ dragStart }}" on-track="{{ dragIt }}" on-trackend="{{ dragEnd }}"></draggable-item>
    </template>
    <script type="application/dart">
      import 'dart:html';

      import 'package:polymer/polymer.dart';

      @CustomTag('item-list')
      class ItemList extends PolymerElement {
        ItemList.created() : super.created();

        ...

        dragStart(Event ev) {
            print("dragStart: ${ev.currentTarget.id}");
        }


        dragIt(Event ev) {
            print("dragIt: ${ev.path}");
        }

        dragStop(Event ev) {
            print("dragStop $ev, ${ev.target.id}, ${ev.path}");

        }
      }
    </script>
</polymer-element>

这适用于打印信息，但仍然让我无法理解如何使用它将项目拖到另一个项目上，在拖动目标时突出显示目标，然后使用最终目标交换信息。这有助于交换列表中项目的顺序。有点像Google Play音乐应用，您可以在其中拖动歌曲并将其放在播放队列中的其他位置。有人可以帮助我吗？

更新（澄清）我想让聚合物飞镖元素可拖动。＆lt; core-drag-drop＆gt; demo.html用于拖动＆lt; div＆gt;元素。我可以拖放工作＆lt; div＆gt; Dart很好。

Answer 1

您是否看过演示页？

JS：

https://github.com/Polymer/core-drag-drop/blob/master/demo.html

落镖：

https://github.com/dart-lang/polymer-core-and-paper-examples/blob/master/web/core_drag_drop.html

https://github.com/dart-lang/polymer-core-and-paper-examples/blob/master/web/core_drag_drop.dart

此处，他们通过将HTML分配到avatar活动详情的drag-start字段来定义拖动外观。

如何在Dart中使用core-drag-drop来制作聚合物元素可拖动？

1 个答案: