Apache Adobe Flex TutorialTutoriaux Adobe Flex & AIR en Français

27sept/090

Squiggly, correcteur d'orthographe Made in Adobe

Encore une nouvelle librairie venue des Adobe Labs avec cette fois un nom difficilement prononçable pour nous francophones, Squiggly. Squiggly est une librairie permettant d'ajouter facilement un correcteur d'orthographe à des applications Flex et Air. Il peut être ajouté sur n'importe quel composant Flex 3 de texte (TextInput, TextArea, RichTextEditor).

Allez Sur la page officielle de Squiggly

Voir l'application d'exemple de Squiggly

Utilisation de Squiggly

L'utilisation est très simple, il suffit d'appeler une méthode static de la class SpellUI en lui passant le composant sur lequel Squiggly doit agir, et le dictionnaire à charger:

SpellUI.enableSpelling(sta, "usa.zwl");

Pour le choix du fichier dictionnaire, vous avez le choix. Vous pouvez utiliser le dictionnaire English qui est livré avec Squiggly, ou utiliser l'utilitaire DictionaryGenerator.air pour compiler votre propre liste de mots.

27sept/092

Parleys.com: Comparaison d'Adobe Flex avec GWT et JavaFX

InfoQ a publié la vidéo d'une présentation de Stephan Janssen, très intéressante. Stephan Janssen est un entrepreneur qui a monté plusieurs organisation dont le Belgian Java User Group (BeJUG) et Parleys.com.

Cette présentation tourne autour de son site parleys.com, un site internet dont le front-end est implémenté en Flex. Il explique les raisons pour lesquelles ils sont passés du DHTML à Flex / Air. Ce qui est intéressant, c'est qu'il parle aussi de deux autres technologies qui auraient pu être utilisée: GWT et JavaFX. Il y fait donc une présentation des avantages et inconvénients de chaque techno mais présente le site web parleys.com fait en GWT et en JavaFX. Il est ainsi plus simple de voir la différence que dans les autres conférences ou on énonce simplement les avantages et inconvénients connus.

Voir la présentation sur InfoQ.com

Il présente aussi les différents défis auxquelles les équipes de développement ont été confrontées. Notamment, le fait d'avoir un serveur Java pouvant parler notamment à Flex/Air par l'intermédiaire du format AMF mais aussi à des applications ne pouvant pas gérer un protocole binaire comme JavaFX, GWT ou un iPhone. Il y a donc deux moyens d'accéder au service, soit par un protocole binaire (AMF), soit par un service de type REST (XML).

Il parle en même temps des performances (parleys.com est un site de vidéo gérant de gros débit de données) suivant le format utilisé. Ainsi, il explique qu'auparavant, le serveur Java renvoyait de l'HTML. Puis du XML ou du JSON mais au final les performances sont bien meilleures avec de l'AMF car on fait transiter en binaire des objets typés. C'est exactement la situation qui le cycle qui a été suivi par la compagnie pour laquelle je travaille.

Il évoque d'autres problématiques comme par exemple le référencement de son application RIA sur les moteurs de recherche ou la fonctionnalité de Deep Linking de Flex. Bref, un exemple complet et très bien expliqué malgré de petits soucis avec son Mac pendant la présentation.

Au passage, jetez un œil au site parleys.com qui contient de très nombreuses conférences, dont des présentations sur les RIA, Flex, des solutions back end Java, …

Accéder au site parleys.com

27sept/090

Flex Tips – Embarquer un fichier JavaScript dans un SWF (Embed)

Voici une technique très intéressante permettant d'embarquer (embedding) un fichier JS dans un SWF pour pouvoir ensuite appeler des fonctions JS qui vont réagir avec le conteneur HTML. J'ai découvert cette technique ce matin (comme quoi on en apprend tous les jours) sur le blog de Kenny Bunch.

Cela peut être très intéressant pour des applications embarquées (comme les players Youtube & co). Dans ce cas-là, on ne peut pas modifier la page qui va accueillir le SWF pour rajouter une balise <script>, il faut donc trouver une autre solution.

La solution de Kenny Bunch est en fait plutôt simple et consiste à embarquer le fichier JS comme une ressources binaire grâce au metatag Embed.  Cette ressource est conservée dans un objet de type Class. Il suffit ensuite d'instancier cette Class, de récupérer la représentation en String de cette instance, et envoyer cette String à la page en utilisant un eval JavaScript.

Voici un exemple d'utilisation de cette technique. On a un fichier JS "hello.js" qui contient une fonction hello qui fait simplement un alert JS:

function hello(){
	 alert("hello");
}

Créons maintenant le fichier ActionScript qui va embarquer le JS dans le SWF, l'écrire dans la page et appeler la fonction hello:

