Les bases de la programmation Android - Partie 1

Suite au sondage de la semaine dernière, vous avez décidé d'apprendre en partant de zéro. Me voilà bien embêté, car quelques sites proposent déjà ce genre de tutos et je veux faire dans l'originalité. Qu'à cela ne tienne, je vais essayer de rendre la chose le plus simple et amusante possible, pour trancher avec les autres.

Pour ceux qui attendaient des tutos plus avancés, ne vous inquiétez pas, on va très vite y arriver !

Ça y est, vous avez donc décidé de vous lancer dans la programmation d'applications Android

Que ce soit pour découvrir une nouvelle plateforme de développement, frimer devant vos potes en leur montrant votre propre application, ou sortir une killer app qui rendra ridicule le succès d'Angry Birds, vous avez tous sûrement d’excellentes raisons de vous lancer.

Mais quelles que soient vos raisons et vos motivations, tout le monde passe par la même case, l'apprentissage.

Alors j'en vois déjà qui s'imaginent pouvoir créer leur propres applications tout seul après avoir lu ces quelques lignes alors qu'ils n'ont jamais écrit une ligne de code de leur vie.

Désolé, je ne fais pas de miracles. Il va falloir passer par la case "J’apprends à coder".

Toutefois, rassurez-vous, vous pourrez, si vous avez un peu de jugeote, réussir à suivre ce premier tuto.

Cela ne vous empêchera pas de devoir apprendre plus tard, mais de ma petite expérience, j'ai appris qu'on est beaucoup plus motivé si on a pu avoir un aperçu de ce qu'on peut faire, particulièrement en programmation.

Vous jetez directement et sans ménagement sur le fameux Site du zéro et son énorme cours JAVA découragerait j'en suis sûr la plupart d'entre vous. Restez donc avec nous jusqu'en bas de cette page, vous irez voir ça après.

D'ailleurs, puisqu'on est dans le sujet et que j'ai dit que j'essaierai de faire original, j'ai un excellent site à proposer à ceux qui n'ont jamais programmé et qui veulent apprendre de façon ludique : Code Academy

Ce site est super bien fait, il vous permettra d'apprendre les bases de la programmation tout doucement est de façon très claire puisque votre prof est tout simplement une interface avec laquelle vous allez dialoguer et qui va interpréter directement votre code. De plus au fur et à mesure de votre progression vous développer des "succès" et des "grades" qui, bien qu’anecdotiques, augmentent la motivation !

A voir absolument donc !

Pour en finir avec la partie acquis en programmation, pour ceux qui savent déjà coder en java, le tuto d'aujourd'hui sera un parcours de santé au niveau du code. Mais c'est le reste qui est important.

Bon, trêves de bavardages, let's go !

1- Configuration de l'environnement de développement 

Alors vous allez commencer par télécharger le SDK d'Android (selon votre plateforme) à cette adresse.

Cela fait, allez dans le dossier ou se trouve le fichier zip ainsi téléchargé et extrayez-le où vous voulez.

Lancez le "SDK MANAGER" :

C'est ici que vous allez installer et mettre à jour vos outils de développement.

Vous pouvez choisir uniquement ce dont vous avez besoin. Si vous ne souhaitez développer que pour Android 2.3 alors n'installez que cette version.

Toutefois je vous recommande au moins d'installer la partie "Tools" et pour chaque version que vous installez, la partie "Google API" qui va avec. Il s'agit en fait de fonctions propres à Google tels que les services Google Map, etc... qui peuvent être utile.

Les "Samples for SDK" sont des exemples fournis par Google.

Très bien, maintenant il nous faut une plateforme de développement.

Bien que l'on puisse aussi réaliser de A à Z une application Android en ligne de commande, laissons pour l'instant ça à ceux qui  aiment se faire du mal sont plus expérimentés.

Vous allez donc télécharger et installer Eclipse (je vous conseille de prendre "Eclipse IDE for Java Developers").

Il faut aussi le JDK (Java Development Kit) et le JRE (Java Runtime Environement) que vous trouverez ici. Installez-les.

Cela fait, lancez Eclipse. On vous demandera de définir un "Workspace", c'est l'endroit où vont s'enregistrer tous vos projets.

Ensuite, dans Eclipse, cliquez sur "Help" puis "Install new software" comme ci-dessous.

Cliquez sur "Add" et entrez le nom que vous voulez (exemple : "ADT"). 

Dans la partie location, copiez-coller cette adresse :   https://dl-ssl.google.com/android/eclipse/

Ensuite, "Developers Tools" est disponible. Cochez-le et cliquez sur "Next". Terminez l'installation.

