Programmation Android avec AndroidStudio


Cliquez ici pour retirer la feuille de style si vous souhaitez imprimer ce document (ou en cas de problème d'affichage).

Prise en main de l'IDE

  1. Ouvrez AndroidStudio
  2. Créez un nouveau projet (Adaptez le niveau de l'API aux devices que vous visez !)
  3. Choisissez le template le plus simple (EmptyActivity)
  4. Prenez connaissance des différentes parties du logiciel. Explorez le contenu du repertoire ressources, trouvez le code Java de l'activity principale etc.
  5. À l'aide de l'éditeur graphique, ajoutez un Layout (par exemple LinearLayout, ou RelativeLayout). Observez systèmatiquement les changements dans le fichier .xml
  6. Ajoutez un texte du style "Hello World!" (en anglais)
  7. Testez l'application sur votre device, et/ou avec un AVD (android virtual device)
  8. Ajoutez le code suvant dans la méthode onCreate() (vous aurez peut etre besoin de l'adapter si vous n'avez pas choisi un RelativeLayout à la question 5): 
    RelativeLayout rLayout = (RelativeLayout) findViewById(R.id.activity_main);

    Button button = new Button(this);
    button.setText("Hello Button!");
    rLayout.addView(button);

     

  9. Testez. Expliquez. Est-ce la bonne solution pour ajouter une view dans notre activité ? Dans quel(s) cas imagineriez vous que cela pourrait être utile de passer ainsi par le code java et non le xml pour ajouter des éléments ?
  10. Effacez le code ou mettez le en commentaire, et ajoutez le boutton à votre application en passant par le .xml
  11. Changez le texte du boutton en "Apply"
  12. Ajoutez un champs de texte éditable à l'application.
  13. Ajoutez d'autres types de view pour tester. Amusez vous. Vous les effacerez avant de passer à la suite.

Gérer des évenements

Nous allons maintenant rendre l'application un peu plus interractive : Nous souhaitons que lorsque le bouton est cliqué, le texte présent dans la zone éditable remplace le message "Hello World"

  1. Dans le code de l'activity, récupérer les références des différentes view (le boutton, le texte et le texte éditable) à l'aide de la méthode findViewById(). Cela va peut etre nécessiter que vous donniez des identifiant à vos view dans le .xml (si ce n'est pas déjà fait).
  2. Vous observez que vous pouvez invoquer sur le boutton la méthode setOnClickListener(). Utilisez l'autocompletion de l'IDE (ctrl+espace), il devrait vous générer quelque chose comme 
    b.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {

    }});
  3. Il suffit maintenant d'ajouter du code dans la méthode onClick() pour que ce code soit exécuté lorsque l'on clique sur le boutton.
  4. Essayez par exemple un affichage (System.out.println("test");) : où s'affiche le message ? Esssayez System.err.println(). 
  5. Si on veut voir le message sur l'appareil cible, il va falloir utiliser des outils de l'API android. Regardez la documentation de Toast et faites en sorte d'afficher le message de votre choix lorsque le boutton est cliqué. Jouez avec les différents attributs pour faire durer l'apparition du message plus ou moins longtemps.
  6. Faites la même chose avec la classe SnackBar  
  7. Vous devriez maintenant être capable de répondre à la problèmatique : Nous souhaitons que lorsque le bouton est cliqué, le texte présent dans la zone éditable remplace le message "Hello World"

Externalisation et Internationalisation

L'utilisation d'un IDE nous facilite grandement la vie, notamment pour la gestion des chaines de caractères.

Externalisation 

Les Chaines peuvent être à trois endroit : 

  • dans le code (String s = "coucou")
  • dans le xml qui décrit l'activity
  • dans le xml strings.xml

Nous souhaitons que toutes les strings soient dans le fichier strings.xml. Pour cela, c'est simple, cliquez par exemple sur la String HelloWorld que l'on passe à setText() au début de la méthode onCreate().

Une ampoule apparait dans la marge. Cliquez et choisissez "Extract String ressource", une boitte de dialogue apparait et vous pouvez choisir un nom pour la nouvelle ressource, qui va remplacer la String dans votre code.

Ouvrez le fichier strings.xml : vous voyez votre chaine ? Vous pouvez faire exactement pareil avec les chaines qui se trouvent dans le .xml qui décrit l'application, par exemple avec le nom du boutton.

Faites le pour toutes vos chaines.

Internationalisation

Ouvrez maintenant le fichier strings.xml 

Vous remarquez tout de suite qu'une ampoule apparait en haut à gauche. Cliquez, vous obtenez un lien pour ouvrir une boitte de dialogue pour éditer les traductions. En cliquant sur le logo en forme de planete, vous pouvez indiquez que vous souhaitez dupliquer le fichier strings.xml pour le cas ou le système est réglé sur une lanque particulière. Ajoutez par exemple le francais. Ensuite ajoutez une traduction pour toutes vos strings. Testez. Magique ?

Une deuxième activité et au lit !

Pour terminer ce TP de prise en main, vous allez ajouter une deuxième activité à votre application.

Le plus simple : cliquez sur l'activité principale. Copiez. Collez (en changeant de nom).

À l'aide d'un Intent (regardez la documentation) vous allez modifier le comportement du boutton de l'activité principale pour que le click fasse passer sur la seconde activité.

Comment revenir à l'activité principale ?

J'ai tout fini et il n'est pas 19h, je peux rentrer ?

non. Bonus :

Essayez d'afficher des toast qui reconnaissent la direction principale d'une ligne tracée avec le doigt sur l'écran. Pour cela surchargez la méthode onTouchEvent de Activity (regardez la doc!). Essayez de le faire tout seul sans chercher du code tout fait sur internet (hors example de la doc officielle)