package
{
	import flash.display.Sprite;
	import flash.external.ExternalInterface;
	public class EmbeddedJavaScriptExample extends Sprite
	{
		// embed the JavaScript into the SWF
		[Embed(source="hello.js", mimeType="application/octet-stream")]
		// create a class that can instantiate the JavaScript for embedding
		private static const HelloJS:Class;
		public function EmbeddedJavaScriptExample()
		{
			if (ExternalInterface.available)
			{
				// embed the JavaScript to the page
				ExternalInterface.call("eval", new HelloJS().toString());
				// the embedded JavaScript has a function call named hello
				// now that it has been embedded to the page call it
				ExternalInterface.call("hello");
			}
		}
	}
}
25sept/094

DataFilterLib – Filtres de type DataFilterInterval, opérateurs et sliders

Dans le tutorial DataFilterLib précédent, on a vu comment utiliser les filtres de type DataFilterSingleValue, qui fonctionnent par recherche de chaîne, principalement. On va maintenant voir les filtres de type DataFilterInterval, permettant de filtrer des valeurs suivant si elles sont comprises dans un intervalle ou non.

Les différents opérateurs applicables sur un DataFilterInterval

De base, la librairie DataFilterLib propose plusieurs opérateurs de base. Ces opérateurs servent à indiquer au filtre comment il doit comparer la valeur d'entrée par rapport à la valeur à filtrer.

Afin de déterminer le type de filtrage, la librairie propose, de base, plusieurs opérateurs (4 à ce jour), présents dans la classe DataFilterIntervalOperator:

  • IntervalClosed: Intervalle fermé à gauche et à droite  (min<= value <= max)
  • IntervalOpen: Intervalle ouvert  (min< value < max)
  • IntervalOpenLeft: Intervalle fermé  à droite  (min< value <= max)
  • IntervalOpenRight: Intervalle fermé à gauche  (min<= value < max)

Pour cela, il suffit de choisir une des constantes (static) de la classe DataFilterIntervalOperator et de l'assigner à la propriété "filterOperator" d'un objet DataFilterParameters. Les constantes sont données comme référence, il est préférable de les utiliser plutôt que d'utiliser directement les valeurs associées.

Ainsi, ces deux portions de code sont équivalentes:

filterOperator="{DataFilterIntervalOperator.INTERVAL_CLOSED}"
//
filterOperator="IntervalClosed"

Les propriétés communes à tous les filtres

Tous les filtres de la DataFilterLib ont des propriétés communes comme par exemple la possibilité d'activer ou non un filtre (par l'intermédiaire de la propriété "active". Vous avez aussi la possibilité d'inverser un filtre grâce à la propriété "invert". Si la propriété invert d'un filtre est mise à true, vous n'aurez que les éléments filtrés. Par exemple, sur un filtre de type INTERVAL_CLOSED, vous n'aurez que les éléments qui ne sont pas compris dans l'intervalle, etc.

25sept/090

DataFilterLib – Filtres de type DataFilterSingleValue, opérateurs et valeurs multiples

Dans le tutorial DataFilterLib précédent, on a vu en détail comment créer un filtre simple (filtre de type "commence par"). Dans ce tutorial, on va voir aller plus loin dans l'utilisation des filtres de type DataFilterSingleValue.

Les différents opérateurs applicables sur un DataFilterSingleValue

De base, la librairie DataFilterLib propose plusieurs opérateurs de base. Ces opérateurs servent à indiquer au filtre comment il doit comparer la valeur d'entrée par rapport à la valeur à filtrer.

Afin de déterminer le type de filtrage, la librairie propose, de base, plusieurs opérateurs (3 à ce jour), présents dans la classe DataFilterSingleValueOperator:

  • StartsWith: La valeur à filter commence par la valeur d'entrée (comme un LIKE %VAL en SQL)
  • EqualsTo: La valeur à filter est strictement égale à la valeur d'entrée
  • Like: La valeur à filtrer contient la valeur d'entrée (comme un LIKE %VAL% en SQL)

Pour cela, il suffit de choisir une des constantes (static) de la classe DataFilterSingleValueOperator et de l'assigner à la propriété "filterOperator" d'un objet DataFilterParameters. Les constantes sont données comme référence, il est préférable de les utiliser plutôt que d'utiliser directement les valeurs associées.

Ainsi, ces deux portions de code sont équivalentes:

filterOperator="{DataFilterSingleValueOperator.STARTS_WITH}"
//
filterOperator="StartWith"

Les propriétés communes à tous les filtres

Tous les filtres de la DataFilterLib ont des propriétés communes comme par exemple la possibilité d'activer ou non un filtre (par l'intermédiaire de la propriété "active". Vous avez aussi la possibilité d'inverser un filtre grâce à la propriété "invert". Si la propriété invert d'un filtre est mise à true, vous n'aurez que les éléments filtrés. Par exemple, sur un filtre de type STARTS_WITH, vous n'aurez que les éléments qui ne commencent pas par la valeur entrée, etc.