GWT - Widget PopupPanel

Introdução

o PopupPanel widget representa um painel que pode pop upsobre outros widgets. Ele se sobrepõe à área do cliente do navegador (e quaisquer pop-ups criados anteriormente).

Declaração de Classe

A seguir está a declaração para com.google.gwt.user.client.ui.PopupPanel classe -

public class PopupPanel
   extends SimplePanel
      implements SourcesPopupEvents, EventPreview, 
         HasAnimation, HasCloseHandlers<PopupPanel>

Construtores de classe

Sr. Não. Construtor e descrição
1

PopupPanel()

Cria um painel pop-up vazio.
2

PopupPanel(boolean autoHide)

Cria um painel pop-up vazio, especificando seu auto-hide propriedade.
3

PopupPanel(boolean autoHide, boolean modal)

Cria um painel pop-up vazio, especificando seu auto-hide e modal propriedades.

Métodos de aula

Sr. Não. Nome e descrição da função
1

void addAutoHidePartner(Element partner)

Os eventos de mouse que ocorrem em um parceiro autoHide não ocultam um painel definido como autoHide.
2

HandlerRegistration addCloseHandler( CloseHandler <PopupPanel> handler)

Adiciona um manipulador CloseEvent.
3

void addPopupListener(PopupListener listener)

Descontinuada. Use addCloseHandler (com.google.gwt.event. Logical.shared.CloseHandler) em vez disso
4

void center()

Centraliza o pop-up na janela do navegador e o mostra.
5

protected Element getContainerElement()

Substitua este método para especificar que um elemento diferente do elemento raiz seja o contêiner para o widget filho do painel.
6

protected Element getGlassElement()

Obtenha o elemento de vidro usado por este PopupPanel.
7

java.lang.String getGlassStyleName()

Obtém o nome do estilo a ser usado no elemento de vidro.
8

int getOffsetHeight()

Obtém a altura do deslocamento do painel em pixels.
9

int getOffsetWidth()

Obtém a largura do deslocamento do painel em pixels.
10

int getPopupLeft()

Obtém a posição esquerda do pop-up em relação à área cliente do navegador.
11

int getPopupTop()

Obtém a posição superior do pop-up em relação à área cliente do navegador.
12

protected Element getStyleElement()

Método de modelo que retorna o elemento ao qual os nomes de estilo serão aplicados.
13

java.lang.String getTitle()

Obtém o título associado a este objeto.
14

void hide()

Oculta o pop-up e o desanexa da página.
15

void hide(boolean autoClosed)

Oculta o pop-up e o desanexa da página.
16

boolean isAnimationEnabled()

Retorna verdadeiro se as animações estiverem habilitadas, falso caso contrário.
17

boolean isAutoHideEnabled()

Retorna verdadeiro se o pop-up deve ser ocultado automaticamente quando o usuário clica fora dele.
18

boolean isAutoHideOnHistoryEventsEnabled( )

Retorna verdadeiro se o pop-up deve ser ocultado automaticamente quando o token do histórico muda, como quando o usuário pressiona o botão Voltar do navegador.
19

boolean isGlassEnabled()

Retorna verdadeiro se um elemento de vidro for exibido no PopupPanel.
20

boolean isModal()

Retorna verdadeiro se eventos de teclado ou mouse que não visam o PopupPanel ou seus filhos devem ser ignorados.
21

boolean isPreviewingAllNativeEvents( )

Retorna verdadeiro se o pop-up deve visualizar todos os eventos nativos, mesmo se o evento já tiver sido consumido por outro pop-up.
22

boolean isShowing()

Determina se este pop-up está sendo exibido ou não.
23

boolean isVisible()

Determina se este pop-up está ou não visível.
24

boolean onEventPreview(Event event)

Descontinuada. Use onPreviewNativeEvent (com.google.gwt.user. Client.Event.NativePreviewEvent) em vez disso
25

boolean onKeyDownPreview(char key, int modifiers)

Descontinuada. Use onPreviewNativeEvent (com.google.gwt.user. Client.Event.NativePreviewEvent) em vez disso
26

boolean onKeyPressPreview(char key, int modifiers)

Descontinuada. Use onPreviewNativeEvent (com.google.gwt.user. Client.Event.NativePreviewEvent) em vez disso
27

