Class DecoratedPopupPanel

java.lang.Object
All Implemented Interfaces:
HasAttachHandlers, HasCloseHandlers<PopupPanel>, HasHandlers, EventListener, EventPreview, AcceptsOneWidget, HasAnimation, HasOneWidget, HasVisibility, HasWidgets, HasWidgets.ForIsWidget, IsWidget, SourcesPopupEvents, Iterable<Widget>
Direct Known Subclasses:
DialogBox

public class DecoratedPopupPanel extends PopupPanel

A PopupPanel that wraps its content in a 3x3 grid, which allows users to add rounded corners.

Setting the Size:

If you set the width or height of the DecoratedPopupPanel, you need to set the height and width of the middleCenter cell to 100% so that the middleCenter cell takes up all of the available space. If you do not set the width and height of the DecoratedPopupPanel, it will wrap its contents tightly.

 .gwt-DecoratedPopupPanel .popupMiddleCenter {
   height: 100%;
   width: 100%;
 }
 

CSS Style Rules

  • .gwt-DecoratedPopupPanel { the outside of the popup }
  • .gwt-DecoratedPopupPanel .popupContent { the wrapper around the content }
  • .gwt-DecoratedPopupPanel .popupTopLeft { the top left cell }
  • .gwt-DecoratedPopupPanel .popupTopLeftInner { the inner element of the cell }
  • .gwt-DecoratedPopupPanel .popupTopCenter { the top center cell }
  • .gwt-DecoratedPopupPanel .popupTopCenterInner { the inner element of the cell }
  • .gwt-DecoratedPopupPanel .popupTopRight { the top right cell }
  • .gwt-DecoratedPopupPanel .popupTopRightInner { the inner element of the cell }
  • .gwt-DecoratedPopupPanel .popupMiddleLeft { the middle left cell }
  • .gwt-DecoratedPopupPanel .popupMiddleLeftInner { the inner element of the cell }
  • .gwt-DecoratedPopupPanel .popupMiddleCenter { the middle center cell }
  • .gwt-DecoratedPopupPanel .popupMiddleCenterInner { the inner element of the cell }
  • .gwt-DecoratedPopupPanel .popupMiddleRight { the middle right cell }
  • .gwt-DecoratedPopupPanel .popupMiddleRightInner { the inner element of the cell }
  • .gwt-DecoratedPopupPanel .popupBottomLeft { the bottom left cell }
  • .gwt-DecoratedPopupPanel .popupBottomLeftInner { the inner element of the cell }
  • .gwt-DecoratedPopupPanel .popupBottomCenter { the bottom center cell }
  • .gwt-DecoratedPopupPanel .popupBottomCenterInner { the inner element of the cell }
  • .gwt-DecoratedPopupPanel .popupBottomRight { the bottom right cell }
  • .gwt-DecoratedPopupPanel .popupBottomRightInner { the inner element of the cell }