SmartGwt
Par PlaceOweb le dimanche, décembre 21 2008, 19:05 - JAVA - Lien permanent
SmartGWT le wrapper remplaçant Gwt-Ext, toujours écrit par sanjiv jivan.
SmartGwt
Le projet SmartGWT
- smartgwt GWT API's for SmartClient Javascript component library.
- Instructions de compilation de smartgwt depuis le dépôt SVN
- Liste des changement lors des commit sur le dépôt SVN
- javaDoc SmartGwt
- demo SmartGwt (Showcase)
- demo SmartGwt EE (Showcase)
- forum SmartGwt (et les traditionnelles questions smartgwt sur stackoverflow)
- Compilation nocturne SmartGWT
- Compilation automatique journalière de smartgwt.jar Automated (Nightly) Builds - SmartClient/SmartGWT
- Les anciennes Compilation automatique journalière de smartgwt.jar depuis le dépôt SVN de SmartGwt.
- Compilation nocturne SmartGWT
Extension du projet SmartGWT
SmartGWT extensions, une place pour que la communauté contribue aux extensions et widgets de SmartGwt.
Ressources
- Blog de Isomorphic
- Smart GWT 5.0 / SmartClient 10.0 Released Release Notes for Smart GWT 5.0 (2014)
- Smart GWT 4.1 / SmartClient 9.1 Released Release Notes for Smart GWT 4.1 (2014)
- Smart GWT 4.0 / SmartClient 9.0 Released Release Notes for Smart GWT 4.0 (2013)
- Smart GWT 3.1 / SmartClient 8.3 Released Release Notes for Smart GWT 3.1 (2012)
- Smart GWT 3.0 / SmartClient 8.2 Released Release Notes for Smart GWT 3.0 (2011)
- Blog de sanjiv jivan
- Smart GWT 2.5 Released (2011)
- Smart GWT 2.4 Released (2011)
- Smart GWT 2.2 Released (2010)
- Smart GWT 2.1 Released with lots of goodies (2010)
- Smart GWT 2.0 Released with Enterprise Blue skin (2009)
- Smart GWT 1.3 Released (2009)
- Smart GWT 1.2 Released (2009)
- SmartGWT 1.0: A Q&A with Sanjiv Jivan
- smartgwt sur abhijeetmaharana.com
- Les plus et les moins de SmartGWT par dng-consulting.com
i18n, traduire SmartGwt en Français : locale FR : SmartGwtMessages_fr_FR.properties
Pour l'internationalisation (i18n : internationalization and localization aussi appelé internationalisation and localisation, On abrège souvent internationalisation en i18n car, en anglais, il y a dix-huit lettres dans le mot, entre le i et le n. De même pour localization avec l10n) de votre application, voyez le post GWT : Interface Localizable qui explique l'utilisation de i18n :
Par exemple, la page HTML en locale "fr_FR
", il faut utiliser gwt:property
comme suit :
<html> <head> <meta name="gwt:module" content="com.google.gwt.examples.i18n.ColorNameLookupExample"> <meta name="gwt:property" content="locale=fr_FR"> </head> <body> <script src="gwt.js"></script> </body> </html>
Pour spécifier la propriété de locale
en utilisant une l'URL,
spécifiez une valeur pour la variable locale
. Par exemple :
http://www.placeoweb.com/MonApplication.html?locale=fr_FR
Et voyez support GWT ResourceBundles for i18n labels / messages dans les Issues du projet smartgwt : GWT API's for SmartClient. Ici ils indiquent qui faut définir dans son fichier XML :
<!-- Internalisation (i18n) --> <extend-property name="locale" values="fr_FR"/>
Et comme précédemment expliqué par GWT appeler l'URL en rajoutant la valeur "fr_FR" à la variable locale : MonApplication.html?locale=fr_FR
Premiers problèmes avec SmartGWT
ListGrid et remote sort padding
Comment afficher seulement 30 enregistrements de votre base de données comportant 500000 enregistrements ?
addHandler and removeHandler
Comment supprimer un Handler que l'on vient de rajouter ? Sanjiv, indique : SmartGWT users the new and improved GWT event API's that are going to be introduced in GWT 1.6. You can learn more about it here : GwtEventSystem
Ouverture d'une page dans un nouvel onglet ou navigateur et redirections
Comment ouvrir une nouvelle page web supplémentaire? Ouverture d'onglet et navigateur avec window.open()
La réponse à Open new Page on new Browser (tab) application ? est l'utilisation de la classe.méthode() com.google.gwt.user.client. Window.open()
Voici une petite fonction permettant d'appeler le window.open natif afin de faire une ouverture de page ou d'onglet dans le navigateur : GWT nouvelle page comme window.open(url) de javascript
Redirection comme window.location()
Voici une petite fonction permettant d'appeler le window.location natif afin de faire une redirection : GWT redirection window.location(url) de javascript
Gestion des liens
Comment représenter un lien, avec un Canvas + CSS ? Ou en utilisant les classes Hyperlink (GWT) et/ou LinkItem (SmartGwt) ?
Le problème c'est que la classe com.google.gwt.user.client.ui.Hyperlink n'étends pas Canvas et que LinkItem est destinée aux formulaires. Alors comment ajouter un liens dans un stack layout panel ?
i18n
Impossible de compiler avec ANT pour obtenir, un résultat francisé via la locale fr_FR. Avec Eclipse + Cypal, on peut le lancer avec "fr_FR" puis le compiler et là c'est correctement traduit. Directement avec ANT il n'utilise pas la locale et reste donc en anglais. La cause était due à l'utilisation d'un smartgwt.jar trop ancien.
Calendar, le calendrier de SmartClient
Impossible de faire un Drag (DND) d'un événement en dehors du calendrier
Impossible de faire glisser un événement du calendrier en dehors de ce calendrier, alors que l'on fait très bien y déposer (drop) un enregistrement (Record) extérieur provenant d'un autre tableau (ListGrid).
Plusieurs CalendarEvent superposés sur le même Calendar
Comment distinguer plusieurs événements de calendrier qui commencent et finissent en même temps ?
Calendar RestDataSource XML
Problème de chargement du Calendar RestDataSource XML
Le calendrier n'implémente pas de méthode pour récupérer toutes les données événement de type CalendarEvent
Même si sanjiv n'a pas encore implémenté cette méthode, elle est proposée par sur Calendar.getData() is not yet implemented, how to get all calendar records ?
DateChooser
Le sélecteur de date semble ignorer les affectations internes de date "dateChooser.setData(dateForceOtherDay);" et rafraîchissement du visuel associé. Par contre le contre le clic sur le jour associé met bien a jour sa date.
DateItem
Comment changer la présentation d'un sélecteur de date ? Par exemple pour choisir sa date au format Européen (basé sur Date Editor in listgrid using European format) :
DateItem dateItem = new DateItem(); dateItem.setInputFormat("DMY"); dateItem.setDisplayFormat(DateDisplayFormat.TOEUROPEANSHORTDATE);
La gestion des dates
Peut importe comment vous formatez la date côté serveur, le timezone est ignoré côté client.
En effet, le client attends une date UTC (GMT) formatée selon le pattern : "yyyy-MM-dd'T'HH:mm:ss". Voyez DateUtil().setDefaultDisplayTimezone(offset) et son code java.
Côté serveur vous pouvez initialiser votre date en UTC avec cela :
private static SimpleDateFormat simpleDateFormat = new SimpleDateFormat("yyyy-MM-dd'T'HH:mm:ss"); // SmartGwt ne prennant en compte que les dates au format UTC, rajout du TimeZone UTC avant l'envoi au navigateur client. private static TimeZone utc = TimeZone.getTimeZone("UTC"); //... simpleDateFormat.setTimeZone(utc);
Error :Cannot change configuration property 'ID' to MyItemAttribute after the component has been created
Le rechargement ou ré-affectation avec le même ID est impossible. N'utilisez pas plusieurs fois .setID();
DataSource et RestDataSource
Impossible de relancer un fetchData() sur une ListGrid qui n'a pas subit de changement
Même en changeant les critères les appels suivants à fetchData() n'appellent pas le serveur car le cache reste inchangé : Can't ListGrid.FetchData() again without modification except Criteria DROPONCHANGE. La réponse se trouve dans le ListGrid.invalidateCache() pour forcer la purge du cache.
Impossible d'utiliser un DataSource ou RestDataSource avec autre chose qu'un résultat de type ListGridRecord
Uncaught JavaScript exception [java.lang.ClassCastException: com.smartgwt.client.widgets.tree.TreeNode cannot be cast to com.placeoweb.Country
Des solutions sont proposées sur Uncaught JavaScript exception, telles que :
- Utiliser directement le ListGridRecord
- Appeler un constructeur définissant votre objet depuis le ListGridRecord
- La meilleure solution est le cast par ré-affectation des données avec un transformResponse() : Cast a ListGridRecord to other Class on DataSource
@Override protected void transformResponse(DSResponse response, DSRequest request, Object data) { Record recordSrc[] = response.getData(); Country recordDst[] = new Country[recordSrc.length]; for(int i=0; i<recordSrc.length; i++) { recordDst[i] = new Country(recordSrc[i]); } response.setData(recordDst); super.transformResponse(response, request, data); }
Lors de la mise a jour des données par un RestDataSource Update XML, seules les données modifiées sont transférées
Nous avons aussi l'intégralité des vielles données dans le paramètre "_oldValues"
ServletRequestDetail : parameter(_componentId):isc_OID_20 parameter(_operationType):update parameter(champsModifier):true parameter(_dataSource):maDS parameter(_oldValues):{ "champsNonModifier":19, "champsModifier":false }
La gestion des erreurs lors des transactions
La non possibilité de faire du Cliquer Glisser pour réorganiser les éléments (CanReorderRecords)
JSON RestDataSource
Pour les opérations multiples ADD ou autres dans une seule transaction, il faut configurer "jsonPrefix" et "jsonSuffix" pour faire fonctionner le client sans l’avertissement d'erreur de la console récupéré avec "isc.showConsole()"
XRP8:WARN:RPCManager:Found a REST request that appears to be in JSON format, but the response was not wrapped as configured by the jsonPrefix and jsonSuffix properties - aborting
dataSourcesetDataProtocol(DSProtocol.POSTMESSAGE); dataSource.setDataFormat(DSDataFormat.JSON); // dataSource.setJsonPrefix("//isc_JSONResponseStart"); // The default prefix is "<SCRIPT>//'"]]>>isc_JSONResponseStart>>". // dataSource.setJsonSuffix("//isc_JSONResponseEnd"); // The default suffix is "//isc_JSONResponseEnd". dataSource.setJsonPrefix(""); dataSource.setJsonSuffix("");
Restriction de chargement d'URL de domaines externes ou croisés
SmartClient can't directly contact URL 'http://localhost/MyProject/XmlList' due to browser same-origin policy. Remove the host and port number (even if localhost) to avoid this problem, or use XJSONDataSource for JSONP protocol (which allows cross-site calls), or use the server-side HttpProxy included with SmartClient Server.
Dans le forum de SmartGWT, on peut lire un cannot load xml from a different domain due to cross domain restrictions.
Par contre quelle différence entre le port 80 et 8080 qui nous retourne le même message ?
Coloration par style CSS
Par exemple sur un ListGrid il existe 2 méthodes :
protected String getCellCSSText(ListGridRecord record, int rowNum, int colNum) { /* Ajout d'un style CSS Return CSS text for styling this cell, which will be applied in addition to the CSS class for the cell, as overrides. */ return "background-color: red; font-weight:bold; color:red;"; } protected String getBaseStyle(ListGridRecord record, int rowNum, int colNum) { /* Remplacement du style CSS Return the base stylename for this cell. */ }
En peut rencontrer des conflits de CSS lors de l'ajout d'un type CSS déja définit hérité depuis un père.
Formulaires
Comment créer des groupes dans le SelectItem ? comme en html avec SELECT / OPTGROUP / OPTION
How to create groups in SelectItem ? like html : SELECT / OPTGROUP / OPTION
Le SelectItem permet une représentation de cases à cocher (GRID) ou de cases à cocher qui génère une liste séparée par un délimiteur, par défaut "," (PICKLIST)
SelectItem selectItem = new SelectItem(); selectItem.setMultiple(true); selectItem.setMultipleAppearance(MultipleAppearance.GRID); // MultipleAppearance.PICKLIST //siMarches.setMultipleValueSeparator(multipleValueSeparator);
Encodage et XML
Le caractère  (\f) (Form Feed, Page Break ou saut de page) inclus dans la table des 128 caractères ASCII est interdit pour l'usage dans les XML tel que le précise Numeric character reference : Restrictions may also apply for other reasons. For example, in HTML 4, , which is a reference to a non-printing "form feed" control character, is allowed because a form feed character is allowed. But in XML, the form feed character cannot be used, not even by reference.
Le XML autorise seulement :
- 	 (\t) tabulation horizontale (Horizontal Tab)
- (\n) saut de ligne (LF : Line Feed)
- (\r) retour chariot (CR : Carriage Return)
- >= 
En nommant les variables, smartgwt avait fait une erreur : RestDataSource XML not well-formed : Element type "isc_Class" containt $
Voyez la correspondance des caractères spéciaux sur MySQL