GWT Spreadsheet Cell

Question

J'essaie de reproduire le comportement d'une cellule de feuille de calcul en utilisant GWT. J'ai été capable de créer un widget Composite appelé "Cell" qui est par défaut un widget "Label". Lorsqu'un utilisateur clique sur ce widget, il devient un widget "TextBox". Lors d'un événement de flou, le widget devient à nouveau un widget "Label".

Ma question concerne l'efficacité et le temps de rendu. Il serait probablement plus facile de simplement faire de ma "cellule" une "TextBox" et de simplement changer l'apparence de l'utilisateur via CSS (selon qu'ils entrent ou non des données). Cependant, je pense que cela affectera le temps de rendu et donc je retourne à un widget "Label" chaque fois que l'entrée n'est pas nécessaire. Le problème avec cette méthode, cependant, est que je crée fondamentalement un nouveau TextBox/Label chaque fois que l'utilisateur doit entrer quelque chose dans la "cellule".

Voici mon pseudo-code (puisque je ne suis pas autour d'un IDE) ...

public class Cell extends Composite { 

private SimplePanel sp; 

public Cell() { 
    Label l = new Label(""); 
    sp.add(l); 
} 

private void switchMode() { 
    Widget w = sp.getWidget(); 
    if (w instanceof Label) { 
     // we have a Label, change it to a TextBox 
     String text = ((Label) w).getText(); 
     sp.remove(w); 
     sp.add(new TextBox(text)); 
     // force garbage collection 
     w = null; 
    } else { 
     // we have a TextBox, change it to a Label 
     String text = ((TextBox) w).getText(); 
     sp.remove(w); 
     sp.add(new Label(text)); 
     // force garbage collection 
     w = null; 
    } 
} 

... 

Quand il y a un onBlurEvent sur la zone de texte ou quand il y a un événement onClick sur l'étiquette, le SWITCHMODE La méthode() est appelée. La critique du code est la bienvenue. Est-il préférable d'inclure une zone de texte et une étiquette en tant que variables privées de la classe Cell, puis d'ajouter ou de supprimer l'objet correspondant selon les besoins?

Answer 1

Nous avons rencontré un problème similaire: affichage efficace de la table Excel-like (beaucoup de lignes et de cols, chaque cellule in-situ modifiable).

La solution finale était: rendre la table en tant que chaîne: chaque cellule est rendue comme du texte, tout mettre à l'aide de innerHTML. Lorsque l'utilisateur sélectionne une cellule à l'aide de la souris ou du clavier, TextArea masqué spécial apparaît sur la cellule sélectionnée (avec la même taille) et le focus donne à TextArea. OnBlur - le texte entré retourne à la cellule et le TextArea est caché encore.

Nous n'utilisons pas de widgets pour les cellules. TextArea est seulement un pour la table entière.

Voir aussi « GWT efficace: Développer une application complexe, haute performance avec Google Web Toolkit » http://code.google.com/events/io/2009/sessions/EffectiveGwt.html

Answer 2

Un moyen encore plus simple serait d'ajouter les deux à votre panneau (pas simplePanel cependant), et d'utiliser les méthodes setVisable pour modifier la visibilité.