Relancez Eclipse pour que les modifications prennent effet.

Vous devriez maintenant avoir deux nouveaux éléments dans la barre d'outils d'Eclipse.

 

Le premier est le SDK MANAGER que l'on à déjà vu plus haut. 

Intéressons-nous plutôt au deuxième : AVD MANAGER (Android Virtual Device MANAGER)

Comme son nom l'indique, c'est votre gestionnaire d'émulateurs Android.

Un émulateur est très pratique. En effet, même si vous possédez un smartphone Android, vous ne possédez sûrement pas tous les téléphones du marché. Ainsi grâce à l'émulateur, vous allez pouvoir créer une machine virtuelle avec toutes les configurations que vous souhaitez, ce qui vous permettra de tester votre application sur des écrans de différentes résolutions, etc...

Commençons par en créer un. Ouvrez l'AVD MANAGER, et cliquez sur "New"

                           

Remplissez les informations :

Name : Le nom que vous souhaitez donner à votre émulateur 

Target : Version d'Android de l’émulateur (ici la 2.3.3, version actuellement la plus répandue).

SD Card : Si vous voulez que votre émulateur dispose d'une carte SD, entrez ici ses caractéristiques. 

Skin : Taille et résolution de l'écran de votre Émulateur. 

Hardware : Entrez ici les spécifications matérielles de votre émulateur. (Notamment la RAM)

Vous disposez maintenant d'un émulateur et venez de finir la partie la moins intéressante de ce tuto.
Vous pouvez lancez l'émulateur histoire de l’appréhender un peu et d'explorer ces capacités.
Le premier démarrage peut être long, mais rassurez-vous ça ira mieux par la suite.
Évitez toutefois de fermer la fenêtre pour ne pas perdre du temps à le redémarrer à chaque fois que vous souhaitez tester votre application.

Félicitation. Commençons à présent les choses sérieuses.

2- Votre première application Android

C'est parti !

Normalement, vous avez aussi ces trois icônes qui sont apparues dans votre barre d'outils Eclipse :

Cliquez sur celle que j'ai entourée en rouge pour démarrer un nouveau projet. Vous aurez alors cette fenêtre qui va s'afficher :

Mettez le nom que vous souhaitez et continuez.
Vous allez arriver à cet écran :

Ici j'ai choisi de développer pour la version 2.3.3.

On continue :

Remplissez les informations demandées.

Pour le nom du package j'ai l'habitude de mettre : com.nomprenom.nomdelappli

Mais vous mettez ce que vous voulez. Bien qu'il est fortement conseiller de respecter les normes de codage (pour moi c'est important d'être un peu rigoureux sur ce point).

Ainsi donc, vous venez de créer votre premier projet.

Et vous savez quoi ? Sans même avoir touché à une seule ligne de code, ça marche !

Si si, allez-y, testez, lancez-le sur votre émulateur.

Sélectionnez l'émulateur créé précédemment si celui ci n'est pas déjà lancé.

Et magie :

Vous avez crée votre première application, le désormais classique : HELLO WORLD que connaissent tous les programmeurs.

Bon, voyons maintenant de quoi est composée cette application.

Développez arborescence de votre projet comme ci-dessous : 

Étudions la composition de votre projet :

-src : Ici vous trouverez les sources de votre application, ainsi que vos packages.

-Tuto1Activity.java : Votre classe (qu'on appelle: activité) principale. Nous verrons plus en détail ce qu'est une activité dans la suite.

-gen : Ici vous trouverez des fichiers générés automatiquement que vous ne devez pas modifier.

-bin : contient l'application compilée (.apk).

-assets et res : C'est ici que vous mettez les données qui seront utilisées dans votre application telles que des images, des musiques, des vidéos,  etc...

-drawable-hpdi : Mettez ici les images de votre application en haute résolution.

-drawable-ldpi : Mettez ici les images de votre application en basse résolution.

-drawable-mdpi : Mettez ici les images de votre application en moyenne résolution.

-Icon.png : Mettez ici l’icône de votre application. (Le choix de l’icône est très important si vous souhaitez publier votre application).

 

-layout : C’est ici que se trouve tous les fichiers relatifs à la partie "interface utilisateur".

-Main.xml : Le fichier qui définit l'interface graphique de votre page d’accueil, en XML.

-values : Ici se trouvent les fichiers où sont déclarées les variables utilisées par votre application telles que des chaines de caractères, des entiers, etc….

 Ils n'y a normalement pour l'instant que le fichier string.xml où sont déclarées les chaines de caractères (comme la fameuse : "Hello world, Tuto1Activity !")

-AndroidManifest.xml : Fichier important qui définit en quelque sorte les propriétés de votre application pour le système Android (nous y reviendrons plus en profondeur dans un autre tutoriel).

3 - Le code

Penchons-nous désormais sur le code de votre application.

Ouvrez le fichier :  "Tuto1Activity.java" :

package com.estradeantoine.tuto1; import android.app.Activity; import android.os.Bundle; public class Tuto1Activity extends Activity { /** Called when the activity is first created. */ @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); } }

La méthode onCreate est la première qui est appelée lors de la création de l'activité.

Comme nous sommes dans l'activité dite "main" (principale), c'est la toute première méthode qui sera appelée de votre application.

Et que fait-elle cette activité ?

Elle initialise la vue de l'activité. C'est à dire ce qui va apparaitre à l'écran.

Si vous avez suivi, ce qui va apparaître à l'écran, c'est ce qui est défini dans le fichier XML du dossier "layout".

setContentView(R.layout.main);

Ici, on voit que cette ligne de code va chercher le fichier "main.xml" du dossier layout.

L'interface graphique de l'activité "Tuto1Activity" est donc contenue dans ce fichier.

Allons examiner son contenu.

Pour cela, ouvrez-le. Ensuite, vous avez le choix entre deux modes de visualisation.

Le premier "Graphical Layout" est, comme son nom l'indique, graphique. Cela vous permet de vous représenter l'interface sans avoir besoin de lancer l'application sur l'émulateur. Vous pouvez piocher dans les différents objets de la palette à droite pour les faire directement glissés dans votre fenêtre d'application.

Le deuxième mode de visualisation "main.xml" est le code source du fichier.

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:layout_height="fill_parent" android:orientation="vertical" > <TextView android:layout_width="fill_parent" android:layout_height="wrap_content" android:text="@string/hello" /> </LinearLayout>

Si vous modifiez l'interface depuis la méthode "Graphical Layout", le code sera généré automatiquement.

Mais je ne saurais que trop vous conseiller de mettre les mains dans le cambouis, la création automatique ayant tendance à être peu précise et beaucoup moins permissive que du code fait à la main.

Pour ça il faut comprendre ce "main.xml". Il définit une "TextView" (Zone de texte) ayant pour largeur (width) tout l'écran et pour hauteur (height) "wrap_content", qui signifie qu'elle s'adaptera en fonction du volume du texte qu'elle contient.

Pour ce qui est de ce texte, justement, on voit qu'il est défini par : android:text="@string/hello"

Ce qui signifie : La chaîne de caractère au nom de "hello" qui se situe dans le fichier "string.xml".

Ouvrons ce fichier (qui se trouve dans "values", comme je l'ai dit précédemment) :

<?xml version="1.0" encoding="utf-8"?> <resources> <string name="hello">Hello World, Tuto1Activity!</string> <string name="app_name">Tuto1</string> </resources>

Il contient deux chaînes de caractères. Une pour le nom de l'application "app_name", et celle qu'on est venu voir, la chaîne "hello".

Elle contient la phrase : "Hello World, Tuto1Activity!" qui est bien la phrase qui s'affiche dans notre application.

Pour le vérifier, changeons-la : 

<string name="hello">Bonjour, je suis ta première application Android. Je suis moche et inutile mais je le vis bien !</string>

Hum. Enregistrez et relancez l'application :

                                                                      TADAAMMMM !!

Voilà ! Pas trop difficile tout ça n'est-ce pas ?

Mais ce sera tout pour le moment, je ne veux pas rendre ce premier tuto indigeste.

Nous avons vu le strict minimum aujourd'hui mais rassurez-vous, la suite arrive très vite !

On verra notamment comment changer le texte en appuyant sur un bouton, passez d'une vue à une autre, et bien d'autres choses supers cools ! Alors gardez ce Blog dans vos favoris !

En attendant je vous invite à me poser toutes vos questions dans les commentaires, car j'ai conscience d'être (volontairement) resté assez "léger" sur certains points que des lecteurs veulent peut être approfondir.

Sinon vous pouvez aussi allez voir "La Bible" : la documentation officielle d'Android, que je vous conseille d'avoir toujours ouverte dans un onglet lorsque vous programmez. Elle est très complète pour peu que vous maîtrisiez un minimum la langue de Shakespeare.

N'oubliez pas, un petit remerciement si vous avez aimé ce premier tutoriel sera grandement apprécié par son auteur.

Toutes les critiques sont évidemment aussi les bienvenues, c'est ce qui me fera avancer !

Bonne journée à tous et à bientôt