Flex 4 – (1) Le projet Flex 4 en fil rouge sur flex-tutorial: FTViewer
Adobe Flex 4 est maintenant arrivé à maturité, il est temps de le tester. Il a été en beta pendant plusieurs mois et certains de vous l'ont déjà sûrement testé. Certains l'utilisent même pour leurs applications en production, ce qui est bon signe.
Il est donc venu le temps de laisser Flex 3 de côté (même si je l'utilise toujours et encore pour un moment pour mes devs pro) et de passer à Flex 4 rapidement.
Le projet FTViewer
Et pour apprendre, quoi de mieux que de développer une application. Cela va me permettre d'aborder des problèmes que l'on aborde pas quand on écrit des tutoriaux Adobe Flex restreints. Le but est donc dans les prochaines semaines, d'aborder les nouvelles problématiques Flex 4 en créant une application nommée FTViewer. Celle-ci ne sera pas une application commerciale, mais une application "open source" disponible gratuitement.
Le projet sera déposé sur Google Code, vous pourrez donc le récupérer depuis SVN et consulter les sources directement depuis la page Google Code du projet. Bien sûr, des morceaux de code seront présents au travers des tutoriaux de flex-tutorial.fr, mais la totalité des sources sera sur le repository SVN. Je ne pense pas laisser participer d'autres dev car le projet est uniquement à but d'apprentissage. Si vous souhaitez écrire un article sur flex-tutorial, vous pouvez toujours le faire (plus d'infos).
Tous les articles nommés "Flex 4 – (Numéro) …" feront partie de ce fil rouge applicatif. Toutes les étapes du projet ne sont pour l'instant pas fixées, le projet va aussi évoluer en fonction de mes envies ^^. Il y aura toujours des articles ne concernant pas le projet FTViewer, FTViewer va se faire pendant mon "temps libre".
Bon alors, le FTViewer, c'est quoi ?
Il nous faut donc une application utilisant au maximum Flex 4. Et pourquoi pas une déclinaison Air 2.0 (qui me branche aussi pas mal). Vous pouvez bien sûr fortement m'influencer dans mon choix qui n'est pas définitif en laissant un commentaire.
Voici donc mon idée pour cette application:
- Une application n'utilisant aucun framework MVC mais une architecture orientée composant (que je vais expliquer dans la prochaine étape)
- Une application tournée autour d'un lecteur multimédia avancé utilisant OSMF (nouveauté Flex 4). L'aspect vidéo a été jusque là complètement oublié sur flex-tutorial.fr, il est temps de rattraper cela.
- Un lecteur multimédia complètement skinné pour aborder les Skins Flex 4
- L'affichage des miniatures / preview disposées selon différentes mises en page (liste, vignette, carousel iTunes-like, création d'un Layout perso ?…)
- Gestion de différents thèmes d'interface.
- Constitution de bibliothèques de lecture
- Lecture de flux provenant de l'extérieur (Adobe TV ou autres).
- Peut-être une partie serveur. Un service Java/BlazeDS/Spring/Hibernate/MySQL par exemple pour une gestion de commentaires
- Support d'autres types de documents multimédia (photos, audio, …)
- …
Avec une déclinaison Adobe Air comprenant les fonctionnalités suivantes:
- Ajout de vidéos depuis son poste (et encodage?)
- Gestionnaire de téléchargement de vidéos
- …
Prochain article: Conception d'une architecture orientée composant.
Mettez-y votre grain de sel !
Comme je l'ai dit plus haut, j'attends aussi de voir si cela vous plait (ou pas) ainsi que vos propositions (laissez un commentaire ici)
Flex BlazeDS – Utiliser BlazeDS dans un projet pur ActionScript 3
Voici un article très intéressant venant d'être publié par riavalue.com. Celui-ci indique comment utiliser tout ce qui concerne RPC (communication avec BlazeDS) dans un projet pur AS (donc possibilité de le faire dans Adobe Flash Professionnal.
En effet, il ne suffit pas seulement de copier rpc.swc et framework.rpc, il faut aussi enregistrer les classes (registerClassAlias) et pas mal d'autres manipulations.
Bref, si vous souhaitez faire fonctionner une communication BlazeDS sans embarquer tout le framework Flex, cet article vous sauvera de précieuses heures:
Flash Builder 4 – Gestion de l'AsDoc (documentation)
Dans la précédente version de Flex Builder (3), l'AsDoc était complètement ignorée. Vous pouviez, certes, en écrire mais à part pour relecture, cela n'apparaissait jamais pour vous aider.
Pour ceux qui ne connaissent pas, l'AsDoc est l'équivalent de la JavaDoc pour ActionScript, permettant d'annoter sa classe afin de produire une documentation complète (au format HTML par exemple). Inutile de préciser que la documentation de son code est un élément indispensable pour les développeurs.
Avec Flash Builder 4 vient l'arrivée de la prise en compte de ces tags AsDoc avec affichage dans l'interface ou dans une vue Eclipse dédiée.
Ecriture de documentation au format AsDoc
Pour écrire des commentaires en AsDoc, il suffit de suivre des conventions de nommage. Des plugins comme FlexFormatter peuvent vous aider à pré-générer cette documentation.
Au lieu de vous énoncer des règles qui sont déjà écrites, voici un lien vers un article très complet de FlashXpress:
Commenter ses Classes AS3 au format ASDoc
Voilà, à partir de maintenant, on va considérer que vous savez écrire votre documentation
.
Quelques précisions…
Vous pourrez aussi visualiser la documentation des librairies SWC (si elles contiennent de l'AsDoc bien sûr). C'est d'ailleurs comme cela que vous avez accès à toute la documentation du framework Flex
Notez que Flash Builder 4 ne vous permet toujours pas d'exporter votre AsDoc au format HTML facilement. Cependant, comme avec Flex Builder 3, vous pouvez utiliser l'outil asdoc.exe présent dans le dossier "bin" du framework. Couplé avec un petit script Ant ou une petite Debug Configuration dans Eclipse, vous pourrez générer facilement la documentation de votre projet.
Voici quelques articles pour vous mettre sur la voie:
- http://knomedia.com/blog/2009/11/05/creating-asdocs-in-flash-builder/
- http://www.peterelst.com/blog/2009/06/08/flash-builder-4-beta-exporting-asdoc-documentation/
Sinon il y a le très bon outil AsDocr de Grant Skinner permettant de configurer plus finement l'export de son AsDoc. On obtient la ligne de commande à exécuter et voilà.
L'AsDoc dans l'auto-complétion
Premier exemple d'utilisation de AsDoc dans Flash Builder 4, l'auto-complétion (Ctrl+Espace):
L'AsDoc au rollover
La documentation apparait aussi au survol d'une propriété / fonction / type comme ceci:
Flash Builder 4 – Les raccourcis clavier les plus utiles
Pour améliorer sa productivité, mieux vaut maitriser son principal outil de travail: Flash Builder 4 (ou Flex Builder 3 si vous n'avez pas encore fait le grand saut).
Pour cela, vous avez pas mal de plugins Eclipse mais surtout, des raccourcis clavier indispensables. Certaines peuvent vous sauver beaucoup de temps, en cumulant de mini-gains de temps dans la journée.
Notez que la plupart de ces raccourcis clavier fonctionnent aussi dans Flex Builder 3.
Voici donc la liste des raccourcis clavier que je trouve les plus utiles:
- CMD + Shift + R: Ouvrir une ressource (tout fichier, sources, etc.). Vous pouvez utiliser des jokers ("*") pour simplifier votre recherche. Sûrement le raccourci le plus utile
- CMD + O: Rechercher dans une classe, une propriété ou une méthode
- CMD + D: Supprime la/les lignes sélectionnées. Si aucun sélection, cela supprimer la ligne sur laquelle on a le curseur de texte.
- Alt + Up/Down: Bouger les lignes sélectionnées vers le haut/bas
- CMD + W: Fermer l'onglet courant
- CMD + 3: Le couteau suisse de Flash Builder 4. Tapez le début de la fonctionnalité souhaitée ("gen" pour Generate getters/setters par exemple) pour y accéder.
- CMD + TAB: Naviguer dans les fichiers ouverts dans son workspace. CMD + E permet de faire la même chose avec filtrage par entrée clavier.
Note: CMD sur OSX = CTRL sous Windows
Audiotool.com – Une application des plus réussies
Si vous ne connaissez pas Audiotool, préparez vos mirettes car vous allez en prendre plein les yeux et plein les oreilles. Audiotool vient de sortir en version 1.0 sous le nom de code FireStarter car apparemment, il en ont encore sous la pédale pour la suite.
Je vous donne direct le lien pour essayer de toute urgence:
AudioTool est une application Flex permettant de jouer au DJ high tech. Ici on a pas simplement deux platines et un switcher au milieu. On peut composer son espace de travail en ajoutant divers matériels électroniques.
La plupart disposent d'une ou plusieurs entrées / sorties que l'on peut connecter entre elles pour créer son propre son. Pour connecter deux machines ensemble, un simple drag and drop suffit et vous les verrez ensuite séparées par un fil.
Les combinaisons sont donc infinies, il suffit de placer son matériel, ses samples et d'effectuer des réglages pour créer ses titres. Un peu difficile au premier abord, l'outil est vraiment d'une puissance rare. Une fois enregistré sur leur site, vous pouvez sauvegarder vos compositions et les partager si vous le souhaitez sur le site d'AudioTool. D'autres pourront alors les ouvrir et les bidouiller à leur tour
Au delà de la technique de traitement du son qui est plutôt exceptionnelle à mon avis, on peut remarquer que l'application a vraiment du cachet. Tous les éléments sont skinnés et réagissent au quart de tour. On ne reconnait aucun des composants de base, tout est travaillé au pixel près. Bref, une vraie référence en termes de graphisme et d'expérience utilisateur, vous n'aller pas perdre votre temps
.










