Gwt context menu

Example for gwt context menu.

here explains how to create a context menu in gwt .Using Cell list for context menu items. the below code listens  the right click event of a panel and shows a pop-up-panel 

private MenuCell contextMenuItem = new MenuCell();                 private CellListResource resource = GWT.create(CellListResource.class);                   private CellList<String>  contextMenuItems = new CellList<String>(contextMenuItem, resource);                   private PopupPanel contextMenu; //using popupPanel  as a context menu                 private SingleSelectionModel<String> contextMenuSelectionModel = new SingleSelectionModel<String>();                  private Panel topContainer;    // the container to be right clicked                  public void onModuleLoad(){                                                                      topContainer=new Panel();                                    List<String> menuItmes=new ArrayList<String>()                                                                     menuItmes.add("menu item 1");                                    menuItmes.add("menu item  2");                                     menuItmes.add("menu item 3");                                     menuItmes.add("menu  item 4");                                                                    contextMenuItems.setSelectionModel(contextMenuSelectionModel);                                 contextMenuItems.setRowCount(menuItems.size(), true);                                 contextMenuItems.setRowData(0, menuItems);                                 Panel p = new VerticalPanel();                                 p.add(contextMenuItems);                                         contextMenu = new PopupPanel(true);                                     contextMenu.setStyleName("contextMenu");                                 contextMenu.add(p);                                 contextMenu.hide();                                                   topContainer.addHandler(new ContextMenuHandler() {                                                        @Override                                      public void onContextMenu(ContextMenuEvent event) {                                    event.getNativeEvent().stopPropagation();                event.getNativeEvent().preventDefault();                                    contextMenu.setPopupPosition(event.getNativeEvent().getClientX(),                                                                 event.getNativeEvent().getClientY());                                    contextMenu.show();                                                                      }                                      }, ContextMenuEvent.getType());                                                          contextMenuSelectionModel                                                                 .addSelectionChangeHandler(new SelectionChangeEvent.Handler() {                                                                                 @Override                                                                                 public void onSelectionChange(SelectionChangeEvent event) {                                                                                                  // changed the context menu selection                                                                        Window.alert("Selected item is" + contextMenuSelectionModel.getSelectedObject());                                                                                                                                                                                                                                                                                                                                                    }                                                                                });                                    RootPanel.get().add(topContainer);                           }

Representation of a single cell

class MenuCell extends AbstractCell<String> {               @Override               public void render(com.google.gwt.cell.client.Cell.Context context,                            String value, SafeHtmlBuilder sb) {                      SafeHtml html = SafeHtmlUtils                                   .fromSafeConstant("<div class='cell'> " + value                                                 + "</div>");                      sb.append(html);               }        }

Customization of cell style

public interface CellListResource extends  CellList.Resources {                 @Source({"myCellList.css"})          CellList.Style cellListStyle();        }

myCellList.css

.cellListWidget { } .cellListEvenItem {   cursor: pointer;   zoom: 1; } .cellListOddItem {   cursor: pointer;   zoom: 1; } .cellListKeyboardSelectedItem {   background: white; } @sprite .cellListSelectedItem {   gwt-image: 'cellListSelectedBackground';   background-color: white;   color: white;   height: auto;   overflow: visible; }

Basic style sheet (in war folder)

.cell:hover {     border-color: #afd2fd;     border-style: solid;     border-width: 1px;     background-color: #e1eefd;     color: black;        } .cell{                  border-color: white;     border-style: solid;     border-width: 1px;        /*padding: 3px 29px 3px 10px;*/               font-size: 11px;     padding: 3px 61px 3px 41px; } .contextMenu {     background-color: white;     border-color: #979797;     border-style: solid;     border-width: 1px;     box-shadow: 2px 3px 5px -3px black;     padding: 3px; }

-->