boolean onKeyUpPreview(char key, int modifiers)

Descontinuada. Use onPreviewNativeEvent (com.google.gwt.user. Client.Event.NativePreviewEvent) em vez disso
28

protected void onPreviewNativeEvent(Event.NativePreviewEvent event)
29

protected void onUnload()

Este método é chamado imediatamente antes de um widget ser desanexado do documento do navegador.
30

void removeAutoHidePartner(Element partner)

Remova um parceiro autoHide.
31

void removePopupListener(PopupListener listener)

Descontinuada. Use o HandlerRegistration. método removeHandler () no objeto retornado por addCloseHandler (com.google.gwt.event. logical.shared.CloseHandler) em vez disso
32

void setAnimationEnabled(boolean enable)

Ative ou desative as animações.
33

void setAutoHideEnabled(boolean autoHide)

Habilite ou desabilite o recurso AutoHide.
34

void setAutoHideOnHistoryEventsEnabled( boolean enabled)

Habilite ou desabilite AutoHide em eventos de mudança de histórico.
35

void setGlassEnabled(boolean enabled)

Quando ativado, o plano de fundo será bloqueado com um painel semitransparente na próxima vez que for mostrado.
36

void setGlassStyleName(java.lang.String glassStyleName)

Define o nome do estilo a ser usado no elemento de vidro.
37

void setHeight(java.lang.String height)

Define a altura do widget filho do painel.
38

void setModal(boolean modal)

Quando o pop-up é modal, os eventos de teclado ou mouse que não têm como alvo o PopupPanel ou seus filhos serão ignorados.
39

void setPopupPosition(int left, int top)

Define a posição do pop-up em relação à área cliente do navegador.
40

void setPopupPositionAndShow(PopupPanel. PositionCallback callback)

Define a posição do pop-up usando um PopupPanel.PositionCallback e mostra o pop-up.
41

void setPreviewingAllNativeEvents(boolean previewAllNativeEvents)

Quando ativado, o pop-up irá visualizar todos os eventos nativos, mesmo se outro pop-up foi aberto após este.
42

void setTitle(java.lang.String title)

Define o título associado a este objeto.
43

void setVisible(boolean visible)

Define se este objeto é visível.
44

void setWidget(Widget w)

Define o widget deste painel.
45

void setWidth(java.lang.String width)

Define a largura do widget filho do painel.
46

void show()

Mostra o pop-up e o anexa à página.
47

void showRelativeTo(UIObject target)

Normalmente, o pop-up é posicionado diretamente abaixo do alvo relativo, com sua borda esquerda alinhada com a borda esquerda do alvo.

Métodos herdados

Esta classe herda métodos das seguintes classes -

  • com.google.gwt.user.client.ui.UIObject

  • com.google.gwt.user.client.ui.Widget

  • com.google.gwt.user.client.ui.Panel

  • com.google.gwt.user.client.ui.SimplePanel

  • java.lang.Object

Exemplo de widget PopupPanel

Este exemplo o levará por etapas simples para mostrar o uso de um widget PopupPanel no GWT. Siga as etapas a seguir para atualizar o aplicativo GWT que criamos no GWT - capítulo Criar aplicativo -

Degrau Descrição
1 Crie um projeto com o nome HelloWorld em um pacote com.tutorialspoint conforme explicado no capítulo GWT - Criar aplicativo .
2 Modifique HelloWorld.gwt.xml , HelloWorld.css , HelloWorld.html e HelloWorld.java conforme explicado abaixo. Mantenha o resto dos arquivos inalterados.
3 Compile e execute o aplicativo para verificar o resultado da lógica implementada.

A seguir está o conteúdo do descritor do módulo modificado src/com.tutorialspoint/HelloWorld.gwt.xml.

<?xml version = "1.0" encoding = "UTF-8"?>
<module rename-to = 'helloworld'>
   <!-- Inherit the core Web Toolkit stuff.                        -->
   <inherits name = 'com.google.gwt.user.User'/>

   <!-- Inherit the default GWT style sheet.                       -->
   <inherits name = 'com.google.gwt.user.theme.clean.Clean'/>

   <!-- Specify the app entry point class.                         -->
   <entry-point class = 'com.tutorialspoint.client.HelloWorld'/>

   <!-- Specify the paths for translatable code                    -->
   <source path = 'client'/>
   <source path = 'shared'/>

</module>

A seguir está o conteúdo do arquivo de folha de estilo modificado war/HelloWorld.css.

body {
   text-align: center;
   font-family: verdana, sans-serif;
}

h1 {
   font-size: 2em;
   font-weight: bold;
   color: #777777;
   margin: 40px 0px 70px;
   text-align: center;
}

.gwt-PopupPanel {
   border: 3px solid #000000;
   padding: 3px;
   background: white;
}

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

.gwt-PopupPanel .popupContent {
   border: none;
   padding: 3px;
   background: gray;	
}

A seguir está o conteúdo do arquivo host HTML modificado war/HelloWorld.html.

<html>
   <head>
      <title>Hello World</title>
      <link rel = "stylesheet" href = "HelloWorld.css"/>
      <script language = "javascript" src = "helloworld/helloworld.nocache.js">
      </script>
   </head>

   <body>
      <h1>PopupPanel Widget Demonstration</h1>
      <div id = "gwtContainer"></div>
   </body>
</html>

Vamos ter o seguinte conteúdo do arquivo Java src/com.tutorialspoint/HelloWorld.java que demonstrará o uso do widget PopupPanel.

package com.tutorialspoint.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.event.dom.client.ClickEvent;
import com.google.gwt.event.dom.client.ClickHandler;
import com.google.gwt.user.client.Window;
import com.google.gwt.user.client.ui.Button;
import com.google.gwt.user.client.ui.DecoratorPanel;
import com.google.gwt.user.client.ui.HasHorizontalAlignment;
import com.google.gwt.user.client.ui.Label;
import com.google.gwt.user.client.ui.PopupPanel;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.VerticalPanel;

public class HelloWorld implements EntryPoint {

   private static class MyPopup extends PopupPanel {

      public MyPopup() {
         // PopupPanel's constructor takes 'auto-hide' as its boolean 
         // parameter. If this is set, the panel closes itself 
         // automatically when the user clicks outside of it.         
         super(true);

         // PopupPanel is a SimplePanel, so you have to set it's widget 
         // property to whatever you want its contents to be.
         setWidget(new Label("Click outside of this popup to close it"));
      }
   }

   public void onModuleLoad() {
      Button b1 = new Button("Click me to show popup");
      b1.addClickHandler(new ClickHandler() {
         public void onClick(ClickEvent event) {
            // Instantiate the popup and show it.
             new MyPopup().show();
         }
      });

      Button b2 = new Button("Click me to show popup partway"
         +" across the screen");
      b2.addClickHandler(new ClickHandler() {
         public void onClick(ClickEvent event) {
            
            // Create the new popup.
            final MyPopup popup = new MyPopup();
            
            // Position the popup 1/3rd of the way down and across 
            // the screen, and show the popup. Since the position 
            // calculation is based on the offsetWidth and offsetHeight 
            // of the popup, you have to use the 
            // setPopupPositionAndShow(callback)  method. The alternative 
            // would be to call show(), calculate  the left and
            // top positions, and call setPopupPosition(left, top). 
            // This would have the ugly side effect of the popup jumping 
            
            // from its original position to its new position.
            popup.setPopupPositionAndShow(new PopupPanel.PositionCallback(){
               public void setPosition(int offsetWidth, int offsetHeight) {
                  int left = (Window.getClientWidth() - offsetWidth) / 3;
                  int top = (Window.getClientHeight() - offsetHeight) / 3;
                  popup.setPopupPosition(left, top);
               }
            });
         }
      });
      VerticalPanel panel = new VerticalPanel();
      panel.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
      panel.setSpacing(10);
      panel.add(b1);
      panel.add(b2);

      DecoratorPanel decoratorPanel = new DecoratorPanel();
      decoratorPanel.add(panel);
      
      // Add the widgets to the root panel.
      RootPanel.get().add(decoratorPanel);
   }
}

Quando você estiver pronto com todas as alterações feitas, vamos compilar e rodar o aplicativo em modo de desenvolvimento como fizemos no capítulo GWT - Criar Aplicativo . Se tudo estiver bem com sua aplicação, isso produzirá o seguinte resultado -