2011-01-15 2 views
1

Привет всем У меня есть FlexTable, который содержит изображения (по одному для каждой ячейки). Мне жаль, что у меня не было события, когда вы наводите мышь на ячейку, появляется всплывающее окно, в котором должно быть указано название изображения. Кто-то может дать мне руку?MouseOver FlexTable с GWT

Я попытался вставить этот код делает то, что он должен делать (по крайней мере для меня), но всплывающее окно остается активным, когда я удаляю указатель мыши.

private FlexTable createHTML(ImageResult result,int row,final int i,int currentCol) { 

immagine[i]=new Image(result.getThumbnailUrl()); 
resultsTableImm.setWidget(row, currentCol, immagine[i]); 
titleImm[i]=result.getTitleNoFormatting(); 
contentImm[i]=result.getContentNoFormatting(); 
urlImm[i]=result.getUnescapedUrl(); 

immagine[i].addMouseOverHandler(new MouseOverHandler() { 

     @Override 
     public void onMouseOver(MouseOverEvent event) { 

      PopupPanel p = new PopupPanel(true); 
      Widget source = (Widget) event.getSource(); 
      int x = source.getAbsoluteLeft() + 10; 
      int y = source.getAbsoluteTop() + 10; 
      p.add(new HTML("<b>"+titleImm[i]+"</b><br>"+contentImm[i])); 
      p.setPopupPosition(x, y); 
     p.show(); 
     } 
    }); 

    return resultsTableImm; 
      } 

Спасибо и имеют хороший день

JD

+0

Как вы добавляете изображения в F lexTable? Некоторый код будет приятным. –

+0

Я вставляю изображения с помощью классов API поиска Google (если я найду результат, вставленный в таблицу). На данный момент у меня есть таблица со всеми изображениями, загруженными с серверов Google (это 4x8). Я хочу, чтобы при прохождении мыши над изображением откроется всплывающее окно, в котором указывается название и URL-адрес последнего (немного похоже на GoogleImage). – JackDaniels

ответ

1

FlexTable имеет не onMouseOverHandler. Он имеет только clickHandler. Таким образом, вы не можете прикреплять мышь к обработчику к таблице (ячейке). Одним из способов является addMouseOverHandler к изображению показать их в popuplike, что

Image image= new Image(); 
image.addMouseOverHandler(new MouseOverHandler() { 

     @Override 
     public void onMouseOver(MouseOverEvent event) { 
      PopupPanel p = new PopupPanel(true); 
      Widget source = (Widget) event.getSource(); 
      int x = source.getAbsoluteLeft() + 10; 
      int y = source.getAbsoluteTop() + 10; 

      p.add(image); 
      p.setPopupPosition(x, y); 
      p.show(); 
     } 
    }); 

Если вы используете gwt2.1, то я предлагаю вам использовать CellTable

Посмотрите на этот пример Cell Table

+0

Если я использую CellTable, я могу управлять МО на каждую ячейку ?? – JackDaniels

+0

конечно, вы можете –

+0

ok, perfect. теперь я должен попытаться выяснить, как преобразовать мои таблицы FlexTables в CellTable .. – JackDaniels

0

Вы можете сделать пользовательский виджет с зарегистрированным обработчиком OnMouseOver и поместить его изгибаться таблицу (идея не пытается добавить слушателя для ячейки, но иметь его на самом виджете, который находится в ячейке).

Или вы можете попробовать что-то вроде этого: http://www.java2s.com/Code/Java/GWT/TableMouseOverEvent.htm

0

кипячения например Xorty в к основному вопросу данного вопроса вы можете адаптировать следующее расширение FlexTable:

import com.google.gwt.user.client.DOM; 
import com.google.gwt.user.client.Element; 
import com.google.gwt.user.client.Event; 
import com.google.gwt.user.client.ui.FlexTable; 

public class PTable extends FlexTable { 

    public static final String ROW_STYLE_NAME = "pm-PTable-row"; 

    PTable() { 
     setStyleName("pm-PTable"); 
     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(ROW_STYLE_NAME + "-mouseover"); 
       break; 
      } 
      case Event.ONMOUSEOUT: { 
       tr.removeClassName(ROW_STYLE_NAME + "-mouseover"); 
       break; 
      } 
     } 
    } 
} 
Смежные вопросы