GWT - Anchor 小部件

简介

代表简单 <a> 元素的 Anchor 小部件。

类声明

以下是 com.google.gwt.user.client.ui.Anchor 类的声明 −

public class Anchor
   extends FocusWidget
      implements HasHorizontalAlignment, HasName,
	     HasHTML, HasWordWrap, HasDirection

CSS 样式规则

以下默认 CSS 样式规则将应用于所有图像小部件。您可以根据需要覆盖它。

.gwt-Anchor { }

类构造函数

Sr.No.	构造函数 &描述
1	Anchor() 创建一个空锚点。
2	protected Anchor(Element element) 子类可以使用此构造函数来明确使用现有元素。
3	Anchor(java.lang.String text) 创建一个用于脚本的锚点。
4	Anchor(java.lang.String text, boolean asHtml) 创建用于脚本的锚点。
5	Anchor(java.lang.String text, boolean asHTML, java.lang.String href) 创建指定了文本和 href(目标 URL)的锚点。
6	Anchor(java.lang.String text, boolean asHtml, java.lang.String href, java.lang.String target) 创建源锚点(链接到URI)。
7	Anchor(java.lang.String text, java.lang.String href) 创建一个指定了文本和 href(目标 URL)的锚点。
8	Anchor(java.lang.String text, java.lang.String href, java.lang.String target) 创建一个带有框架目标的源锚点。

类方法

Sr.No.	函数名称 &描述
1	HasDirection.Direction getDirection() 获取小部件的方向性。
2	HasHorizontalAlignment.HorizontalAlignmentConstant getHorizontalAlignment() 获取水平对齐。
3	java.lang.String getHref() 获取锚点的 href(它链接到的 url)。
4	java.lang.String getHTML() 以 HTML 格式获取此对象的内容。
5	java.lang.String getName() 获取小部件的名称。
6	int getTabIndex() 获取小部件在选项卡索引中的位置。
7	java.lang.String getTarget() 获取锚点的目标框架(选择链接时将在其中进行导航的框架)。
8	java.lang.String getText() 获取此对象的文本。
9	boolean getWordWrap() 获取是否启用自动换行。
10	void setAccessKey(char key) 设置小部件的"访问键"。
11	void setFocus(boolean focused) 明确聚焦/取消聚焦此小部件。
12	void setHorizontalAlignment(HasHorizontalAlignment. HorizontalAlignmentConstant align) 设置水平对齐。
13	void setHref(java.lang.String href) 设置锚点的 href(它链接到的 url)。
14	void setHTML(java.lang.String html) 通过 HTML 设置此对象的内容。
15	void setName(java.lang.String name) 设置小部件的名称。
16	void setTabIndex(int index) 设置小部件在选项卡中的位置索引。
17	void setText(java.lang.String text) 设置此对象的文本。
18	void setWordWrap(boolean wrap) 设置是否启用自动换行。
19	static Anchor wrap(Element element) 创建一个包装现有 <a> 元素的 Anchor 小部件。

继承的方法

该类继承了以下类的方法 −

com.google.gwt.user.client.ui.UIObject
com.google.gwt.user.client.ui.Widget
com.google.gwt.user.client.ui.FocusWidget

Anchor Widget 示例

此示例将带您通过简单的步骤展示 GWT 中 Anchor Widget 的使用方法。按照以下步骤更新我们在 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 nam e=' 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>Anchor Widget Demonstration</h1>
      <div id = "gwtContainer"></div>
   </body>
</html>

让我们来看看 Java 文件 src/com.tutorialspoint/HelloWorld.java 的以下内容，它将演示如何使用 Anchor 小部件。

package com.tutorialspoint.client;

import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.user.client.ui.Anchor;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.VerticalPanel;

public class HelloWorld implements EntryPoint {
   public void onModuleLoad() {
        // 创建一个 Anchor 小部件，
        // 将文本作为 TutorialsPoint 传递
        // 将 asHtml 设置为 false，
        // href 为 www.tutorialspoint.com，
        // target 为 _blank
        Anchor anchor = new Anchor("TutorialsPoint",
                                 false,
                                 "http://www.tutorialspoint.com",
                                 "_blank");
        // 将锚点添加到根面板。
        VerticalPanel panel = new VerticalPanel();
        panel.add(anchor);
        
        RootPanel.get("gwtContainer").add(panel);
   }	
}

完成所有更改后，让我们像在 GWT - 创建应用程序一章中一样，在开发模式下编译并运行应用程序。如果您的应用程序一切正常，这将产生以下结果 −