GWT - FocusPanel Widget

Advertisements


Introduction

The FocusPanel widget represents a simple panel that makes its contents focusable, and adds the ability to catch mouse and keyboard events.

Class declaration

Following is the declaration for com.google.gwt.user.client.ui.FocusPanel class:

public class FocusPanel
   extends SimplePanel
      implements HasFocus, SourcesClickEvents, 
         SourcesMouseEvents, SourcesMouseWheelEvents, 
            HasAllMouseHandlers, HasClickHandlers, 
               HasDoubleClickHandlers, HasAllKeyHandlers,
                  HasAllFocusHandlers

Class constructors

S.N.Constructor & Description
1FocusPanel()
Creates an empty focus panel.
2FocusPanel(Widget child)
Creates a new focus panel with the given child widget.

Class methods

S.N.Function name & Description
1HandlerRegistration addBlurHandler(BlurHandler handler)
Adds a BlurEvent handler.
2HandlerRegistration addClickHandler(ClickHandler handler)
Adds a ClickEvent handler.
3void addClickListener(ClickListener listener)
Deprecated. Use addClickHandler(com.google.gwt.event.dom.client.ClickHandler) instead
4HandlerRegistration addDoubleClickHandler(DoubleClickHandler handler)
Adds a DoubleClickEvent handler.
5HandlerRegistration addFocusHandler(FocusHandler handler)
Adds a FocusEvent handler.
6void addFocusListener(FocusListener listener)
Deprecated. Use addFocusHandler(com.google.gwt.event.dom.client.FocusHandler) instead
7void addKeyboardListener(KeyboardListener listener)
Deprecated. Use addKeyDownHandler(com.google.gwt.event.dom.client.KeyDownHandler), addKeyUpHandler(com.google.gwt.event.dom.client.KeyUpHandler) and addKeyPressHandler(com.google.gwt.event.dom.client.KeyPressHandler) instead
8HandlerRegistration addKeyDownHandler(KeyDownHandler handler)
Adds a KeyDownEvent handler.
9HandlerRegistration addKeyPressHandler(KeyPressHandler handler)
Adds a KeyPressEvent handler.
10HandlerRegistration addKeyUpHandler(KeyUpHandler handler)
Adds a KeyUpEvent handler.
11HandlerRegistration addMouseDownHandler(MouseDownHandler handler)
Adds a MouseDownEvent handler.
12void addMouseListener(MouseListener listener)
Deprecated. Use addMouseOverHandler(com.google.gwt.event.dom.client.MouseOverHandler), addMouseMoveHandler(com.google.gwt.event.dom.client.MouseMoveHandler), addMouseDownHandler(com.google.gwt.event.dom.client.MouseDownHandler), addMouseUpHandler(com.google.gwt.event.dom.client.MouseUpHandler) and addMouseOutHandler(com.google.gwt.event.dom.client.MouseOutHandler) instead
13HandlerRegistration addMouseMoveHandler(MouseMoveHandler handler)
Adds a MouseMoveEvent handler.
14HandlerRegistration addMouseOutHandler(MouseOutHandler handler)
Adds a MouseOutEvent handler.
15HandlerRegistration addMouseOverHandler(MouseOverHandler handler)
Adds a MouseOverEvent handler.
16HandlerRegistration addMouseUpHandler(MouseUpHandler handler)
Adds a MouseUpEvent handler.
17HandlerRegistration addMouseWheelHandler(MouseWheelHandler handler)
Adds a MouseWheelEvent handler.
18void addMouseWheelListener(MouseWheelListener listener)
Deprecated. Use addMouseWheelHandler(com.google.gwt.event.dom.client.MouseWheelHandler) instead
19int getTabIndex()
Gets the widget's position in the tab index.
20void removeClickListener(ClickListener listener)
Deprecated. Use the HandlerRegistration.removeHandler() method on the object returned by addClickHandler(com.google.gwt.event.dom.client.ClickHandler) instead
21void removeFocusListener(FocusListener listener)
Deprecated. Use the HandlerRegistration.removeHandler() method on the object returned by addFocusHandler(com.google.gwt.event.dom.client.FocusHandler) instead
22void removeKeyboardListener(KeyboardListener listener)
Deprecated. Use the HandlerRegistration.removeHandler() method on the object returned by an add*Handler method instead
23void removeMouseListener(MouseListener listener)
Deprecated. Use the HandlerRegistration.removeHandler() method on the object returned by an add*Handler method instead
24void removeMouseWheelListener(MouseWheelListener listener)
Deprecated. Use the HandlerRegistration.removeHandler() method on the object returned by addMouseWheelHandler(com.google.gwt.event.dom.client.MouseWheelHandler) instead
25void setAccessKey(char key)
Sets the widget's 'access key'.
26void setFocus(boolean focused)
Explicitly focus/unfocus this widget.
27void setTabIndex(int index)
Sets the widget's position in the tab index.

Methods inherited

This class inherits methods from the following 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

FocusPanel Widget Example

This example will take you through simple steps to show usage of a FocusPanel Widget in GWT. Follow the following steps to update the GWT application we created in GWT - Create Application chapter:

StepDescription
1Create a project with a name HelloWorld under a package com.tutorialspoint as explained in the GWT - Create Application chapter.
2Modify HelloWorld.gwt.xml, HelloWorld.css, HelloWorld.html and HelloWorld.java as explained below. Keep rest of the files unchanged.
3Compile and run the application to verify the result of the implemented logic.

Following is the content of the modified module descriptor 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>

Following is the content of the modified Style Sheet file 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;
}

Following is the content of the modified HTML host file 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>FocusPanel Widget Demonstration</h1>
<div id="gwtContainer"></div>

</body>
</html>

Let us have following content of Java file src/com.tutorialspoint/HelloWorld.java which will demonstrate use of FocusPanel widget.

package com.tutorialspoint.client;

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

public class HelloWorld implements EntryPoint {

   public void onModuleLoad() {
      // Create text 
      HTML contents = new HTML("This is a FocusPanel."
      +" Click on the panel and it will attain focus.");

      //create focus panel with content
      FocusPanel focusPanel = new FocusPanel(contents);
      focusPanel.setSize("400px", "100px");

      DecoratorPanel decoratorPanel = new DecoratorPanel();

      decoratorPanel.add(focusPanel);

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

Once you are ready with all the changes done, let us compile and run the application in development mode as we did in GWT - Create Application chapter. If everything is fine with your application, this will produce following result:

GWT FocusPanel Widget

Advertisements
Advertisements