GWT - obsługa zdarzeń

GWT zapewnia model obsługi zdarzeń podobny do frameworków Java AWT lub SWING User Interface.

Interfejs nasłuchiwania definiuje jedną lub więcej metod, które widget wywołuje w celu ogłoszenia zdarzenia. GWT zawiera listę interfejsów odpowiadających różnym możliwym zdarzeniom.
Klasa, która chce odbierać zdarzenia określonego typu, implementuje powiązany interfejs modułu obsługi, a następnie przekazuje do widżetu odniesienie do siebie, aby zasubskrybować zestaw zdarzeń.

Na przykład Button klasa publikuje click eventswięc będziesz musiał napisać klasę, aby zaimplementować ClickHandler do obsługiclick zdarzenie.

Interfejsy obsługi zdarzeń

Wszystkie programy obsługi zdarzeń GWT zostały rozszerzone z interfejsu EventHandler , a każdy program obsługi ma tylko jedną metodę z jednym argumentem. Ten argument jest zawsze obiektem skojarzonego typu zdarzenia. Każdyeventobiekt ma kilka metod manipulowania przekazanym obiektem zdarzenia. Na przykład dla zdarzenia kliknięcia będziesz musiał napisać procedurę obsługi w następujący sposób -

/**
 * create a custom click handler which will call 
 * onClick method when button is clicked.
 */
public class MyClickHandler implements ClickHandler {
   @Override
   public void onClick(ClickEvent event) {
      Window.alert("Hello World!");
   }
}

Teraz zadzwoni każda klasa, która chce otrzymywać zdarzenia kliknięcia addClickHandler() zarejestrować procedurę obsługi zdarzeń w następujący sposób -

/**
 * create button and attach click handler
 */
Button button = new Button("Click Me!");
button.addClickHandler(new MyClickHandler());

Każdy widget obsługujący typ zdarzenia będzie miał metodę w postaci dodawania HandlerRegistrationFooTreser(FooWydarzenie) gdzie Foo to rzeczywiste zdarzenie, takie jak kliknięcie, błąd, naciśnięcie klawisza itp.

Poniżej znajduje się lista ważnych programów obsługi zdarzeń GWT i powiązanych zdarzeń oraz metod rejestracji modułu obsługi -

Sr.No.	Interfejs wydarzenia	Metoda i opis wydarzenia
1	Przed programem obsługi wyboru <I>	void on Before Selection (Before Selection Event<I> event); Wywoływana, gdy uruchamiany jest BeforeSelectionEvent.
2	BlurHandler	void on Blur(Blur Event event); Wywoływana po uruchomieniu zdarzenia Blur.
3	ChangeHandler	void on Change(ChangeEvent event); Wywoływane, gdy uruchamiane jest zdarzenie zmiany.
4	ClickHandler	void on Click(ClickEvent event); Wywoływane po uruchomieniu zdarzenia kliknięcia natywnego.
5	CloseHandler <T>	void on Close(CloseEvent<T> event); Wywoływana po uruchomieniu CloseEvent.
6	Program obsługi menu kontekstowego	void on Context Menu(Context Menu Event event); Wywoływane, gdy uruchamiane jest zdarzenie natywnego menu kontekstowego.
7	Obsługa podwójnego kliknięcia	void on Double Click(Double Click Event event); Wywoływane, gdy uruchamiane jest zdarzenie dwukrotnego kliknięcia.
8	Obsługa błędów	void on Error(Error Event event); Wywoływane po uruchomieniu zdarzenia błędu.
9	Focus Handler	void on Focus(Focus Event event); Wywoływane po uruchomieniu zdarzenia Focus.
10	Panel formularza. Prześlij kompletną obsługę	void on Submit Complete(Form Panel.Submit Complete Event event); Uruchamiane po pomyślnym przesłaniu formularza.
11	FormPanel.SubmitHandler	void on Submit(Form Panel.Submit Event event); Uruchamiane po przesłaniu formularza.
12	Key Down Handler	void on Key Down(Key Down Event event); Wywoływana, gdy jest uruchamiany KeyDownEvent.
13	KeyPressHandler	void on KeyPress(KeyPressEvent event); Wywoływana po uruchomieniu KeyPressEvent.
14	KeyUpHandler	void on KeyUp(KeyUpEvent event); Wywoływane po uruchomieniu zdarzenia KeyUpEvent.
15	LoadHandler	void on Load(LoadEvent event); Wywoływana po uruchomieniu LoadEvent.
16	MouseDownHandler	void on MouseDown(MouseDownEvent event); Wywoływane po uruchomieniu MouseDown.
17	MouseMoveHandler	void on MouseMove(MouseMoveEvent event); Wywoływana po uruchomieniu zdarzenia MouseMoveEvent.
18	MouseOutHandler	void on MouseOut(MouseOutEvent event); Wywoływana po uruchomieniu zdarzenia MouseOutEvent.
19	MouseOverHandler	void on MouseOver(MouseOverEvent event); Wywoływana po uruchomieniu zdarzenia MouseOverEvent.
20	MouseUpHandler	void on MouseUp(MouseUpEvent event); Wywoływana po uruchomieniu zdarzenia MouseUpEvent.
21	MouseWheelHandler	void on MouseWheel(MouseWheelEvent event); Wywoływana, gdy uruchamiany jest MouseWheelEvent.
22	ResizeHandler	void on Resize(ResizeEvent event); Uruchamiany po zmianie rozmiaru widżetu.
23	ScrollHandler	void on Scroll(ScrollEvent event); Wywoływana po uruchomieniu ScrollEvent.
24	SelectionHandler <I>	void on Selection(SelectionEvent<I> event); Wywoływana po uruchomieniu SelectionEvent.
25	ValueChangeHandler <I>	void on ValueChange(ValueChangeEvent<I> event); Wywoływana po uruchomieniu zdarzenia ValueChangeEvent.
26	Window.ClosingHandler	void on WindowClosing(Window.ClosingEvent event); Uruchamiany tuż przed zamknięciem okna przeglądarki lub przejściem do innej witryny.
27	Window.ScrollHandler	void on WindowScroll(Window.ScrollEvent event); Uruchamiane, gdy okno przeglądarki jest przewijane.

