GWT: widget de lista de celdas

Introducción

los CellList widget representa una lista de celdas de una sola columna.

Declaración de clase

A continuación se muestra la declaración de com.google.gwt.user.cellview.client.CellList<T> clase -

public class CellList<T>
   extends AbstractHasData<T>

Constructores de clases

No Señor. Constructor y descripción
1

CellList(Cell<T> cell)

Construya una nueva CellList.
2

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

Construya un nuevo CellList con el CellList.Resources especificado.
3

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

Construya una nueva CellList con el CellList.Resources y el proveedor de claves especificados.
4

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

Construya una nueva CellList con el proveedor de claves especificado.

Métodos de clase

No Señor. Nombre y descripción de la función
1

protected boolean dependsOnSelection()

Compruebe si las celdas de la vista dependen o no del estado de selección.
2

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

Obsoleto. use Abstract HasData.add Cell Preview Handler (com.google.gwt.view.client.Cell Preview Event.Handler) en su lugar.
3

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

Dispara un evento a la celda.
4

protected Cell<T> getCell()

Devuelve la celda utilizada para representar cada elemento.
5

protected Element getCellParent(Element item)

Obtenga el elemento principal que envuelve la celda del elemento de la lista.
6

protected Element getChildContainer()

Devuelve el elemento que contiene las celdas renderizadas.
7

SafeHtml getEmptyListMessage()

Obtén el mensaje que se muestra cuando no hay datos.
8

protected Element getKeyboardSelectedElement()

Obtiene el elemento que tiene selección de teclado.
9

Element getRowElement(int indexOnPage)

Obtenga el elemento para el índice especificado.
10

protected boolean isKeyboardNavigationSuppressed()

Compruebe si se está suprimiendo la navegación con el teclado, como cuando el usuario está editando una celda.
11

protected void onBlur()

Llamado cuando el widget está borroso.
12

protected void onBrowserEvent2(Event event)

Se llama después de que se completa AbstractHasData.onBrowserEvent (Event).
13

protected void onFocus()

Se llama cuando el widget está enfocado.
14

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

Renderice todos los valores de fila en el SafeHtmlBuilder especificado.
15

protected boolean resetFocusOnCell()

Restablece el enfoque en la celda actualmente enfocada.
dieciséis

void setEmptyListMessage(SafeHtml html)

Configure el mensaje para que se muestre cuando no haya datos.
17

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

Actualiza un elemento para reflejar su estado seleccionado por teclado.
18

protected void setSelected(Element elem, boolean selected)

Obsoleto. este método nunca es llamado por AbstractHasData, renderiza los estilos seleccionados en renderRowValues ​​(SafeHtmlBuilder, List, int, SelectionModel)
19

void setValueUpdater(ValueUpdater<T> valueUpdater)

Configure el actualizador de valores que se utilizará cuando las celdas modifiquen elementos.

Métodos heredados

Esta clase hereda métodos de las siguientes clases:

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

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

  • com.google.gwt.user.cellview.client.AbstractHasData

  • java.lang.Object

Ejemplo de widget CellList

Este ejemplo lo llevará a través de sencillos pasos para mostrar el uso de un widget CellList en GWT. Siga los siguientes pasos para actualizar la aplicación GWT que creamos en GWT - Capítulo Crear aplicación -

Paso Descripción
1 Cree un proyecto con un nombre HelloWorld en un paquete com.tutorialspoint como se explica en el capítulo GWT - Crear aplicación .
2 Modifique HelloWorld.gwt.xml , HelloWorld.css , HelloWorld.html y HelloWorld.java como se explica a continuación. Mantenga el resto de los archivos sin cambios.
3 Compile y ejecute la aplicación para verificar el resultado de la lógica implementada.

A continuación se muestra el contenido del descriptor de módulo modificado 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>

A continuación se muestra el contenido del archivo de hoja de estilo modificado 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;
}

A continuación se muestra el contenido del archivo de host HTML modificado 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>

Tengamos el siguiente contenido del archivo Java src/com.tutorialspoint/HelloWorld.java que demostrará el uso del 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);
   }
}

Una vez que esté listo con todos los cambios realizados, compilemos y ejecutemos la aplicación en modo de desarrollo como hicimos en el capítulo GWT - Crear aplicación . Si todo está bien con su aplicación, esto producirá el siguiente resultado: