Question

对于GWT，当你有一个网格时，我想得到什么行和列的事件。

所以我扩展了GWT网格以添加鼠标事件：

@Override
public HandlerRegistration addMouseOverHandler(MouseOverHandler handler) {
    return this.addDomHandler(handler, MouseOverEvent.getType());
}

@Override
public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
    return this.addDomHandler(handler, MouseOutEvent.getType());
}

@Override
public HandlerRegistration addMouseMoveHandler(MouseMoveHandler handler) {
    return this.addDomHandler(handler, MouseMoveEvent.getType());
}

然后我注册了点击鼠标的事件处理程序：

// mouse event handler
g.addClickHandler(new ClickHandler() {
    @Override
    public void onClick(ClickEvent event) {
        Cell cell = ((HTMLTable)event.getSource()).getCellForEvent(event);
        System.out.println("GridClickHandler: ("+cell.getRowIndex()+","+cell.getCellIndex()+")");
    }
});

所以现在我得到特定单元格的事件......但仅限于单击鼠标时。如何为所有鼠标事件调用“getCellForEvent（）”？

Answer 1

我让getCellForEvent（）函数适用于所有鼠标事件类型（而不仅仅是单击事件）。

获得所需行为的方法是扩展gwt的Grid。然后深入了解getCellForEvent（）所在的位置，并将这段代码复制到新的扩展网格中。将getCellForEvent（）从“ClickEvent”更改为“MouseEvent”。

onModuleLoad（）：

    /*------ Create the main grid display ------*/
    // grid object
    final GridWithMouse g = new GridWithMouse(2, 2);
    // mouse over event handler
    g.addMouseOverHandler(new MouseOverHandler() {
        @Override
        public void onMouseOver(MouseOverEvent event) {
            Cell cell = ((GridWithMouse)event.getSource()).getCellForEvent(event);
            if(cell!=null) {
                System.out.println("Over: ("+cell.getRowIndex()+","+cell.getCellIndex()+")");
            }
        }
    });
    // mouse move event handler
    g.addMouseMoveHandler(new MouseMoveHandler() {
        @Override
        public void onMouseMove(MouseMoveEvent event) {
            Cell cell = ((GridWithMouse)event.getSource()).getCellForEvent(event);
            if(cell!=null) {
                System.out.println("Move: ("+cell.getRowIndex()+","+cell.getCellIndex()+")");
            }
        }
    });
    // mouse click event handler
    g.addClickHandler(new ClickHandler() {
        @SuppressWarnings("rawtypes")
        @Override
        public void onClick(ClickEvent event) {
            Cell cell = ((GridWithMouse)event.getSource()).getCellForEvent((MouseEvent)event);
            if(cell!=null) {
                System.out.println("Click: ("+cell.getRowIndex()+","+cell.getCellIndex()+")");
            }
        }
    });

新的扩展Grid类：

package com.agilent.gridDisplay.client;

import com.google.gwt.dom.client.*
import com.google.gwt.event.dom.client.*
import com.google.gwt.event.shared.*
import com.google.gwt.user.client.*
import com.google.gwt.user.client.ui.*;

public class GridWithMouse 
       extends Grid
       implements HasMouseOutHandlers, HasMouseOverHandlers, HasMouseMoveHandlers
{

    /**
     * Return value for {@link HTMLTable#getCellForEvent}.
     */
    public class Cell extends com.google.gwt.user.client.ui.HTMLTable.Cell{
        public Cell(int rowIndex, int cellIndex) {
            super(rowIndex, cellIndex);
        }
    }

    public GridWithMouse(int rows, int cols) {
        super(rows,cols);
        for(int i = 0; i < 2; i++) {
            for(int j = 0; j < 2; j++) {
                this.setWidget(i,j,new Label("hello"+i));
            }
        }
    }

    /**
     * Given a click event, return the Cell that was clicked, or null if the event
     * did not hit this table.  The cell can also be null if the click event does
     * not occur on a specific cell.
     * 
     * @param event A click event of indeterminate origin
     * @return The appropriate cell, or null
     */
    @SuppressWarnings("rawtypes")
    public Cell getCellForEvent(MouseEvent event) {
        Element td = getEventTargetCell(Event.as(event.getNativeEvent()));
        if (td == null) {
            return null;
        }

        int row = TableRowElement.as(td.getParentElement()).getSectionRowIndex();
        int column = TableCellElement.as(td).getCellIndex();
        return new Cell(row, column);
    }

    @Override
    public HandlerRegistration addMouseOverHandler(MouseOverHandler handler) {
        return this.addDomHandler(handler, MouseOverEvent.getType());
    }

    @Override
    public HandlerRegistration addMouseOutHandler(MouseOutHandler handler) {
        return this.addDomHandler(handler, MouseOutEvent.getType());
    }

    @Override
    public HandlerRegistration addMouseMoveHandler(MouseMoveHandler handler) {
        return this.addDomHandler(handler, MouseMoveEvent.getType());
    }

}

现在不是获取所有鼠标事件的像素位置，而是获得所有鼠标事件的网格位置......这就是Grid从一开始就需要的！

Answer 2

public class MyTable extends Grid {
    public MyTable(){
       sinkEvents(Event.ONMOUSEOVER | Event.ONMOUSEOUT);
    }

    @Override
    public void onBrowserEvent(Event event) {
      super.onBrowserEvent(event);
      Element td = getEventTargetCell(event);
      if (td == null) {
         return;
      }
      Element tr = DOM.getParent(td);
       switch (DOM.eventGetType(event)) {
         case Event.ONMOUSEOVER: {
            tr.addClassName("my-tbl-item-sel");
            break;
         }
         case Event.ONMOUSEOUT: {
            tr.removeClassName("my-tbl-item-sel");
            break;
         }
    } 
}

试试这个

你如何为所有GWT Grid鼠标事件调用“getCellForEvent（）”？

2 个答案: