Adobe Flex Tutorial - Adobe Flex Tutorial

1mai/100

Concours Adobe Acrobat PDF Portfolio: Faîtes vous remar… Ah non, vous êtes français :P

Des concours organisés par Adobe, cela ne se produit pas tous les jours. Pourtant, en voici un:

PDF Portfolio Navigator Developer Contest

Ce concours propose aux développeurs Flash/Flex de créer une interface de visualisation de portfolios Acrobat Reader. Les Portfolios PDF sont une nouveautés Acrobat Reader 9 qui vous permettent de condenser plusieurs documents (PDF, vidéo, images, …) au sein d'un même document PDF. Vous pouvez ensuite naviguer dans ce portfolio, visionner les vidéos, etc.

Les lots, pour vous faire réver:

Contest First Place Winner:
Choice of either a Dell Adamo Desire or MacBook Air 2.13GHz

Second Place Winner:
Choice of either an Apple iPad wi-fi + 3G 32GB or a Nexus One Phone

Third Place Winner:
HP Mini 5102 device

Top 10 entries:
Featured on Adobe.com

Sweepstakes drawing:
Amazon Kindle

Le but du concours est de créer une interface à la fois user-friendly et sympa d'un point de vue graphisme. Jusque là, tout va bien, sauf quand on arrive au formulaire d'inscription où la liste des pays acceptés sont: US / UK / Canada (hors Quebec) / Australia / Singapore / Phillipines / Taiwan / Indonesia. Et oui, la France n'est pas dans la liste, sûrement car on est pas un pays anglophone.

C'est dommage car en plus le jury comporte de bonne références (les organisateurs du concours insistent bien sur le fait que cela va vous rendre célèbre). Donc bon, tant pis pour cette fois, pourtant je suis sûr qu'il y avait moyen de gagner un truc vu le peu de monde qui en parle ^^.

Remplis sous: Non classé Aucun commentaire

6mar/1011

Master Class Advanced Flex @ Bruxelles, Retour en images

La semaine dernière a eu lieu la Master Class Advanced Flex à Bruxelles, un séminaire donné par l'équipe de Farata Systems. Vous l'aviez peut-être deviné, j'étais présent pour ce séminaire. Autant être clair, si vous n'y étiez pas, vous avez raté une des conférences les plus intéressantes (en France et ses alentours en tout cas).

J'ai eu l'occasion de rencontrer quelques uns (6 je crois) des lecteurs de flex-tutorial.fr à cette occasion (certains que je connaissais seulement par GTalk), c'était vraiment intéressant d'échanger en direct . Un bonjour à eux

Le Hilton, c'est classe

Le séminaire s'est passé sur 2 jours, au Hilton de Bruxelles. Pour planter le décor, les 2 jours se sont passés au 27e étage du Hilton, dans une salle de réunion panoramique avec sûrement une des meilleures vue sur tout Bruxelles. Rien que pour cela, cela valait le coup. Étaient présentes, une trentaine de personne, ce qui a permis de pouvoir communiquer facilement et de poser des questions. Quelques photos sont disponibles à la fin de cet article.

Le premier soir, l'équipe de Farata Systems a invité tous les participants à prendre une tournée de binche au bar du Hilton, un geste très sympa. Rajoutez à cela le buffet à volonté le midi (et c'est pas celui du Flunch) avec de très bons vins compris dans le prix(400 euros), ce séminaire était une aubaine .

Assez parlé du contexte, parlons maintenant du contenu.

Les présentateurs de chez Farata Systems

Ils étaient 3 pour animer ce séminaire, chacun spécialiste dans sa "branche" (compilation et optimisation, développement et aspect humains, …): Victor Rasputnis, Yakov Fain et Anatole Tartakovsky. Trois américains d'origine d'Europe de l'Est avec un accent anglais plutôt sympa ^^.

Ils sont tous consultant/développeur, venant du monde Java avec des bonnes années d'expérience derrière eux. Ils ont notamment écrit plusieurs livres spécialisés, notamment:

Programmation Java pour les enfants, les parents et les grand-parents
Enterprise development With Flex (disponible en achat en ligne, bientôt en imprimé)
Flex and Java (je n'ai pas trouvé le lien mais ils me l'ont offert pendant la conférence ^^)

On a eu affaire à de vrais pros, qui ont développé des projets de grande envergure depuis des années. Ils ont tourné et modifié Flex et l'ActionScript dans tous les sens et connaissent tout sur le bout de doigts.

Ce qu'on a pu voir en 2 jours

