GWT - Widget d'ancrage

introduction

le Anchor widget qui représente un élément <a> simple.

Déclaration de classe

Voici la déclaration pour com.google.gwt.user.client.ui.Anchor classe -

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

Règles de style CSS

La règle de style CSS par défaut suivante sera appliquée à tous les widgets Image. Vous pouvez le remplacer selon vos besoins.

.gwt-Anchor { }

Constructeurs de classe

N ° Sr.	Constructeur et description
1	Anchor() Crée une ancre vide.
2	protected Anchor(Element element) Ce constructeur peut être utilisé par des sous-classes pour utiliser explicitement un élément existant.
3	Anchor(java.lang.String text) Crée une ancre pour le script.
4	Anchor(java.lang.String text, boolean asHtml) Crée une ancre pour le script.
5	Anchor(java.lang.String text, boolean asHTML, java.lang.String href) Crée une ancre avec son texte et href (URL cible) spécifiés.
6	Anchor(java.lang.String text, boolean asHtml, java.lang.String href, java.lang.String target) Crée une ancre source (lien vers l'URI).
sept	Anchor(java.lang.String text, java.lang.String href) Crée une ancre avec son texte et href (URL cible) spécifiés.
8	Anchor(java.lang.String text, java.lang.String href, java.lang.String target) Crée une ancre source avec une cible d'image.

Méthodes de classe

N ° Sr.	Nom et description de la fonction
1	HasDirection.Direction getDirection() Obtient la directionnalité du widget.
2	HasHorizontalAlignment.HorizontalAlignmentConstant getHorizontalAlignment() Obtient l'alignement horizontal.
3	java.lang.String getHref() Obtient le href de l'ancre (l'url à laquelle il est lié).
4	java.lang.String getHTML() Obtient le contenu de cet objet au format HTML.
5	java.lang.String getName() Obtient le nom du widget.
6	int getTabIndex() Obtient la position du widget dans l'index de l'onglet.
sept	java.lang.String getTarget() Obtient le cadre cible de l'ancre (le cadre dans lequel la navigation se produira lorsque le lien est sélectionné).
8	java.lang.String getText() Obtient le texte de cet objet.
9	boolean getWordWrap() Obtient si le retour à la ligne est activé.
dix	void setAccessKey(char key) Définit la «clé d'accès» du widget.
11	void setFocus(boolean focused) Focalisez / détachez explicitement ce widget.
12	void setHorizontalAlignment(HasHorizontalAlignment. HorizontalAlignmentConstant align) Définit l'alignement horizontal.
13	void setHref(java.lang.String href) Définit le href de l'ancre (l'url à laquelle elle est liée).
14	void setHTML(java.lang.String html) Définit le contenu de cet objet via HTML.
15	void setName(java.lang.String name) Définit le nom du widget.
16	void setTabIndex(int index) Définit la position du widget dans l'index de l'onglet.
17	void setText(java.lang.String text) Définit le texte de cet objet.
18	void setWordWrap(boolean wrap) Définit si le retour à la ligne est activé.
19	static Anchor wrap(Element element) Crée un widget Anchor qui encapsule un élément <a> existant.

Méthodes héritées

Cette classe hérite des méthodes des classes suivantes -

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

Exemple de widget d'ancrage

Cet exemple vous guidera à travers des étapes simples pour montrer l'utilisation d'un widget d'ancrage dans GWT. Suivez les étapes suivantes pour mettre à jour l'application GWT que nous avons créée dans GWT - Chapitre Créer une application -

Étape	La description
1	Créez un projet avec un nom HelloWorld sous un package com.tutorialspoint comme expliqué dans le chapitre GWT - Créer une application .
2	Modifiez HelloWorld.gwt.xml , HelloWorld.css , HelloWorld.html et HelloWorld.java comme expliqué ci-dessous. Gardez le reste des fichiers inchangé.
3	Compilez et exécutez l'application pour vérifier le résultat de la logique implémentée.

Voici le contenu du descripteur de module modifié 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>

Voici le contenu du fichier de feuille de style modifié 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;
}

Voici le contenu du fichier hôte HTML modifié 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>

Laissez-nous avoir le contenu suivant du fichier Java src/com.tutorialspoint/HelloWorld.java qui démontrera l'utilisation du widget 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,
                                 "http://www.tutorialspoint.com",
                                 "_blank");
      // Add anchor to the root panel.
      VerticalPanel panel = new VerticalPanel();
      panel.add(anchor);

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

Une fois que vous êtes prêt avec tous les changements effectués, laissez-nous compiler et exécuter l'application en mode développement comme nous l'avons fait dans le chapitre GWT - Créer une application . Si tout va bien avec votre application, cela produira le résultat suivant -

↰ Previous page