GWT - FocusPanel 组件

上一页
下一页

简介

FocusPanel 组件表示一个简单的面板，使它的内容可聚焦，并增加了捕获鼠标和键盘事件的能力。

类声明

以下是 com.google.gwt.user.client.ui.FocusPanel 类的声明：

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

类构造函数

序号 构造函数 & 描述
1

FocusPanel()

创建一个空的焦点面板。
2

FocusPanel(Widget child)

使用给定的子组件创建一个新的焦点面板。

类方法

序号 函数名称 & 描述
1

HandlerRegistration addBlurHandler(BlurHandler handler)

添加一个 BlurEvent 处理程序。
2

HandlerRegistration addClickHandler(ClickHandler handler)

添加一个 ClickEvent 处理程序。
3

void addClickListener(ClickListener listener)

已弃用。请使用 addClickHandler (com.google.gwt.event.dom.client.ClickHandler) 代替
4

HandlerRegistration addDoubleClickHandler (DoubleClickHandler handler)

添加一个 DoubleClickEvent 处理程序。
5

HandlerRegistration addFocusHandler(FocusHandler handler)

添加一个 FocusEvent 处理程序。
6

void addFocusListener (FocusListener listener)

已弃用。请使用 addFocusHandler(com.google.gwt.event.dom.client.FocusHandler) 代替
7

void addKeyboardListener (KeyboardListener listener)

已弃用。请使用 addKeyDownHandler (com.google.gwt.event.dom.client.KeyDownHandler), addKeyUpHandler (com.google.gwt.event.dom.client.KeyUpHandler) 和 addKeyPressHandler (com.google.gwt.event.dom.client.KeyPressHandler) 代替
8

HandlerRegistration addKeyDownHandler (KeyDownHandler handler)

添加一个 KeyDownEvent 处理程序。
9

HandlerRegistration addKeyPressHandler (KeyPressHandler handler)

添加一个 KeyPressEvent 处理程序。
10

HandlerRegistration addKeyUpHandler (KeyUpHandler handler)

添加一个 KeyUpEvent 处理程序。
11

HandlerRegistration addMouseDownHandler (MouseDownHandler handler)

添加一个 MouseDownEvent 处理程序。
12

void addMouseListener(MouseListener listener)

已弃用。请使用 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) 和 addMouseOutHandler (com.google.gwt.event.dom.client.MouseOutHandler) 代替
13

HandlerRegistration addMouseMoveHandler(MouseMoveHandler handler)

添加一个 MouseMoveEvent 处理程序。
14

HandlerRegistration addMouseOutHandler(MouseOutHandler handler)

添加一个 MouseOutEvent 处理程序。
15

HandlerRegistration addMouseOverHandler(MouseOverHandler handler)

添加一个 MouseOverEvent 处理程序。
16

HandlerRegistration addMouseUpHandler(MouseUpHandler handler)

添加一个 MouseUpEvent 处理程序。
17

HandlerRegistration addMouseWheelHandler(MouseWheelHandler handler)

添加一个 MouseWheelEvent 处理程序。
18

void addMouseWheelListener(MouseWheelListener listener)

已弃用。请使用 addMouseWheelHandler (com.google.gwt.event.dom.client.MouseWheelHandler) 代替
19

int getTabIndex()

获取组件在选项卡索引中的位置。
20

void removeClickListener(ClickListener listener)

已弃用。请使用 addClickHandler (com.google.gwt.event.dom.client.ClickHandler) 返回的对象上的 HandlerRegistration.removeHandler() 方法代替
21

void removeFocusListener(FocusListener listener)

已弃用。请使用 addFocusHandler (com.google.gwt.event.dom.client.FocusHandler) 返回的对象上的 HandlerRegistration.removeHandler() 方法代替
22

void removeKeyboardListener(KeyboardListener listener)

已弃用。请使用 add*Handler 方法返回的对象上的 HandlerRegistration.removeHandler() 方法代替
23

void removeMouseListener(MouseListener listener)

已弃用。请使用 add*Handler 方法返回的对象上的 HandlerRegistration.removeHandler() 方法代替
24

void removeMouseWheelListener(MouseWheelListener listener)

已弃用。请使用 addMouseWheelHandler (com.google.gwt.event.dom.client.MouseWheelHandler) 返回的对象上的 HandlerRegistration.removeHandler() 方法代替
25

void setAccessKey(char key)

设置组件的“访问键”。
26

void setFocus(boolean focused)

显式地聚焦/取消聚焦此组件。
27

void setTabIndex(int index)

设置组件在选项卡索引中的位置。

继承的方法

此类继承自以下类：

  • 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 组件示例

此示例将引导您完成简单的步骤，以展示如何在 GWT 中使用 FocusPanel 组件。按照以下步骤更新我们在“GWT - 创建应用程序”一章中创建的 GWT 应用程序：

步骤 描述
1 在 com.tutorialspoint 包下创建一个名为 HelloWorld 的项目，如“GWT - 创建应用程序”一章中所述。
2 修改 HelloWorld.gwt.xml、HelloWorld.css、HelloWorld.html 和 HelloWorld.java，如下所述。保持其余文件不变。
3 编译并运行应用程序以验证已实现逻辑的结果。

以下是修改后的模块描述符 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>

以下是修改后的样式表文件 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;
}

以下是修改后的 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>FocusPanel Widget Demonstration</h1>
      <div id = "gwtContainer"></div>
   </body>
</html>

让我们在 Java 文件 src/com.tutorialspoint/HelloWorld.java 中添加以下内容，它将演示 FocusPanel 组件的使用。

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);
   }        
}

准备好所有更改后，让我们像在 GWT - 创建应用程序 一章中那样，在开发模式下编译并运行应用程序。如果应用程序一切正常，则会产生以下结果：

GWT FocusPanel Widget
gwt_layout_panels.htm
打印页面
上一页
下一页
广告