AIR Mobile – Application TweetDeck (6) – Configuration des appels HTTP au service Twitter
L'application TweetDeck récupère des tweets grâce à l'API développeur fournie par Twitter. On va faire de même en utilisant l'API Rest Twitter (sans authentification). La documentation de ces APIs peut être trouvée sur le site dev.twitter.com:
Pour l'instant, on va utiliser les APIs de recherche en GET. Elles se présentent sous la forme:
http://search.twitter.com/search.json?q=…
La query peut-être un texte (brut), un profil (@xxx), un hashtag (#xxx) ou un from (from@xxx). Pour configurer ces services, on pourrait tout faire à la main, créer ses appels, ses objets de retour ActionScript, le mapping JSON – AS etc. Mais on va être plus malin et laisser un générateur de code se charger de cette opération assez laborieuse. Ce générateur de code, c'est Flash Builder, qui peut vous permettre de vous connecter à un service HTTP.
Création des opérations
La première étape consiste à créer une "opération" HTTP, c'est-à-dire l'accès à une ressource HTTP. Rendez-vous dans le menu de Flash Builder > Data > Connect to HTTP:
Cliquez sur "Operation1" et remplacez ce texte par "search". Cliquez ensuite sur "Fill_Url_Here" et entrez :
http://search.twitter.com/search.json?q={query}
Entrez comme Service Name "Twitter" puis cliquez sur "Finish". Flex vient de vous créer la structure de votre service HTTP qui va se trouver par défaut dans le package "services.twitter". Les objets AS correspondant aux objects JSON seront eux conservés dans le package "valueObjects". Ces objets ne sont pas encore créés. Pour cela, on va devoir tester le service et les objets seront créés à partir d'un sample.
Création des Value Object (VO) à partir de Flash Builder
Notre service connait son URL d'accès mais pour l'instant, il ne sait pas ce que ce service va renvoyer. Pour qu'il en prenne connaissance, on va tester l'opération. On peut donc tester avec des valeurs de paramètre "en dur" ou même copier-coller un retour JSON. Pour tester l'opération, rendez-vous dans la vue "Data/services" de Flash Builder. Si vous l'avez fermé, rendez-vous dans Window > Show View > Data/Services.
Faites un clic droit sur le service puis sélectionnez "Configure return type…":
Choisissez "Auto-detect the return type from sample data" puis Next. On va appeler l'opération en lançant une recherche sur "Adobe". Dans la case "Entry Value", remplacez "{query}" par "Adobe":
Passez à l'étape suivante et Flash Builder va faire la demande au service Twitter et faire une introspection sur le résultat. On va vous demander un nom pour ce résultat (nom de classe). Entrez "TwitterFeed". Vous voyez que l'on a récupéré un tableau de résultats, qui sont un tableau de "Result" pour l'instant. Remplacez donc "Result" par "Tweet", votre API sera plus cohérente par la suite:
Cliquez sur Finish et Flash Builder va vous créer toutes les classes nécessaires. Vous pouvez toujours redéfinir le "return type" par la suite avec la même manipulation.
Les classes générées par Flash Builder
Si vous regardez dans votre dossier "src", vous allez voir toutes les classes qui ont été générées par Flash Builder:
Les classes qui sont précédées d'un "_" ne doivent surtout pas être modifiées à la main, sinon à la prochaine génération, vos modifications seront écrasées. Vous pouvez cependant modifier les autres classes, en conservant tout de même les parties importantes signalées en commentaire.
On a donc l'objet "Twitter" qui est notre service, par lequel on va aller requêter le service HTTP Twitter. Ce service va nous renvoyer une réponse au format JSON qui va automatiquement être transformée pour renvoyer un objet TwitterFeed. Celui-ci contient quelques propriétés mais contient surtout la propriété "results" qui est un tableau d'objet "Tweet".
Voilà, on a laissé Flash Builder générer tout ça et dans la suite du tutorial, on va voir comment utiliser ces classes.
Sortie de l'update Flash Builder 4.5.1 – Développement iOS, Android et Playbook avec Flex
Chose promise, chose due. La team Adobe nous avait annoncé une mise à jour courant Juin pour le SDK Flex et Flash Builder, avec notamment le support des projets Flex Mobile pour iOS. C'est chose faite puisque la sortie s'est faîte aujourd'hui.
Vous pouvez aller télécharger cette mise à jour directement sur le site d'Adobe. La version d'évaluation téléchargeable est une 4.5.1:
https://www.adobe.com/cfusion/tdrc/index.cfm?product=flash_builder
Si vous aviez installé la version 4.5, rendez-vous dans le menu Help de Flash Builder > Search For Flash Builder Updates. Une fois installée, pour vous assurer que la MAJ s'est bien effectuée, rendez-vous dans Help > Flash Builder Notices and Credits:
Version 4.5.1 devrait être affiché en bas.
Nouveautés de cette update 4.5.1
Comme prévu, vous pouvez maintenant créer des projets mobiles qui target Apple iOS:
Pour pouvoir compiler et déployer des applications iOS (IPA), il vous faudra des certificats distribués par Apple (cf. docs). Une fois ces certificats reçus, vous devrez les renseigner dans la fenêtre de propriétés de votre projet:
Pour le reste, tout est décrit dans les documentations. Voilà, vous pouvez maintenant suivre le tutorial Pokémon "fil rouge" et le déployer sur votre iPad!
Quelques précisions sur les SDKs, versions, …
Les versions de SDKs, runtimes & co peuvent amener une certaine confusion. On va essayer de résumer:
- Vous pouvez développer des applications iOS qui target AIR 2.6. AIR 2.7 est compris dans Flash Builder mais uniquement le packager pour iOS qui va servir pour la compilation. Le SDK visé est bien le 2.6 (celui qui est précisé dans le *-app.xml). Vous aurez donc les performances de la 2.7 avec les APIs de la 2.6
- Vous pouvez développer des applications Android de base en AIR 2.6. La version actuelle du runtime est AIR 2.7, ce qui n'est pas très important puisqu'une application AIR 2.6 sont compatibles avec le runtime 2.7
- Pour la BlackBerry Playbook, il y aura une MAJ du système pour qu'il utilise AIR 2.7 comme runtime. Pour l'instant, le Playbook utilise AIR 2.5 (ils vont sauter une version du coup)
- Il est encore déconseiller d'utiliser le SDK AIR 2.7 fraîchement sorti en "overlay". Si vraiment vous voulez utiliser les APIs AIR 2.7, c'est pour l'instant à vos risques et périls (ça va pas exploser non plus)
Pour résumer, je dirais que vous n'avez pas vraiment à vous en inquiéter.
Ouvrez Flash Builder, codez et testez cette nouvelle version qui ouvre beaucoup de portes. Et ce n'est qu'un début …
AIR Mobile – Application Pokémon (2) – Préparation de l'application
Dans le premier tutorial de ce fil rouge, on a vu quelle application nous allions créer et à l'aide d'une maquette, l'aspect général des vues:
AIR Mobile – Application Pokémon (1) – Conception et maquettage
Maintenant que tout est clair dans les têtes passons au développement de cette application. Pour la suite, on ne va pas supposer que vous avez un bon niveau en tant que développeur Flex. Certaines parties pourront donc être survolées si vous connaissez déjà bien le sujet.
Flash Builder et Flex 4.5
Puisque notre application sera sur mobiles, on va s'équiper avec les derniers logiciels et SDK d'Adobe, à savoir la version 4.5 de Flex et Flash Builder. Bien sûr, si vous souhaitez utiliser autre chose que Flash Builder, c'est vous qui décidez.
Télécharger une version d'évaluation gratuite de Flash Builder 4.5 Édition Premium
Pour le SDK Flex, pas de problème, il est compris dans le package, vous n'aurez pas à le télécharger séparément. Suivez la procédure d'installation et vous êtes parés.
Ressources nécessaires au développement
L'application que l'on va créer fonctionne complètement en offline. Vous allez donc devoir télécharger les éléments nécessaires au développement.
Voici les éléments dont vous aurez besoin:
- assets.zip (/assets) : Contient quelques icônes et le splashScreen
- icons.zip (/icons) : Contient les icônes de l'application en plusieurs tailles. Ces icônes sont représentés sur l'écran d'accueil Android par exemple
- images.zip (/images) : Contient toutes les images des pokémons en haute qualité
- mp3.zip (/mp3) : Contient tous les cris des pokémons au format MP3 (cris Gameboy)
- pokemon_db.zip (/db) : Contient la base de données sur tous les pokémons.
La problématique des assets multiples avec Flex
Si vous avez déjà utilisé Flex, vous savez si vous mettez beaucoup d'éléments dans votre dossier de sources, à chaque compilation, celui-ci va automatiquement essayer de recopier ces fichiers dans le dossier "bin-debug". Si vous avez des centaines de fichiers comme c'est le cas pour notre application, cela peut être très long, en particulier sur un système Windows.
Je vous conseille donc d'intégrer ces fichiers dès que vous en aurez besoin. Par exemple, ne copiez pas les fichiers audio MP3 tant que l'on a pas abordé la partie audio. L'autre technique consiste à copier directement ces fichiers dans le répertoire bin-debug, comme cela le compilateur ne cherchera pas à les copier. Seul problème à cette technique, il ne faut pas oublier de les remettre dans le dossier "src" avant d'effectuer un export final (release), sinon ils ne seront pas dans l'application finale.
Participez à la pre-release Flex SDK et Flash Builder (4.5)
Le SDK Flex ainsi que Flash Builder sont des produits en constantes évolution. Mais le processus de développement n'est pas fermé, au contraire, vous êtes cordialement invité à tester les prochaines versions de ces produits avant la date de sortie officielle.
Bien sûr, vous allez signer un NDA (non-disclosure agreement) qui va vous interdire de communiquer sur ce que vous allez voir pendant cette phase de pre-release. Pas de tweet, pas de blog, pas de mail, rien qui ne parle de cette version qui n'est pas encore arrivée à maturité. Ce n'est pas pour éviter de vous exprimer, mais bien pour éviter les rumeurs et les "la version a des bugs" alors que celle-ci n'est pas prête à être en production.
Cette étape est primordiale pour le bon développement de ces produits. Si vous utilisez Flex de près ou de loin, vous devriez être inscrit à la pre-release. Vous utilisez ces produits, il est dans votre intérêt que ceux-ci comportent le moins de bugs possibles. Si vous trouvez un bug sur votre projet, vous pourrez ainsi le signaler à Adobe qui pourra le corriger avant la sortie, pas besoin d'attendre une version mineure.
Vous aurez aussi accès à un forum vous permettant de partager sur les derniers build (en direct avec les développeurs de Flex / Flash Builder) avec des personnes elles aussi sous NDA.
Faisant partie de cette pre-release, j'en ai une très bonne expérience, le forum est réactif et les équipes Adobe confirment rapidement les bugs (et les corrigent dans la foulée pour certains).
Comment participer à la pre-release?
C'est très simple, il vous suffit de remplir le formulaire suivant:
Flex SDK, Flash Builder and Flash Catalyst pre-release program survey
Quelques jours plus tard, vous recevrez un email vous permettant d'accéder au site dédié aux prerelease Adobe.
Comment rentrer un bug sur un produit en pre-release?
Vous avez testé les derniers builds et vous pensé avoir trouvé un bug? Si vous n'êtes pas sûr, commencez par chercher sur le forum et sur la bug base si votre bug n'a pas déjà été entré par un autre utilisateur. Vous pouvez aussi poster un nouveau thread sur le forum pour demander confirmation.
Si vous avez un nouveau bug à faire partager, cela se passe par le site suivant:
https://bugs.adobe.com/jira/secure/Dashboard.jspa
Loggez vous avez votre compte Adobe et cliquez dans le coin haut-droit sur "Create issue". Vous pourrez ensuite choisir le produit impacté et renseigner le bug. N'hésitez pas à bien préciser le contexte de reproduction du bug pour que les équipes Adobe puissent le reproduire chez eux facilement. Si vous le pouvez, ajoutez un petit projet permettant de reproduire le bug en question. Plus il y a d'informations, plus il y a de chances pour qu'Adobe puisse le corriger rapidement.
Si vous avez trouvé un bug dans Flash Builder, vous pouvez aussi joindre les logs de Flash Builder à votre demande. Pour récupérer le log, rendez-vous dans Help > About Flash Builder > Installation Details:
Rendez-vous ensuite dans l'onglet "Configuration" puis cliquez sur "View Error Log":
Une fenêtre va s'ouvrir (un navigateur) vous présentant le log. Fichier > Enregistrer sous et il ne vous reste plus qu'à le mettre en pièce jointe au bug.
Même si vous pensez que vous n'êtes pas un "cador" du Flex, participez à cette pre-release, vous ne le regretterez pas 
Programmation Flex 4 publié chez Eyrolles – Ma première publication!
Je vous annonce un heureux évènement de 1.26kg qui se prénomme "Programmation Flex 4 – Applications Internet riches avec ActionScript 3, Spark et Flash Builder" chez Eyrolles . J'ai participé à l'écriture de ce livre en tant que relecteur technique dont l'auteur principal est Aurélien Vannieuwenhuyze.
Voici le lien vers l'article chez Decitre:
Programmation Flex 4 – Applications Internet riches avec Actionscript 3, Spark et Flash Builder
En plus de la relecture technique, j'ai écrit certains chapitres comme "Créer des applications modulaires" ou sur le skinning de composant Spark et un chapitre bonus sur l'intégration et le contrôle de Google Maps dans une application Flex. Ces contenus ont été écrits au mois de Juin, ce qui avait ralenti un peu l'activité de flex-tutorial à l'époque, pour laisser du temps à ce projet.
Le sommaire
Voici les différents thèmes abordés dans le livre, chacun étant accompagné d'exemples de code:
- Pourquoi choisir Flex 4 ?
- A la découverte du framework Flex 4
- Développer avec le kit Flex SDK
- Le premier outil de développement : FlashDevelop 3.1.1
- Développer des applications à l'aide de Flash Builder 4
- Spark, Halo, FXG, passerelles entre les composants et le design de l'interface
- Réaliser le design des interfaces
- Le dynamisme applicatif avec les états, les transitions et les effets
- La 3D avec PaperVision 3D
- Créer un lecteur RSS avec Flash Catalyst
- Créer des composants personnalisés
- Gérer les données
- Accéder aux services de la couche métier
- Flex et PHP via Zend_AMF
- BlazeDS ouverture open source vers le monde Java et la communication d'applications
- Flex et .NET
- Créer des applications modulaires
- Interagir avec le conteneur web
- Internationalisation des applications
- Déboguer une application
- Analyser les performances et optimiser l'application
- Les tests unitaires avec Flex Unit
- Adobe Air 2
- Création d'un catalogue e-commerce : un catalogue interactif
- Module d'administration avec Adobe Air
- Mise en place du catalogue interactif
- Gestion d'un panier d'achat et déploiement de e-catalogue
- Google Maps dans un application Flex
- Annexe 1 – Les composants de contrôle
- Annexe 2 – Flex, BlazeDS 4, Tomcat 7, Eclipse Helios et le framwork Spring 3.0
Si vous débutez avec Flex 4, cet ouvrage vous donnera les billes pour avancer rapidement. Tout ne peut bien sûr pas être abordé (le livre fait déjà plus de 600 pages) mais l'essentiel est là. Certains lecteurs de flex-tutorial en ont déjà fait l'acquisition 
Enfin, merci à Aurélien Vannieuwenhuyze pour m'avoir permis de participer à ce beau projet
Mes projets (Open Source)
Autres