2 jours, cela peut paraître long sur Flex mais ce fut en fait trop court pour pouvoir tout aborder. Le programme de ce séminaire était très chargé et on a pas eu le temps de tout aborder. De nombreux points sont déjà abordés dans leur blog mais il est toujours plus intéressant de les voir expliqués en live.

Voir le blog Flex de Farata Systems

Voici les points abordés qui m'ont le plus intéressé:

Remplis sous: ActionScript, Adobe Air, BlazeDS, data binding, Debugging, Exemple, Flash Builder, Flex 4, Flex Builder, Modules, MXML, RSL, Skin Lire la suite

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

6avr/090

Flex Localization – Création de fichier .properties

Vous pouvez définir les ressources de localization dans des fichiers .properties. Ces fichier properties contiennent des couples clé/valeur au format UTF-8. Vous allez typiquement utiliser ces fichiers propriété pour spécifier des valeurs de String dans votre application, comme le label d'un bouton ou celui des items d'une liste.

L'exemple suivant spécifie des valeurs de label d'un Form en Anglais:

# locale/en_US/RegistrationForm.properties
registration_title=Registration
submit_button=Submit Form
personname=Name
street_address=Street Address
city=City
state=State
zip=ZIP Code
thanks=Thank you for registering!

Les ressources peuvent aussi faire référence à des éléments binaires comme des fichiers audio, image ou vidéo. Pour y faire référence, vous devez utiliser l'instruction Embed(), comme vous le ferriez pour un élément dans une feuille de style. L'exemple suivant embarque un fichier JPG dans la ressource:

flag=Embed("images/unitedstates.jpg")

Vous pouvez aussi extraire des symboles depuis un fichier SWF en utilisant la directive Embed() comme ceci:

flag=Embed(source="FlagsOfTheWorld.swf", symbol="unitedstates")

Pour inclure des classes à vous, comme des ProgrammaticSkin, vous pouvez utiliser l'instruction ClassReference(). L'exemple suivant inclut la classe Sorter du package sortingClasses.en_US:

SORTER=ClassReference("sortingClasses.en_US.Sorter")

Vous allez typiquement conserver ces fichier properties dans un sous-dossier locale/nom_Locale. Vous devrez ajouter ce répertoire à votre Source Path pour que le compilateur puisse le trouver lors de la compilation de l'application. On verra cela dans un autre tuto Flex.

Remplis sous: Localization Aucun commentaire

30mar/0917

Flex / Air – Créer un Badge Adobe Air avec l'application Badger

Dans l'article précédent, je vous présentais l'application ADM, indispensable pour pouvoir modifier le descripteur XML des applications Adobe Air facilement. Cette fois-ci, on va s'intéresser à la mise en ligne de votre application Air. Par mise en ligne, je veux dire mise à disposition de l'installeur par le biais d'Internet. En effet, les applications Adobe Air sont des applications (RDA) bureautiques, elles ne peuvent pas s'afficher dans une page web classique (ce n'est pas un SWF qui en sort mais un .AIR).

Pour faire profiter un maximum de monde de votre superbe application, il faut donc la mettre en ligne et mettre de .air en téléchargement. Vous pourriez le faire de manière classique, en laissant l'utilisateur "enregistrer sous" ce fichier et qu'il lance ensuite ce fichier. C'est un peu laborieux pour un utilisateur complètement néophyte ou paresseux.

Heureusement pour vous, Grant Skinner a développé une application Air permettant de générer un "AIR Install Badge". Si vous fouillez dans le Flex SDK, vous trouverez un de ces badges.

Voici les principaux avantages liés à la génération de badge à l'aide de Badger:

Plus stylés que le badge du SDK
Détecte la présence de l'application et offre un lien "launch now" permettant de directement lancer l'application
Upgrade la version de Flash Player si besoin est avec l'express install
Possibilité de personnaliser les textes et les aides

Voici l'apparence que pourrait avoir votre Badge Air:

Vous reconnaissez surement le badge si vous traînez un peu sur les sites/blogs adobe et autres .

L'application Badger

Badger est une application ultra-pratique permettant de configurer toutes les options de votre badge. Au centre de l'application se trouve une prévisualisation de votre badge (grâce au composant mx:HTML de Air pour voir instantanement toutes vos modifications. Vous pourrez ensuite exporter tout ce qu'il faut pour le déploiement (fichiers HTML/JS/SWF) qu'il vous suffira de placer sur votre serveur web.

Remplis sous: Adobe Air Lire la suite

Anciennes »