GWT - Widget CheckBox

introduction

le Checkbox widget représente une case à cocher standard.

Déclaration de classe

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

public class CheckBox
   extends ButtonBase
      implements HasName

Règles de style CSS

Les règles de style CSS par défaut suivantes seront appliquées à tous les widgets CheckBox. Vous pouvez le remplacer selon vos besoins.

.gwt-CheckBox {}

.gwt-CheckBox-disabled {}

Constructeurs de classe

N ° Sr.	Constructeur et description
1	CheckBox() Constructeur pour CheckkBox.
2	CheckBox(Element element) Ce constructeur peut être utilisé par des sous-classes pour utiliser explicitement un élément existant.
3	CheckBox(java.lang.String label) Crée une case à cocher avec le libellé de texte spécifié.
4	CheckBox(java.lang.String label, boolean asHTML) Crée une case à cocher avec le libellé de texte spécifié et définit son contenu au format HTML.

Méthodes de classe

N ° Sr.	Nom et description de la fonction
1	java.lang.String getName() Obtient le nom du widget.
2	int getTabIndex() Obtient la position du widget dans l'index de l'onglet.
3	java.lang.String getText() Obtient le texte de cet objet.
4	boolean isChecked() Détermine si cette case est actuellement cochée.
5	boolean isEnabled() Obtient si ce widget est activé.
6	protected void onEnsureDebugId(java.lang.String baseID) Éléments concernés: -label = étiquette à côté de la case à cocher.
sept	protected void onLoad() Cette méthode est appelée lorsqu'un widget est attaché au document du navigateur.
8	protected void onUnload() Cette méthode est appelée lorsqu'un widget est détaché du document du navigateur.
9	protected void replaceInputElement(Element elem) Remplacez l'élément d'entrée actuel par un nouveau.
dix	void setAccessKey(char key) Définit la «clé d'accès» du widget.
11	void setChecked(boolean checked) Coche ou décoche cette case.
12	void setEnabled(boolean enabled) Définit si ce widget est activé.
13	void setFocus(boolean focused) Focalisez / détachez explicitement ce widget.
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 sinkEvents(int eventBitsToAdd) Ajoute un ensemble d'événements à couler par cet objet.
19	java.lang.String getHTML() Obtient le contenu de cet objet au format HTML.

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
java.lang.Object

Exemple de widget CheckBox

Cet exemple vous guidera à travers des étapes simples pour montrer l'utilisation d'un widget CheckBox 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 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>

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;
}

.gwt-CheckBox{ 
   color:green;   
}

.gwt-CheckBox-disabled {
   color:green;
}

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>CheckBox 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 CheckBox.

package com.tutorialspoint.client;

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


public class HelloWorld implements EntryPoint {
   public void onModuleLoad() {
	  
      // Make a new check box, and select it by default.
      CheckBox checkBox1 = new CheckBox("Check Me!");
      CheckBox checkBox2 = new CheckBox("Check Me!");

      // set check box as selected
      checkBox1.setValue(true);

      //disable a checkbox
      checkBox2.setEnabled(false);

      checkBox1.addClickHandler(new ClickHandler() {

         @Override
         public void onClick(ClickEvent event) {
            CheckBox checkBox = (CheckBox)event.getSource();
            Window.alert("CheckBox is " +
               (checkBox.getValue() ? "" : "not") + " checked");
         }
      });


      // Add checkboxes to the root panel.
      VerticalPanel panel = new VerticalPanel();
      panel.setSpacing(10);            
      panel.add(checkBox1);
      panel.add(checkBox2);

      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 -

Lorsque vous cliquez Click Me CheckBox, il affichera un message d'alerte disant CheckBox est vérifié ou non vérifié.

↰ Previous page