通用拖放 - 编程之家

如何解决通用拖放

我正在尝试使用包含 Vaadin 图表的多个 div 创建视图，并使用 DnD 移动它们。我跟着this tutorial。这是我扩展 Div 的类。

List<Div> divs = new ArrayList<>();
        divs.add(new Bubble());
        divs.add(new FunnelChart());
        divs.add(new ColumnLineAndPie());
        divs.add(new PieWithLegend());
        divs.add(new Bubble());
        divs.add(new FunnelChart());
        divs.add(new ColumnLineAndPie());
        divs.add(new PieWithLegend());
        List<DragSource<Div>> cards = new ArrayList<>();
        for (int i = 0; i < 8; i++) {
            DragSource<Div> temp = DragSource.create(divs.get(i));
            cards.add(temp);
            cards.get(i).setDragData(true);
        }
        VerticalLayout board = new VerticalLayout();
        HorizontalLayout row1 = new HorizontalLayout();
        row1.setWidthFull();
        row1.add(divs.get(0),divs.get(1),divs.get(3));
        HorizontalLayout row2 = new HorizontalLayout();
        row2.setWidthFull();
        row2.add(divs.get(4));
        HorizontalLayout row3 = new HorizontalLayout();
        row3.setWidthFull();
        row3.add(divs.get(5),divs.get(7));
        board.add(row1,row2,row3);
        add(board);

但不知何故，我无法拖动我的元素。

解决方法

在您的示例中，拖动处于活动状态，它只是不会放在任何地方。除非您不想要在容器中拾取和放置样式的拖动，而是像窗口一样拖动（可移动）。在这种情况下，为什么不使用经过调整的 Vaadin 对话框？

更新 #1：所以在这个例子中似乎：

{{1}}

只有 NOOOOOOO div 不可拖动。图表的看起来也不是很好，但是如果你添加 padding: 100px，例如，然后按框架拖动它们，它就可以工作。所以我会说问题在于你在它们里面放了什么。图表是复杂的组件，在某些情况下也接受拖动。它们可能需要进行调整，但我不认为这是一件容易的事。也许最好的方法是创建一个“挑选”区域，您可以在那里抓取卡片。