Adobe Flex Tutorial - Adobe Flex Tutorial

27sept/0918

DataFilterLib – Filtrer plusieurs vues en utilisant le DataBinding

Voici un nouvel exemple de la DataFilterLib qui montre simplement comment on peut mettre à jour plusieurs vues avec un seul filtre. Dans cet exemple, j'ai 4 composants qui ont tous comme dataProvider, la même ArrayCollection. J'ai ainsi une DataGrid, une TileList, une List et un Chart qui affichent ma donnée (donnée d'exemples avec des appareils photo).

Pour effectuer mon filtrage, j'utilise un filtre de type INTERVAL, que vous pouvez configurer à votre guise. Cet article explique le fonctionnement des DataFilterInterval en détail. Grâce au mécanisme de Data Binding entre mes vues et mon model, toutes les vues vont se mettre à jour pendant la modification du filtrage.

Démonstration en ligne (onglet "Filter multiple views")

This movie requires Flash Player 11

Remplis sous: Charting, data binding, DataFilterLib, DataGrid, Exemple, List, TileList 18 Commentaires

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.

Remplis sous: ActionScript, RichTextEditor, TextArea, TextInput Lire la suite

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

Remplis sous: ActionScript, Adobe Air, MXML 2 Commentaires

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");
			}
		}
	}
}

Remplis sous: ActionScript, Exemple Aucun commentaire