Archivi tag: gwt

TUTORIAL GWT – COME DEBUGGARE USANDO IL SUPERDEV

Con l’introduzione del superdev mode non è più possibile usare il debug nel nostro IDE come siamo stati abituati. Per poter usare il debug occorre installare il plugin SDBG disponibile qui.

Una volta installato il plugin avviamo il nostro progetto tramite il superdev mode e una volta che  il sistema è correttamente avviato, creiamo una configurazione Chrome  che carichi la hosted page e su questa avviamo il debug.

Se abbiamo fatto tutto correttamente verranno attivati i breakpoint selezionati in Eclipse, e sarà anche possibile usare il debug all’interno di Chrome, usando il Chrome DevTools JavaScript debugger.

TUTORIAL GWT – DETERMINARE L’ANNO CORRENTE

In ambito GWT l’oggetto Calendar non è disponibile, pertanto non volendo usare il metodo deprecato getYear() dell’oggetto Date , è possibile ottenere l’anno corrente usando l’oggetto com.google.gwt.i18n.client.DateTimeFormat

 

TUTORIAL SENCHA GXT 2 – GESTIRE IL TOOLTIP IN UN GRID

Nell’articolo di oggi vedremo come integrare un tooltip in una datagrid sencha.  Nel fare questa attività ho avuto qualche rimpianto per la semplicità di utilizzo di Flex, che permette di definire in modo semplice (tramite una sola properties) Il tooltip da far apparire per una determinata colonna.

Con Sencha la cosa non è così intuitiva, probabilmente esiste un modo molto semplice, ma non ho trovato una soluzione che mi soddisfacesse a pieno.  La soluzione che vi presento permette di definire un tooltip su un datagrid ed è provata e testata su gxt 3.1.0 e gwt 2.6.1.

La classe grid presenta una properties tooltip, ma essa riceve una string come argomento, pertanto si presta solo per tooltip statici, mentre la mia esigenza è quella di un tooltip funzione della riga selezionata e ancora meglio della cella selezionata.

Per soddisfare la necessità ho dovuto gestire gli eventi dell’oggetto, avrei sperato in una property della row ma le mie ricerche non hanno avuto esito positivo.

Pertanto considerando di avere a che fare con un oggetto Grid della classe com.sencha.gxt.widget.core.client.grid.Grid possiamo definire un handler sul mouse hover in questo modo:

Tramite tale approccio riusciremo a vedere il tooltip al passare del mouse, un tooltip funzione del model associato al grid.

Nei miei piano avrei v oluto anche gestire la comparsa e scomparsa del tooltip in funzione della colonna, ma i comandi relativi non hanno avuto l’effetto desiderato.

In questo caso direi meglio questo che niente. Alla prossima

 

TUTORIAL SENCHA GXT 1 – LAVORARE CON MAVEN

Iniziamo una serie di articoli dedicati a Ext GWT, più brevemente GXT, il framework sviluppato da Sencha, che consente di estendere le potenzialità della libreria del Google Web Toolkit.

In questo articolo ci preoccupiamo di configurare un progetto GXT usando Maven ed Eclipse come IDE. Per configurare Eclipse occorre scaricare la versione Juno (4.2) , installare il GWT plugin usando l’update site disponibile all’url http://dl.google.com/eclipse/plugin/4.2 e installare m2eclipse tramite l’update site disponibile all’url http://download.eclipse.org/technology/m2e/releases.

Configurato Eclipse realizziamo il nostro primo progetto avvalendoci di maven e dell’archetipo gwt-maven-plugin tramite la direttiva

Tramite questa direttiva maven crea un progetto che supporta l’alberatura di GWT. Durante l’esecuzione della direttiva specifichiamo il nome del modulo principale (nel mio caso Application), ovvero la classe che implementa l’entry point, il punto di accesso alla nostra applicazione.

A questo punto tramite la direttiva mvn gwt:eclipse possiamo generare i file necessari ad effettuare l’import in Eclipse.

Resta da aggiungere la dipendenza da GXT, agendo sul pom.xml e sul file xml associato al modulo entry point.

Aggiungiamo la versione di GXT da usare tramite il tag <gxt.version>3.0.1</gxt.version>

Specifichiamo il repository  da cui scaricare i sorgenti di GXT

E infine aggiungiamo la dipendenza da GXT tramite il blocco

Una volta aggiunta la dipendenza rendiamola attiva nel progetto eclipse tramite la direttiva mvn gwt:eclipse che si preoccuperà di scaricare le nuove librerie.

Resta da modificare il modulo Application.gwt.xml per rimuovere il tema di GWT e innestare l’eredità da GXT tramite il comando

e linkare il file reset.css nella pagina Application.html tramite la direttiva

Nel file Application.java sostituiamo il gwt-button con un oggetto sencha com.sencha.gxt.widget.core.client.button.TextButton  e se abbiamo operato correttamente tramite la direttiva mvn gwt:run possiamo verificare che il progetto venga avviato correttamente.