Créer une application iOS / Android avec AIR de A à Z
Depuis la version 4.5.1 de Flex / Flash Builder, il est devenu bien plus aisé de développer des applications pour mobiles multi-plateformes. Flex-tutorial.fr vous propose donc un "fil rouge" qui va vous permettre de développer une application de A à Z, depuis la conception jusqu'à la mise sur le Market.
Ces tutoriaux sont destinés aussi bien aux débutants qu'aux utilisateurs expérimentés. Pour toute demande d'aide, veuillez utiliser les commentaires de l'article concerné.
L'application Pokémon Infos
Cette application est un Pokédex, c'est-à-dire un "répertoire" de Pokémons. A l'issue de ce fil rouge, vous aurez toutes les billes en main pour créer votre propre application. Faites donc bien attention à toutes les techniques expliquées dans ces tutoriaux, que vous pourrez reproduire dans votre application. Voici par exemple un des écrans que vous allez créer:
L'application finale nommée "Pokemon Infos" peut-être téléchargée à l'adresse suivante:
Pokémon Infos pour Android (APK)
J'ai retiré l'application de l'Android Market pour des problèmes de propriété intellectuelle avec The Pokémon Company.
Démonstration vidéo de l'application finale:
Un lecteur de flex-tutorial à d'ailleurs suivi ce "fil rouge" et créé sa propre application que vous pouvez retrouver sur le Market Android:
Small World Pédia sur Android Market
Voici une vidéo de l'application finale:
Liste des tutoriaux du "fil rouge" Pokémon:
- AIR Mobile – Application Pokémon (1) – Conception et maquettage
- AIR Mobile – Application Pokémon (2) – Préparation de l'application
- AIR Mobile – Application Pokémon (3) – Ouverture de la BDD SQLite
- AIR Mobile – Application Pokémon (4) – Lancer l'application dans l’émulateur + debugger
- AIR Mobile – Application Pokémon (5) – Liste des Pokémon depuis la BDD SQLite
- AIR Mobile – Application Pokémon (6) – Filtrer la liste des pokémons avec un champ de recherche
- AIR Mobile – Application Pokémon (7) – Modifier le style de la liste
- AIR Mobile – Application Pokémon (8) – Navigation vers une autre vue par la méthode pushView
- AIR Mobile – Application Pokémon (9) – Affichage des informations de base dans la vue détail
- AIR Mobile – Application Pokémon (10) – Affichage des statistiques / Création de primitives
- AIR Mobile – Application Pokémon (11) – Affichage des statistiques / Création d'un composant
- AIR Mobile – Application Pokémon (12) – Affichage des statistiques / Utilisation du composant PokemonStat
- AIR Mobile – Application Pokémon (13) – Affichage des statistiques / Styling du composant
- AIR Mobile – Application Pokémon (14) – Amélioration de la vue de détail : Styles et navigation
- AIR Mobile – Application Pokémon (15) – Lecture d'un son mp3 avec la classe Sound
- AIR Mobile – Application Pokémon (16) – Réaliser une Skin de bouton générique
- AIR Mobile – Application Pokémon (17) – Afficher les évolutions du Pokémon (SQLite + navigation)
- AIR Mobile – Application Pokémon (18) – Tester l'application sur Android
- AIR Mobile – Application Pokémon (19) – Déployer son application sur iOS
- AIR Mobile – Application Pokémon (20) – Déployer son application iOS sur l'AppStore
- AIR Mobile – Application Pokémon (21) – Icônes pour Android et iOS
- AIR Mobile – Application Pokémon (22) – Splash Screen pour différentes tailles et orientations
- AIR Mobile – Application Pokémon (23) – Le mécanisme de persistance intégré au SDK Flex (PersistenceManager)
- AIR Mobile – Application Pokémon (24) – Utiliser la persistance pour conserver des données
- AIR Mobile – Application Pokémon (25) – Conserver la position du scroll vertical d'une List
- AIR Mobile – Application Pokémon (26) – Modifications de style pour iOS
- AIR Mobile – Application Pokémon (27) – Utilisation d'images différentes suivant les DPI (MultiDPIBitmapSource)
- AIR Mobile – Application Pokémon (28) – Téléchargement des images au premier lancement de l'application
- AIR Mobile – Application Pokémon (29) – Optimisations au démarrage et fichier .nomedia
- AIR Mobile – Application Pokémon (30) – Lecture des images et des mp3 depuis la carte SD
- AIR Mobile – Application Pokémon (31) – Affichage de la progression du téléchargement dans DataPreparationView
- AIR Mobile – Application Pokémon (32) – Utilisation de requêtes SQL paramétrées
L'application TweetDeck-like
Le deuxième fil rouge de flex-tutorial, c'est l'application TweetDeck ou plutôt un prototype qui a pour but de reproduire le style de certains écran TweetDeck. Dans ce tutorial vous apprendrez à configurer un service HTTP (Twitter), à récupérer les résultats, à les afficher sous forme de liste et bien d'autres notions.
Voici le rendu (à quelques détails près) de l'application finale:
Liste des tutoriaux du fil rouge TweetDeck:
- AIR Mobile – Application TweetDeck (1) – Conception de l'application
- AIR Mobile – Application TweetDeck (2) – Préparation de la vue principale
- AIR Mobile – Application TweetDeck (3) – Ajout de la barre de navigation
- AIR Mobile – Application TweetDeck (4) – Création de la barre du haut (header)
- AIR Mobile – Application TweetDeck (5) – Création d'un composant de défilement horizontal
- AIR Mobile – Application TweetDeck (6) – Configuration des appels HTTP au service Twitter
- AIR Mobile – Application TweetDeck (7) – Afficher une liste de Tweet
- AIR Mobile – Application TweetDeck (8) – Création d'un itemRenderer pour l'objet Tweet
- AIR Mobile – Application TweetDeck (9) – Finalisation des styles de l'itemRenderer
- AIR Mobile – Application TweetDeck (10) – Corriger les espaces blancs entre les éléments d'interface (SolidColorStroke avec weight > 1)
- AIR Mobile – Application TweetDeck (11) – Affichage d'un texte en fond lors du chargement des tweets
- AIR Mobile – Application TweetDeck (12) – Ajout de listes multiples avec déplacement horizontal
- AIR Mobile – Application TweetDeck (13) – Appels génériques au service Twitter
- AIR Mobile – Application TweetDeck (14) – Affichage dynamique de l'état des colonnes dans le header
- AIR Mobile – Application TweetDeck (15) – Rafraîchir les listes de Tweet à intervalles réguliers
- AIR Mobile – Application TweetDeck (16) – Finalisation de l'application
Mes projets (Open Source)
Autres
