Question

所以，我很难解释我的问题，我希望这很清楚。请告诉我是否可以更好地澄清一切！

我有一个使用gwt-dnd来拖放小部件的GWT Web应用程序。我有Notecard对象（如3x5便条卡），它们可以扩展AbsolutePanel，并在其上显示标题和数字。

我有一个插入Notecard对象的垂直InsertPanel（一个gwt FlowPanel），一个在下一个上面（这里的顺序很重要）。假设InsertPanel中包含5个记录卡，所有记录都垂直对齐。如果我选择其中一个，将它移动到InsertPanel中的另一个索引，然后放下它，Notecard的主体将被丢弃到它应该的位置，但是标题和数字与Notecard的主体分开并一直推到InsertPanel的顶部。如果我继续移动Notecards，所有的Notecard主体都可以作为计划，但是所有的标题和数字都在InsertPanel的最顶部堆叠在一起。

我是否缺少将Notecard小部件组件“粘合”在一起的东西？我尝试使用Notecard扩展Composite而不是AbsolutePanel，但我得到了同样的行为。

作为参考，我附上了以下所涉及的Notecard类：

Notecard.java ：

public class Notecard extends AbsolutePanel implements HasAllMouseHandlers {

private Long ID;
private String storyTitle;
private int points;
private Button dragHandleButton;

private AbstractProject project;

/*
 * Constructors
 */
public Notecard( Long Id, String ttl, int pts ) {
    this.ID = Id;
    this.storyTitle = ttl;
    this.points = pts;

    setStyleName("Notecard-Wrapper");
    setSize("100px", "60px");

    Label titleLabel = new Label(storyTitle);
    titleLabel.setStyleName("Notecard-TitleLabel");
    add(titleLabel, 0, 0);
    titleLabel.setSize("96px", "28px");

    Label pointsLabel = new Label("" + points);
    pointsLabel.setStyleName("Notecard-PointsLabel");
    add(pointsLabel, 0, 35);
    pointsLabel.setSize("100px", "20px");

    dragHandleButton = new Button("");
    dragHandleButton.setText("");
    dragHandleButton.setStyleName("dragHandleButton");
    add(dragHandleButton, 0, 0);
    dragHandleButton.setSize("100px", "60px");

    Button addTaskButton = new Button("+");
    addTaskButton.addClickHandler(new ClickHandler() {
        public void onClick(ClickEvent event) {
            popupAddTaskPopup();
        }
    });
    addTaskButton.setStyleName("Notecard-AddTaskButton");
    addTaskButton.setText("+");
    add(addTaskButton, 0, 40);
    addTaskButton.setSize("20px", "20px");
}

public void popupAddTaskPopup() {
    project.popupAddTaskPopupPanel( ID );
}

/*
 * GETTERS & SETTERS
 */
public String getStoryTitle() {
    return storyTitle;
}

public void setStoryTitle(String title) {
    this.storyTitle = title;
}

public int getPoints() {
    return points;
}

public void setPoints(int points) {
    this.points = points;
}

public Long getID() {
    return ID;
}

public Button getDragHandle() {
    return dragHandleButton;
}

/*
 * Implementation for HasAllMouseHandlers
 */
@Override
public HandlerRegistration addMouseDownHandler(MouseDownHandler handler) {
    return dragHandleButton.addMouseDownHandler(handler);
}
@Override
public HandlerRegistration addMouseUpHandler(MouseUpHandler handler) {
    return dragHandleButton.addMouseUpHandler(handler);
}
@Override
public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
    return dragHandleButton.addMouseOutHandler(handler);
}
@Override
public HandlerRegistration addMouseOverHandler(MouseOverHandler handler) {
    return dragHandleButton.addMouseOverHandler(handler);
}
@Override
public HandlerRegistration addMouseMoveHandler(MouseMoveHandler handler) {
    return dragHandleButton.addMouseMoveHandler(handler);
}
@Override
public HandlerRegistration addMouseWheelHandler(MouseWheelHandler handler) {
    return dragHandleButton.addMouseWheelHandler(handler);
}

我也在使用我实现的drop控制器来处理onDrop（）事件。但它只是为onDrop（）使用AbstractInsertPanelDropController实现，然后为持久性机制添加了一些功能。

Answer 1

我弄明白了这个问题。原来它根本不是GWT或拖放的东西。这是一个CSS问题。您会注意到，我的Notecard类由AbsolutePanel组成，然后它的子元素都是绝对定位的。对于窗口小部件的原始绘图，GWT足够聪明，可以将子元素放在Notecard的包装器（AbsolutePanel）中。但是当Notecard被拖放时，它只是标准的js，而不是GWT。因此，子窗口小部件的CSS属性表示：

/* CSS for child widgets */
position: absolute;
left: 0;
top: 0;

不再相对于Notecard包装器，而是相对于RootPanel。我所做的就是在Notecard包装器中添加一个CSS样式，以确保它的子项与它相关：

/* CSS for Notecard-Wrapper */
position: relative;

然后一切都表现得很好。

我认为这是使用Firebug for Firefox然后谷歌围绕CSS问题。

使用gwt-dnd拖放时，GWT小部件会分崩离析

1 个答案: