GWT - Widget CellList

introduction

le CellList widget représente une liste de cellules à une seule colonne.

Déclaration de classe

Voici la déclaration pour com.google.gwt.user.cellview.client.CellList<T> classe -

public class CellList<T>
   extends AbstractHasData<T>

Constructeurs de classe

N ° Sr. Constructeur et description
1

CellList(Cell<T> cell)

Construisez une nouvelle CellList.
2

CellList(Cell<T> cell, CellList.Resources resources)

Construisez une nouvelle CellList avec le CellList.Resources spécifié.
3

CellList(Cell<T> cell, CellList.Resources resources, ProvidesKey<T> keyProvider)

Construisez une nouvelle CellList avec les CellList.Resources et le fournisseur de clés spécifiés.
4

CellList(Cell<T> cell, ProvidesKey<T> keyProvider)

Construisez une nouvelle CellList avec le fournisseur de clé spécifié.

Méthodes de classe

N ° Sr. Nom de la fonction et description
1

protected boolean dependsOnSelection()

Vérifiez si les cellules de la vue dépendent ou non de l'état de la sélection.
2

protected void doSelection(Event event, T value, int indexOnPage)

Obsolète. utilisez plutôt le gestionnaire d'aperçu de cellule Abstract HasData.add (com.google.gwt.view.client.Cell Preview Event.Handler).
3

protected void fireEventToCell(Cell.Context context, Event event, Element parent, T value)

Déclenchez un événement dans la cellule.
4

protected Cell<T> getCell()

Renvoie la cellule utilisée pour rendre chaque élément.
5

protected Element getCellParent(Element item)

Récupère l'élément parent qui encapsule la cellule à partir de l'élément de liste.
6

protected Element getChildContainer()

Renvoie l'élément contenant les cellules rendues.
sept

SafeHtml getEmptyListMessage()

Obtenez le message qui s'affiche lorsqu'il n'y a pas de données.
8

protected Element getKeyboardSelectedElement()

Obtenez l'élément qui a la sélection du clavier.
9

Element getRowElement(int indexOnPage)

Obtenez l'élément de l'index spécifié.
dix

protected boolean isKeyboardNavigationSuppressed()

Vérifiez si la navigation au clavier est supprimée, par exemple lorsque l'utilisateur modifie une cellule.
11

protected void onBlur()

Appelé lorsque le widget est flou.
12

protected void onBrowserEvent2(Event event)

Appelé après la fin de AbstractHasData.onBrowserEvent (Event).
13

protected void onFocus()

Appelé lorsque le widget est focalisé.
14

protected void renderRowValues(SafeHtmlBuilder sb, java.util.List<T> values, int start, SelectionModel<? super T> selectionModel)

Rendez toutes les valeurs de ligne dans le SafeHtmlBuilder spécifié.
15

protected boolean resetFocusOnCell()

Réinitialisez le focus sur la cellule actuellement focalisée.
16

void setEmptyListMessage(SafeHtml html)

Réglez le message à afficher en l'absence de données.
17

protected void setKeyboardSelected(int index, boolean selected, boolean stealFocus)

Mettez à jour un élément pour refléter son état sélectionné au clavier.
18

protected void setSelected(Element elem, boolean selected)

Obsolète. cette méthode n'est jamais appelée par AbstractHasData, restituer les styles sélectionnés dans renderRowValues ​​(SafeHtmlBuilder, List, int, SelectionModel)
19

void setValueUpdater(ValueUpdater<T> valueUpdater)

Définissez le programme de mise à jour de valeur à utiliser lorsque les cellules modifient des éléments.

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.cellview.client.AbstractHasData

  • java.lang.Object

Exemple de widget CellList

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

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

package com.tutorialspoint.client;

import java.util.Arrays;
import java.util.List;

import com.google.gwt.cell.client.AbstractCell;
import com.google.gwt.cell.client.Cell;
import com.google.gwt.core.client.EntryPoint;
import com.google.gwt.safehtml.shared.SafeHtmlBuilder;
import com.google.gwt.user.cellview.client.CellList;
import com.google.gwt.user.client.ui.RootPanel;
import com.google.gwt.user.client.ui.VerticalPanel;
import com.google.gwt.view.client.ProvidesKey;
import com.google.gwt.view.client.SelectionModel;
import com.google.gwt.view.client.SingleSelectionModel;

public class HelloWorld implements EntryPoint {
   /**
    * A simple data type that represents a contact.
    */

   private static class Contact {
      private static int nextId = 0;
      private final int id;
      private String name;

      public Contact(String name) {
         nextId++;
         this.id = nextId;
         this.name = name;
      }
   }

   /**
    * A custom {@link Cell} used to render a {@link Contact}.
    */
   
   private static class ContactCell extends AbstractCell<Contact> {
      @Override
      public void render(Contact value, Object key, SafeHtmlBuilder sb) {
         if (value != null) {
            sb.appendEscaped(value.name);
         }		
      }
   }

   /**
    * The list of data to display.
    */
   
   private static final List<Contact> CONTACTS = Arrays.asList(new Contact(
      "John"), new Contact("Joe"), new Contact("Michael"),
      new Contact("Sarah"), new Contact("George"));

   public void onModuleLoad() {
      /*
       * Define a key provider for a Contact. We use the unique ID 
       * as the key, which allows to maintain selection even if the
       * name changes.
       */
      
      ProvidesKey<Contact> keyProvider = new ProvidesKey<Contact>() {
         public Object getKey(Contact item) {
            // Always do a null check.
            return (item == null) ? null : item.id;
         }
      };

      // Create a CellList using the keyProvider.
      CellList<Contact> cellList = new CellList<Contact>(new ContactCell(),      
      keyProvider);

      // Push data into the CellList.
      cellList.setRowCount(CONTACTS.size(), true);
      cellList.setRowData(0, CONTACTS);

      // Add a selection model using the same keyProvider.
      SelectionModel<Contact> selectionModel 
      = new SingleSelectionModel<Contact>(
      keyProvider);
      cellList.setSelectionModel(selectionModel);

      /*
       * Select a contact. The selectionModel will select based on the 
       * ID because we used a keyProvider.
       */
      Contact sarah = CONTACTS.get(3);
      selectionModel.setSelected(sarah, true);

      // Modify the name of the contact.
      sarah.name = "Sara";

      /*
       * Redraw the CellList. Sarah/Sara will still be selected because we
       * identify her by ID. If we did not use a keyProvider, 
       * Sara would not be selected.
       */
      cellList.redraw();

      VerticalPanel panel = new VerticalPanel();
      panel.setBorderWidth(1);	    
      panel.setWidth("200");
      panel.add(cellList);

      // Add the widgets to the root panel.
      RootPanel.get().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 -