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
类构造函数
| Sr.No. | 构造函数 &描述 |
|---|---|
| 1 |
FocusPanel() 创建一个空的焦点面板。 |
| 2 |
FocusPanel(Widget child) 使用给定的子窗口小部件创建一个新的焦点面板。 |
类方法
| Sr.No. | 函数名称 &描述 |
|---|---|
| 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 处理程序) 添加 DoubleClickEvent 处理程序。 |
| 5 |
HandlerRegistration addFocusHandler(FocusHandler 处理程序) 添加 FocusEvent 处理程序。 |
| 6 |
void addFocusListener (FocusListener 监听器) 已弃用。改用 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 处理程序) 添加 KeyDownEvent 处理程序。 |
| 9 |
HandlerRegistration addKeyPressHandler (KeyPressHandler 处理程序) 添加 KeyPressEvent 处理程序。 |
| 10 |
HandlerRegistration addKeyUpHandler (KeyUpHandler 处理程序) 添加 KeyUpEvent 处理程序。 |
| 11 |
HandlerRegistration addMouseDownHandler (MouseDownHandler 处理程序) 添加 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)< /p> 已弃用。改用 addMouseWheelHandler (com.google.gwt.event.dom.client.MouseWheelHandler) |
| 19 |
< p>int getTabIndex()
获取小部件在选项卡索引中的位置。 |
| 20 |
void removeClickListener(ClickListener listener) 已弃用。改为对 addClickHandler (com.google.gwt.event.dom.client.ClickHandler) 返回的对象使用 HandlerRegistration.removeHandler() 方法 |
| 21 |
void removeFocusListener(FocusListener listener) 已弃用。对 addFocusHandler 返回的对象使用 HandlerRegistration.removeHandler() 方法(com.google.gwt.event.dom.client.FocusHandler) |
| 22 |
void removeKeyboardListener(KeyboardListener listener) 已弃用。改用 add*Handler 方法返回的对象上的 HandlerRegistration.removeHandler() 方法 |
| 23 | void removeMouseListener(MouseListener listener) 已弃用。请对 add*Handler 方法返回的对象使用 HandlerRegistration.removeHandler() 方法 td> |
| 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);
// 将小部件添加到根面板。
RootPanel.get().add(decoratorPanel);
}
}
完成所有更改后,让我们像在 GWT - 创建应用程序 一章中一样,在开发模式下编译并运行应用程序。如果您的应用程序一切正常,这将产生以下结果 −

gwt_layout_panels.html