Metody zdarzeń

Jak wspomniano wcześniej, każda procedura obsługi ma jedną metodę z jednym argumentem, który przechowuje obiekt zdarzenia, na przykład void onClick (zdarzenie ClickEvent) lub void onKeyDown (zdarzenie KeyDownEvent) . Obiekty zdarzeń, takie jak ClickEvent i KeyDownEvent, mają kilka typowych metod, które są wymienione poniżej -

Sr.No.	Metoda i opis
1	protected void dispatch(ClickHandler handler) Ta metoda powinna być wywoływana tylko przez HandlerManager
2	DomEvent.Type <FooHandler> getAssociatedType() Ta metoda zwraca typ użyty do rejestracji Foo zdarzenie.
3	static DomEvent.Type<FooHandler> getType() Ta metoda pobiera typ zdarzenia powiązany z Foo wydarzenia.
4	public java.lang.Object getSource() Ta metoda zwraca źródło, które ostatnio wywołało to zdarzenie.
5	protected final boolean isLive() Ta metoda zwraca informację, czy zdarzenie jest aktywne.
6	protected void kill() Ta metoda zabija wydarzenie

Przykład

Ten przykład poprowadzi Cię przez proste kroki, aby pokazać użycie pliku Click Wydarzenie i KeyDownObsługa zdarzeń w GWT. Wykonaj następujące kroki, aby zaktualizować aplikację GWT, którą utworzyliśmy w GWT - rozdział Tworzenie aplikacji -

Krok	Opis
1	Utwórz projekt o nazwie HelloWorld pod pakietem com.tutorialspoint, jak wyjaśniono w rozdziale GWT - Tworzenie aplikacji .
2	Zmodyfikuj HelloWorld.gwt.xml , HelloWorld.css , HelloWorld.html i HelloWorld.java, jak wyjaśniono poniżej. Resztę plików nie zmieniaj.
3	Skompiluj i uruchom aplikację, aby zweryfikować wynik zaimplementowanej logiki.

Poniżej znajduje się treść zmodyfikowanego deskryptora modułu 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>

Poniżej znajduje się zawartość zmodyfikowanego pliku arkusza stylów 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;
}

Poniżej znajduje się zawartość zmodyfikowanego pliku hosta HTML 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>Event Handling Demonstration</h1>
      <div id = "gwtContainer"></div>
   </body>
</html>

Miejmy następującą zawartość pliku Java src/com.tutorialspoint/HelloWorld.java który zademonstruje użycie obsługi zdarzeń w GWT.

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.event.dom.client.KeyCodes;
import com.google.gwt.event.dom.client.KeyDownEvent;
import com.google.gwt.event.dom.client.KeyDownHandler;
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.RootPanel;
import com.google.gwt.user.client.ui.TextBox;
import com.google.gwt.user.client.ui.VerticalPanel;

public class HelloWorld implements EntryPoint {
   public void onModuleLoad() {
      /**
       * create textbox and attach key down handler
       */
      TextBox textBox = new TextBox(); 
      textBox.addKeyDownHandler(new MyKeyDownHandler());

      /*
       * create button and attach click handler
       */
      Button button = new Button("Click Me!");
      button.addClickHandler(new MyClickHandler());

      VerticalPanel panel = new VerticalPanel();
      panel.setSpacing(10);
      panel.setHorizontalAlignment(HasHorizontalAlignment.ALIGN_CENTER);
      panel.setSize("300", "100");
      panel.add(textBox);
      panel.add(button);

      DecoratorPanel decoratorPanel = new DecoratorPanel();
      decoratorPanel.add(panel);
      RootPanel.get("gwtContainer").add(decoratorPanel);
   }

   /** 
    * create a custom click handler which will call 
    * onClick method when button is clicked.
    */
   private class MyClickHandler implements ClickHandler {
      @Override
      public void onClick(ClickEvent event) {
         Window.alert("Hello World!");
      }
   }

   /**
    * create a custom key down handler which will call 
    * onKeyDown method when a key is down in textbox.
    */
   private class MyKeyDownHandler implements KeyDownHandler {
      @Override
      public void onKeyDown(KeyDownEvent event) {
         if(event.getNativeKeyCode() == KeyCodes.KEY_ENTER){
            Window.alert(((TextBox)event.getSource()).getValue());
         }
      }
   }
}

Gdy będziesz gotowy ze wszystkimi wprowadzonymi zmianami, skompilujmy i uruchom aplikację w trybie programistycznym, tak jak zrobiliśmy to w GWT - rozdział Tworzenie aplikacji . Jeśli wszystko jest w porządku z twoją aplikacją, da to następujący wynik -