GWT - 锚小部件



引言

Anchor 小部件表示一个简单的 <a> 元素。

类声明

以下是用于 com.google.gwt.user.client.ui.Anchor 类的声明 -

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

CSS 样式规则

以下默认 CSS 样式规则将应用于所有 Image 小部件。您可以根据要求对其进行覆盖。

.gwt-Anchor { }

类构造函数

序号。 构造函数和说明
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)

使用框架目标创建一个源锚。

类方法

序号。 函数名称和说明
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)

创建一个 Anchor 小部件,用于包装现有的 <a> 元素。

继承的方法

此类从以下类继承方法 -

  • com.google.gwt.user.client.ui.UIObject

  • com.google.gwt.user.client.ui.Widget

  • com.google.gwt.user.client.ui.FocusWidget

Anchor 窗口小部件示例

本示例将引导您完成简单的步骤,以展示如何在 GWT 中使用 Anchor 窗口小部件。按照以下步骤更新我们在GWT - 创建应用程序章节中创建的 GWT 应用程序 -

步骤 说明
1 com.tutorialspoint包下使用名称HelloWorld创建一个项目,如GWT - 创建应用程序章节中所述。
2 修改HelloWorld.gwt.xml, HelloWorld.css, HelloWorld.htmlHelloWorld.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() {
      // Create a Anchor widget, 
      // pass text as TutorialsPoint  
      // set asHtml as false, 
      // href as www.tutorialspoint.com, 
      // target as _blank
      Anchor anchor = new Anchor("TutorialsPoint",
                                 false,
                                 "https://tutorialspoint.com",
                                 "_blank");
      // Add anchor to the root panel.
      VerticalPanel panel = new VerticalPanel();
      panel.add(anchor);

      RootPanel.get("gwtContainer").add(panel);
   }	
}

一旦你完成了所有的更改,让我们在开发模式下编译并运行应用程序,就像我们在 GWT - 创建应用程序 章节中所做的那样。如果你的应用程序一切正常,将产生以下结果 -

GWT Anchor Widget
gwt_basic_widgets.htm
广告