Dès les premiers instants du mobile, il n’y avait vraiment qu’une seule façon d’offrir aux utilisateurs la performance et les fonctionnalités qu’ils attendaient : vous deviez utiliser un SDK, c’est à dire un ensemble d’outils logiciels spécifiques à la plateforme que vous souhaitiez cibler. Bien sûr, cela impliquait un certain nombre de contraintes :
Construire une version différente pour chaque plate-forme mobile
Gérer plusieurs codes sources
Embaucher et retenir des développeurs natifs hautement spécialisés et coûteux
Depuis, beaucoup d’eau a coulé sous les ponts et les demandes de produits adaptés aux mobiles ont augmenté de manière exponentielle.
C’est dans ce contexte de fortes demandes que sont nés des projets comme Ionic qui facilitent le développement d’applications mobiles robustes et intuitives.
Il y a encore quelques années, développer une application mobile relevait du parcours du combattant. Il fallait coder un code spécifique à la plateforme que l’on ciblait : Java pour Android et Blackberry, Objective-C pour iOS pour ne citer que ces trois là.
Puis, sont arrivés des plateformes de développement multiplateformes comme Titanium ou encore Cordova, qui à leur manière ont grandement modifier notre approche du développement mobile. Mais malgré leur nombreux atouts, ces Frameworks m’ont dans mes débuts laissé un peu sur ma faim.
Ionic est apparu à une période ou je souhaitais développer rapidement, et surtout proprement, une application mobile. Vous verrez que ses nombreuses fonctionnalités vont très vite vous convaincre d’y consacrer une bonne partie de votre temps. C’est que lorsqu’on y à goûter, on ne peut (ou presque) plus s’en passer.
Introduction
Ionic, c’est un ensemble de technologies (un SDK, pour Software Developpement Kit : kit de développement logiciel) qui ensemble permettent de créer une application mobile déployable sur de nombreuses plateformes (Android, iOs,…) :
Cordova : un Framework qui permet d’accéder à des fonctions natives présentes dans les smartphone (Appareil photo, Micro, Géolocalisation, Contacts,…)
AngularJS : un framework Javascript développé et maintenu par Google.
TypeScript : un langage de script proche de Javascript
HTML 5 : la dernière version du fameux langage à balises
NodeJS : Un framework Javascript utilisé pour sa faculté à la fois du client et du serveur
Et d’autres technologies comme gulp, npm,…
4 caractéristiques qui font de Ionic un super outil de travail
Gratuit et Open Source
Pas besoin d’acheter une quelconque licence pour développer avec Ionic. Son code est disponible sur Github et tout le monde peut y avoir accès, apporter des modifications et contribuer à son évolution. Vous n’en n’aurez peut être pas l’occasion, mais si ça vous tente n’hésitez surtout pas.
Comme nous l’avons déjà dit, Ionic permet la création en une seule fois d’une application déployable sur différents OS mobiles. Et ceci ne concerne pas uniquement les fonctions matériels, mais aussi le design et l’ergonomie. Une alerte par exemple s’affichera selon le style de l’OS qui exécutera l’application. Et honnêtement, les styles sont extrêmement fidèles.
Fonctions natives
C’est sûrement l’une des choses que je préfère chez Ionic, cette possibilité d’intégrer à votre application des fonctions natives (Appareil photo, Caméra, Authentification Google/Facebook…) avec une facilité déconcertante. Tout y est, de la Géolocalisation, aux fonctions réseaux, en passant par les bases de données. Bref, la totale quoi.
Honnêtement, une fois que vous aurez pris connaissance de la documentation, vous n’aurez presque plus besoin de moi. Mais, bon restez quand même, je me sentirais moins seule comme ça.
J’ai rarement vu une documentation aussi bien faite : des illustrations, des textes claires (même écrits en anglais),… Bref, tout pour devenir en quelques jours un pro du Framework
Google+ Sign-in permet aux utilisateurs de se connecter à une application Android à l’aide de leurs informations d’identification Google existants, tout en mettant à disposition leurs informations Google+ pour une expérience utilisateur encore plus intéressante.
Lorsque les utilisateurs se connectent avec Google, il est désormais possible de mettre à contribution leurs informations Google+ (données du profil public, cercles, …). Chose intéressante pour les développeurs, car ceci permettra depuis l’application, d’accueillir les utilisateurs par leur nom, afficher leur photo, leurs contacts Google+, …
Ainsi, en plus de l’authentification de base, l’outil permettra d’augmenter le nombre de téléchargements d’une application et surtout la fidélité et l’expérience utilisateur.
Heureux détenteur d’un Nexus 7, voici pour toi et en exclusivité mondiale (j’exagère un peu :-), mon Top 10 + 1 des meilleurs applis Android :
Teamviewer
Teamviewer, disponible également en version PC et Mac, permet la prise de contrôle d’ordinateurs à distance.Bien pratique si l’on souhaite dépanner un ami .
Le Microsoft Office killer en ligne de Google continue sa course en proposant un outil de bureautique ergonomique avec possibiltié de stockage hors ligne du fichier. Histoire de le comparer à la suite office, Google drive gère les feuilles de calcul (Excel), les documents texte (Word), les présentations (Powerpoint) et beaucoup d’autres outils à découvrir sur place.
Plus besoin de présenter le célèbre antivirus disponible aussi sous Android. Cette version mobile scannera chaque application que vous installerez pour y déceler d’éventuelles failles. Elle vous permettra aussi de connaitre (ce qui est en fait déjà possible en natif) les différents droits que vous attribuez (souvent sans vous en rendre compte) aux applications que vous installez (geolocalisation, accès aux contacts, messagerie, …)…Bref vous serez tenter de désinstaller certaines applications tellement elles sont intrusives.
L’application permet la lecture et la sauvegarde hors connexion de musique stockées sur Google Music. Il faut donc au préalable activer son compte Google Music, puis uploader sa bibliothèque musical (Jusqu’à 20 000 titres, autant dire illimité:-). Pour l’avoir essayé bien avant sa disponibilité en France, je dois dire que je suis très très satisfait.
L’information en temps réel et de sources variées. Un module de suggestion intégré permet de s’abonner aux flux les plus visités dans le monde et ceux correspondant à nos habitudes de lecture. La plupart des grands éditeurs, sinon tous, sont disponibles. Il n’est, par ailleurs, pas nécessaire de créer un compte.
La Nexus 7 ne disposant pas encore nativement d’une application gérant la caméra frontale, cette application permet de prendre des photos ou encore de filmer. Seul hic, l’application bug en mode photosphere. Mais bon, rien de bien méchant.
L’instagram Killer made in Google planet. L’application permet de modifier des images en y ajoutant de super effets qui vous ferons vite oublier (ou presque) Instagram. Il est possible après modification, de publier les photos sur Google+. Il n’est par ailleurs pas nécessaire d’avoir un compte comme sur Instagram.
L’application officielle TED pour Android présente des conférences de grandes personnalités du monde: scientifiques, gourous des nouvelles technologies, médecins, hommes d’affaires, artistes, philanthrophes, … Le tout visionnable depuis une interface fluide et ergonomique.
Déjà disponible sous iOS, Epic Citadel est une application de démonstration du moteur de rendu 3D Unreal. Cette application vous fera visiter de somptueux paysages au style moyenâgeux. S’il n y pas de combats ni de missions, l’application permet de une visite à la fois relaxante et distrayante.
Dans le cadre d’un développement mobile, il peut être intéressant d’avoir un rendu de son application sur différentes plateforme. La première solution consiste à acheter tous les smartphones du moment (prévoir un peu de sous quand même :). La deuxième, plus économique consiste à utiliser un émulateur.
Il en existe pour l’ensemble des plateformes du moment. Voici une liste des plus populaires, suivie de quelques outils intéressants à mes yeux :
A l’occasion du BlackBerry World organisé chaque année par la firme Research In Motion, Thorsten Heins, CEO de la société, a présenté le prototype BlackBerry 10 Dev Alpha à destination des développeurs de la plateforme.
Censé relancer la croissance de la plateforme, le BlackBerry 10, nouvelle version de l’OS mobile de la société, se présente en révolutionnaire. En effet, il se distingue très fortement des versions précédentes. Quant au prototype présenté au BBW, la première chose dont est frappée en le regardant est l’absence de clavier physique, une nouveauté du côté de RIM qui nous avait presque habitué à ses claviers physiques qui ont d’ailleurs fait, à une certaine époque, la popularité de la firme canadienne.
Le BlackBerry World a demarré avec un discours introductif de son CEO Thorsten Heins,en précisant combien il était ravi de voir autant de monde à cette première keynote, et ce malgré les difficultés dont souffrent la plateforme BlackBerry actuellement. Il s’est attaché à faire aller de l’avant la société, en ne privilégiant plus uniquement les entreprises et les professionnels, mais en s’ouvrant à un marché plus grand d’utilisateurs beaucoup plus modestes.
le PDG n’a tout d’abord pas caché les lacunes dont souffre actuellement son OS mobile, puis s’est ensuite empressé de présenter la solution à tous leurs problèmes : le BlackBerry 10. Voici quelques caractéristiques présentes dans le prototype embarquant l’OS:
Système d’exploitation :BlackBerry 10 (Developer Alpha Preview)
Stockage : 16 Go
Connectivité : HSPA+, BlueTooth, NFC
Caméras : 1 frontale sans flash, 1 arrière avec flash
Connecteurs : microHDMI, microUSB
Clavier virtuel doté d’un excellent outil de suggestion de mots. Le clavier étudiera vos frappes, enregistrera vos types de conversation jusqu’à prédire, lors d’une saisie, les mots qui vous souhaiteriez frapper.
Nouvelle interface utilisateur nommée Cascades, créée par TAT une société rachetée par RIM en décembre 2010.
Ecran 4.2″ de résolution 1280 x 768 pixels
(Multi-tâches) Navigation entre applications en cours d’exécution par simple Swipe de gauche à droite, sans devoir fermer ou réduire l’application courante.
Un screen du prototype qui est, soit dit en passant, très inspiré du PlayBook :
On est quand même frappé par la ressemblance de l’interface utilisateur du BlackBerry 10 avec d’autres OS comme Windows Phone ou Android.
Là (Windows Phone) :
Et là (Android ou Bada) :
Le smartphone, disponible actuellement pour les développeurs, devrait sortir en version finale à la fin de l’année. Espérons que d’ici là, RIM sera toujours présent dans le marché des mobiles.
Nous verrons dans ce tuto qu’il existe 2 façons de sauvegarder des données dans un fichier sur Android. Vous êtes prêt ? Alors c’est parti !
Tout d’abord, on peut faire une sauvegarde interne dans la mémoire du téléphone ou bien faire une sauvegarde externe dans la carte SD de l’utilisateur.
Il faut savoir que les informations enregistrées dans la carte mémoire externe du terminal mobile sont accessibles par l’ensemble des applications.
Alors que les données sauvegardées en mémoire interne peuvent ou nonêtre partagé en lecture ou/et en écriture avec les autres applications.
Voici la liste des différentes permissions pour la création d’un fichier dans la mémoire interne :
MODE_PRIVATEcrée un fichier (ou remplace l’existant), le fichier ne sera disponible que pour notre application.
MODE_APPEND crée un fichier (concatène si le fichier existe)
MODE_WORLD_READABLE accès en lecture par les autres applications
MODE_WORLD_WRITEABLE accès en écriture par les autres applications
MODE_WORLD_READABLE|MODE_WORLD_WRITEABLE accès en lecture et écriture par tous
Pour l’écriture nous allons utiliser la méthode openfileoutput qui va renvoyer un FileOUtputStream,
Pour la lecture il faut utiliser la méthode openFileInput qui renvoie un FileInputStream.
Nous allons mettre en place une application toute simple qui va jouer le rôle d’un bloc note.
L’utilisateur pourra écrire dans un fichier, mais également l’ouvrir et l’éditer.
En termes d’interface nous aurons :
juste une zone de saisie.
Un bouton pour enregistrer les modifications.
Un bouton pour afficher le contenu de notre fichier.
Découvrez en exclusivité un eBook complètement gratuit sur le Framework jQuery Mobile.
Désormais en version 1.4.5, jQuery Mobile, qui permet de créer des sites mobiles multiplateformes, ne cesse d’évoluer et de séduire de plus en plus de développeurs, déjà très familiers de jQuery, dont s’inspire d’ailleurs le framework Mobile.
Ce livre électronique vous permettra de découvrir en profondeur les nombreuses possibilités et surtout facilitées offertes par jQuery Mobile.
Bien plus qu’une introduction, « Développer avec jQuery Mobile » fera de vous un expert du Framework.
Dans ce tuto, nous allons voir comment il est possible, comme le titre l’indique, d’améliorer notre navigation sur notre smartphone Android préféré en utilisant des tâches asynchrones via la classe AsyncTask ! Sur Android, l’ensemble des éléments graphiques sont gérés à partir d’un thread principal que certaines appellent « UI thread« . Il est donc déconseillé d’utiliser ce thread pour des opérations coûteuses ( requêtes en base, chargement d’éléments depuis le web … ).
Il faut considérer que toute opération nécessitant un temps de traitement supérieur à 5 secondes sera considérée comme nuisible. Une boite de dialogue s’ouvrira alors pour informer l’utilisateur que l’activité ne répond pas. Pour mieux comprendre ce comportement, nous allons réaliser une petite application dont le but est de provoquer un ARN ( … et non ce n’est pas une maladie, ou un genre de crise ), ARN signifie simplement « Activity not Responding ».
Comme on peut le voir, on aura un bouton qui va lancer une opération et une zone de saisie qu’on va essayer d’utiliser durant le traitement de l’opération.
Voici maintenant le code de notre activité :
Code de l’activité
public class AsyncTastActivity extends Activity {/** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState){ super.onCreate(savedInstanceState); setContentView(R.layout.main); Button btn =(Button) findViewById(R.id.btn); btn.setOnClickListener(new OnClickListener(){ public void onClick(View v){ dormir();}});} private void dormir(){ try { Thread.sleep(10000); } catch (InterruptedException e){}}}
Testez maintenant votre code :
Lancez le programme, cliquez sur le bouton puis aussitôt, essayez de saisir un mot dans la zone de saisie. Vous verrez donc apparaître la fameuse boite de dialogue Activitiy not Responding.
Pendant le traitement, on ne peut pas faire autre chose comme taper du texte dans un champ.
Pour résoudre ce problème, on peut utiliser la classe AsyncTask. Cette classe sera notre carte maîtresse pour réaliser des tâches de manière asynchrone. Elle crée un deuxième thread de manière à ne pas bloquer le thread principal !
La classe prend 3 paramètres d’entrées.
La paramètre fourni à la tâche de fond
Le type de donnée à transmettre pendant la progression de la tâche
Le type de donnée renvoyé par la tâche
La méthode doInBackground ( le traitement se fait dans cette méthode ) doit absolument être implémentée.
Les méthodes onPreExecute ( méthode appelée avant le début du traitement ), onProgressUpdate ( appelée durant le traitement ), onPostExecute ( appelée à la fin du traitement ) sont facultatives !
Reprenons donc notre application avec la classe AsyncTask :
Classe AsyncTask
publicclass AsyncTastActivity extends Activity {/** Called when the activity is first created. */ @Overridepublicvoid onCreate(Bundle savedInstanceState){super.onCreate(savedInstanceState); setContentView(R.layout.main);Button btn =(Button) findViewById(R.id.btn); btn.setOnClickListener(new OnClickListener(){publicvoid onClick(View v){new UseTaskasync().execute();}});}privateclass UseTaskasync extends AsyncTask<Void, Void,Void>{ @Override protectedvoid onPreExecute(){ Toast.makeText(getApplicationContext(), "Début du traitement", Toast.LENGTH_LONG).show();} @Override protectedVoid doInBackground(Void... params){try{Thread.sleep(10000);}catch(InterruptedException e){}returnnull;} @Override protectedvoid onPostExecute(Void l){ Toast.makeText(getApplicationContext(), "Fin du traitement", Toast.LENGTH_LONG).show();}}
Relancez votre application, il est maintenant possible d’utiliser la zone de saisie tout de suite après le clic sur le bouton ! Ceci prouve bien que le traitement n’est pas réalisé par le thread principal mais par le deuxième créé par la classe AsyncTask.
La classe AsyncTask et ses méthodes permet donc de naviguer dans notre application ( rentrer du texte dans un champ ) tout en éxécutant une tâche au moyen de tâches asyncrones !
Merci d’avoir suivi ce tutoriel ! N’oublie surtout pas de VOTER et de la PARTAGER !!
Dans l’onglet Api access, créez un nouveau compte puis récupérer l’api key.
Dans l’onglet Services, activez « Places API« .
Pour pouvoir récupérer les lieux dans les 500m aux environs d’un point ( latitude/ longitude ), il faut appeler une url de ce type en remplaçant le key par la vôtre :
A la racine du Json renvoyé se trouve « results« . Il va contenir une liste de lieux, à un lieu est associé des attributs tels que ( id, name … )
Dans le cadre de ce tutoriel, nous allons nous contenter de demander à un utilisateur de rentrer une adresse, de sélectionner un type de lieu puis de les afficher à l’écran.