GWT-アンカーウィジェット

前書き

単純な<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.	Constructor & Description
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.	Function name & Description
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>要素をラップするアンカーウィジェットを作成します。

継承されるメソッド

このクラスは、次のクラスからメソッドを継承します-

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

アンカーウィジェットの例

この例では、GWTでアンカーウィジェットの使用方法を示す簡単な手順を紹介します。次の手順に従って、_GWTで作成したGWTアプリケーションを更新します-アプリケーションの作成_の章-

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

以下は、変更されたモジュール記述子 src/com.finddevguides/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.finddevguides.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/HelloWorldl の内容です。

<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.finddevguides/HelloWorld.java の内容を以下に示します。

package com.finddevguides.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 finddevguides
     //set asHtml as false,
     //href as www.finddevguides.com,
     //target as _blank
      Anchor anchor = new Anchor("finddevguides",
                                 false,
                                 "http://www.finddevguides.com",
                                 "_blank");
     //Add anchor to the root panel.
      VerticalPanel panel = new VerticalPanel();
      panel.add(anchor);

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

すべての変更が完了したら、link：/gwt/gwt_create_application [GWT-アプリケーションの作成]の章で行ったように、アプリケーションをコンパイルして開発モードで実行します。すべてがあなたのアプリケーションでうまくいけば、これは次の結果を生成します-

GWTアンカーウィジェット

Gwt-anchor-widget