个性化阅读
专注于IT技术分析

GWT PopupPanel用法

可以选择在GWT PopupPanel后面显示“玻璃”元素, 该元素通常用于使它后面的窗口小部件变灰。可以使用setGlassEnabled(boolean)启用它。它的默认样式名称为“ gwt-PopupPanelGlass”, 可以使用setGlassStyleName(String)进行更改。

GWT PopupPanel类声明

让我们看看com.google.gwt.user.client.ui.PopupPanel类的声明。

public class PopupPanel extends SimplePanel

GWT PopupPanel嵌套类

描述
PopupPanel.AnimationType 这是打开弹出窗口时使用的动画类型。
PopupPanel.PositionCallback 这是一个回调, 用于在显示PopupPanel之前立即设置其位置。
PopupPanel.ResizeAnimation 它用于放大弹出窗口。

GWT PopupPanel构造函数

建设者 描述
PopupPanel() 它创建一个空的弹出面板。
PopupPanel(boolean autoHide) 它创建一个空的弹出面板, 并指定其“自动隐藏”属性。
PopupPanel(boolean autoHide, boolean modal) 它创建一个空的弹出面板, 并指定其“自动隐藏”和“模式”属性。

GWT PopupPanel常用方法

修饰符和类型 方法 描述
void addAutoHidePartner(Element partner) 这是在autoHide合作伙伴内发生的鼠标事件, 不会隐藏设置为autoHide的面板。
void center() 它将弹出窗口居中并显示在浏览器窗口中。
PopupPanel.AnimationType getAnimationType() 它获取打开和关闭弹出窗口时要使用的动画类型。
protected Element getContainerElement() 它重写此方法以指定除根元素之外的其他元素作为面板的子小部件的容器。
protected Element getGlassElement() 它获取此PopupPane使用的玻璃元素
int getOffsetHeight() 它获取面板的偏移高度(以像素为单位)。
int getOffsetWidth() 它获取面板的偏移宽度(以像素为单位)。
void hide() 它隐藏弹出窗口, 并将其与页面分离。
void hide(boolean autoClosed) 它隐藏弹出窗口, 并将其与页面分离。
boolean isAnimationEnabled() 如果启用了动画, 则返回true, 否则返回false。
boolean isModal() 如果应将不针对PopupPanel或其子级的键盘或鼠标事件忽略, 则返回true。
boolean isPreviewingAllNativeEvents() 如果弹出窗口应预览所有本机事件, 则返回true, 即使该事件已被另一个弹出窗口使用。
void setModal(boolean modal) 当弹出窗口是模式窗口时, 将不针对PopupPanel或其子对象的键盘或鼠标事件。
void setAnimationType(PopupPanel.AnimationType type) 它设置打开和关闭弹出窗口时使用的动画类型。

GWT PopupPanel示例1

//SamplePopupPanel.java

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.DecoratorPanel;
import com.google.gwt.user.client.ui.HTMLPanel;
import com.google.gwt.user.client.ui.RootPanel;

public class MyPopup extends DialogBox {
  interface MyPopupUiBinder extends UiBinder<Widget, MyPopup> {}
  private static MyPopupUiBinder uiBinder = GWT.create(MyPopupUiBinder.class);

  public MyPopup() {
    super(false, true);
    
    setWidget(uiBinder.createAndBindUi(this));
    
    setGlassEnabled(true);
  }
}

//SamplePopupPanel.css

.gwt-PopupPanelGlass {
  opacity:0.3;
  filter:alpha(opacity=30);
  background-color: grey;
}

输出:

GWT PopupPanel

GWT PopupPanel示例2

//SamplePopupPanel.java

import com.extjs.gxt.ui.client.event.ButtonEvent;
import com.extjs.gxt.ui.client.event.SelectionListener;
import com.extjs.gxt.ui.client.widget.Window;
import com.extjs.gxt.ui.client.widget.button.Button;
import com.extjs.gxt.ui.client.widget.form.FormPanel;
import com.extjs.gxt.ui.client.widget.form.HtmlEditor;
import com.extjs.gxt.ui.client.widget.form.TextField;
import com.extjs.gxt.ui.client.widget.layout.FitLayout;
import com.extjs.gxt.ui.client.widget.layout.FormData;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.RootPanel;

public class Popup implements EntryPoint {

  public void onModuleLoad() {
    final Window w = new Window();
    w.setPlain(true);
    w.setSize(500, 300);
    w.setHeading("Resize Me");
    w.setLayout(new FitLayout());

    FormPanel panel = new FormPanel();
    panel.setBorders(false);
    panel.setBodyBorder(false);
    panel.setLabelWidth(55);
    panel.setPadding(5);
    panel.setHeaderVisible(false);

    TextField<String> field = new TextField<String>();
    field.setFieldLabel("Sent To");
    panel.add(field, new FormData("100%"));

    field = new TextField<String>();
    field.setFieldLabel("Subject");
    panel.add(field, new FormData("100%"));

    HtmlEditor html = new HtmlEditor();
    html.setHideLabel(true);
    panel.add(html, new FormData("100% -53"));

    w.addButton(new Button("Send"));
    w.addButton(new Button("Cancel"));
    w.add(panel);

    Button b = new Button("Open", new SelectionListener<ButtonEvent>() {

      @Override
      public void componentSelected(ButtonEvent ce) {
        w.show();
      }

    });
    RootPanel.get().add(b);

  }
}

输出:

GWT PopupPanel
赞(0)
未经允许不得转载:srcmini » GWT PopupPanel用法

评论 抢沙发

评论前必须登录!