Programmation Android

Ana ROXIN Partie 02 – Introduction à Android Studio

 Android Hello
Studio World

2 Plan du cours
Vous avez sûrement réalisé le fameux "Hello World" dans de nombreux langages de programmation.
Nous allons maintenant le réaliser dans le monde Android.

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Fichiers source
3

 Sur [Link]
 Répertoire XXX
 Cours
 TD: énoncé + fichiers source

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016
 Un peu d’histoire…
5

 < 05.2013 Google était pour Eclipse et le Plugin ADT (Android Development Tools).
 Beaucoup de développements réalisés – Google Play Store est le magasin d’applications
mobiles le plus riche actuellement

 Google I/O de 2013 présentation de la première version d'Android Studio.

 Version 0.1 en access preview
 Version 0.8 en béta en juin 2014
 Version 1.5.1 stable depuis 03.12.2015
 Version 2.0 en access preview 4 depuis 17.12.2015
 Version 2.0 stable depuis 07.04.2016
 Actuellement Version 2.1.3

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Eclipse vs. Android Studio
6

Eclipse Android Studio

• Développé par IBM, puis • Basé sur l'IDE de JetBrains,
open source en 2001, géré IntelliJ IDEA.
par la Fondation Eclipse • Intègre le moteur Gradle
maintenant
• Modulable

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Tableau comparatif
7

ADT (Eclipse) Android Studio

Facilité d'installation Moyen Simple

Langue Nombreuses Anglais
Performance Peut être lourd Rapide
Système de build Ant Gradle
Génération de variante et de
Non Oui
multiple APK
Android Code completion et
Base Avancé
refactoring
Editeur d'interface graphique Oui Oui
Signature d'APK et gestion de
Oui Oui
Keystore
Support NDK (C/C++ pour
Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Oui Oui
Semestre Automne 2016
jeux)
 Vue d'ensemble
8

Aide pour Emulateur Gradle Modèles de code

l'édition de code riche build + lien gitHub

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Dernières fonctionnalités
Android Studio 2.0
9

Exécution de code Emulateur plus Cloud Test Lab Indexation

plus rapide rapide (jusqu'à 3x) • Tester les applis à d'applications
• A partir de l'API 14 • ADB jusqu'à 10x plus travers un grand • API App Indexing
(Ice Cream Sandwich) rapide nombre de terminaux • Spécification de l'URL
et configurations et des attributs dans
l'[Link]

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Configuration requise
10

 4 Go RAM
 8 Go de RAM souhaitables pour Android Studio avec un émulateur
 400 Mo pour Android Studio
 au moins 1 Go pour Android SDK, images des émulateurs et cache
 1 écran en 1280 x 800 (mini)
 Au niveau des OS:
 Windows 8/7/Vista/2003
 Mac OS X 10.8.5 (jusqu'à 10.9)
 Distribution Linux en 32 ou 64 bits, pouvant exécuter du code 32 bits

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Installation
11

 Au préalable vérifiez que vous avez un JDK installé sur votre machine
 Sinon: [Link]
[Link]
 JDK 6 pour applis inf. à Android 5, sinon JDK 7 au-délà
 JDK 8 pas officiellement supporté (idem pour les différentes version d'Open JDK)
 Installation d’Android Studio avec le SDK
 [Link]

 Possibilité d’installer Android Studio et le SDK séparément (SDK Tools only)

 [Link]

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Android SDK Manager
12

 Ouvrir Android Studio

 Ouvrir le gestionnaire de SDK (SDK Manager)

 Choisir d’installer les API 15 et 16, puis cliquer OK

 Vous pouvez supprimer les éventuelles versions supérieures installées

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016
 Création d’un nouveau projet
14

 Start a new Android Studio project

 Configure your new project

 Application name: HelloAndroidStudio
 Company domain: [Link]
 Package name:
 Target AndroidDevices:
 cochez Phone et Tablet (laissez les autres options décochées)
 Minimum SDK: API 15
 Add an Activity to Mobile
 Choisissez Blank Activity, puis Next
 Customize the activity – laissez les différentes valeurs telles quelles
 Cliquez sur Finish

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

15

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

16

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

17

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

18

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

19

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

20

Vue « Project » Vue « Android »

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Fichier [Link]
21

 Ouvrez le fichier app\[Link]

Saisissez « 15 » pour les valeurs de compileSdkVersion et targetSdkVersion.

Sauvegardez les modifications (Crtl + S)

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Exécuter sur un terminal
22

 Activez les options développeur sur vos terminaux

 Paramètres > A propos du terminal > Clic 7 fois sur la dernière ligne (version du built)

 Dans les Options développeur, cochez la case Déboggage USB

 Connectez votre tablette avec le câble USB fourni

 Attendez la fin de l’éventuelle installation des drivers nécessaires

 A partir de Android Studio, cliquez sur le bouton Run…

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

23

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

24

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

25

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Exécuter sur un émulateur
26

 Dans Android Studio, cliquez sur le bouton AVD Manager

 Dans la nouvelle fenêtre Android Virtual Device Manager, cliquez sur le bouton en
bas à gauche Create Virtual Device

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Création émulateur – 1
27

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Création émulateur – 2
28

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Création émulateur – 3
29

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Exécuter sur un émulateur – 2
30

 Revenir dans Android Studio

 Cliquez sur Run > Run…
 Choisissez l’émulateur dans la liste des terminaux actifs

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Exécuter sur un émulateur – 3
31

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Remarques sur les scripts Gradle
32

 Android Studio utilise des scripts Gradle pour compilation

 Il s’agit d’un outil d’automatisation de tâches projet qui utilise un DSL (Domain-Specific
Language) au lieu du traditionnel XML pour créer la configuration d’un projet

 Les projets contiennent un fichier Gradle haut-niveau, puis un fichier Gradle pour
chacun des modules les composant
 Les fichiers [Link]
 La plupart du temps, seul le fichier [Link] du dossier app nécessitera votre attention

 Pour l’instant, vous devez savoir que c’est ici que sont spécifiées les valeurs pour
compileSdkVersion, targetSdkVersion, minSdkVersion et versionCode et
versionName
 Avec Eclispe, ces valeurs étaient définies dans [Link]

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Gestion des fonctionnalités et
librairies avec Gradle
33

 Gradle gère aussi les dépendances du projet

 Librairies et fichiers *.jar locales ou à distance
 Nécessaires à la compilation et à l’exécution du projet
 Le fichier [Link] du dossier app contient le nom du repository où sont
stockées ces librairies
 Par défaut jCenter
 Pour ajouter une fonctionnalité en plus, il faut déclarer une nouvelle dépendance
 Idem pour l’ajout d’une nouvelle librairie

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016
 But
35

 Apprendre les principaux concepts et éléments constituant une application Android

 Développement de l’application GeoQuiz:
 Teste les connaissances de l’utilisateur en géographie
 Pour chaque question affichée à l’écran, l’utilisateur peut répondre Vrai ou Faux
 L’application affiche une notification indiquant si la réponse était correcte ou pas

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

36

3.1 LES CONCEPTS DE BASE

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Concepts de base
37

 Une application Android se compose d’activités et de mises en page

 Une activité est une instance de la classe Activity du SDK Android
 Une activité gère les interactions entre l’utilisateur et un écran d’informations
 Pour chaque fonctionnalité d’une application, on écrit des sous-classes d’Activity
 Plus une application est complexe, plus il y a de sous-classes
 Pour GeoQuiz: une seule sous-classe d’Activity, appelée [Link]
 Une mise en page (layout) définit un ensemble d’objets d’interface, avec leurs
positions à l’écran
 Un layout s’écrit à travers des définitions XML
 Chaque définition correspond à la création d’un objet présent à l’écran (e.g. bouton)
 Pour GeoQuiz: un seul layout content_main.xml

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Fonctionnement de l’application
GeoQuiz
38

MainActivity
content_main.xml

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Nouveau projet GeoQuiz – 1
39

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Nouveau projet GeoQuiz – 2
40

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Nouveau projet GeoQuiz – 3
41

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

42

3.2 MODIFICATION DE L’INTERFACE

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Interface Android Studio
Vue « Design »
43

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Interface Android Studio
Vue « Text »
44

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Mise en page par défaut
45

<?xml version="1.0" encoding="utf-8"?>

<RelativeLayout xmlns:android="[Link]
xmlns:app="[Link]
xmlns:tools="[Link]
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="[Link]"
tools:showIn="@layout/activity_main">

<TextView
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="Hello World!" /> Définition de 2 widgets:
</RelativeLayout>
- Un RelativeLayout
- Un TextView

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – les vues
46

 Les vues sont les briques de construction de l’interface graphique d’une activité
Android.

 Les objets View représentent des éléments à l’écran qui permettent d’interagir
avec l’utilisateur via un mécanisme d’événements.
 Chaque écran Android contient un arbre d’éléments de type View dont chaque élément est
différent de par ses propriétés

 Pour être affichées à l’écran, les vues peuvent être disposées dans une activité
(objet Activity):
 soit par une description XML,
 soit par un morceau de code Java.

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – les widgets
47

 Les widgets sont les constituants de base d’une interface utilisateur Android
 Un widget peut:
 Afficher du texte ou des images
 Interagir avec l’utilisateur
 Disposer (placer) d’autres widgets à l’écran
 Exemples de widgets: boutons, zones de saisie de texte, cases à cocher, etc.
 Le SDK Android comprend de nombreux widgets qui peuvent être configurés afin
d’obtenir l’apparence et le comportement souhaité
 Chaque widget est une instance de la classe View ou d’une de ses sous-classes
(TextView ou Button)

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Création d’interface
48

1. Widgets composant
l’interface souhaitée Paris est la capitale de la France.

Vrai Faux
2. Pour ce faire, modifier le
fichier XML –
interface_v1.txt

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Modification du fichier XML
49

<?xml version="1.0" encoding="utf-8"?>

<LinearLayout xmlns:android="[Link]
xmlns:app="[Link]
xmlns:tools="[Link]
android:layout_width="match_parent"
android:layout_height="match_parent"
Chaque widget a un élément XML
android:gravity="center" correspondant.
android:orientation="vertical"
tools:context="[Link]" Le nom de cet élément donne le type de
tools:showIn="@layout/activity_main">
<TextView
widget.
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="24dp"
android:text="@string/question_text" />
<LinearLayout Chaque élément a un ensemble d’attributs
android:layout_width="wrap_content"
android:layout_height="wrap_content" XML.
android:orientation="horizontal">
<Button
Chaque attribut représente une instruction
android:layout_width="wrap_content" concernant la configuration du widget.
android:layout_height="wrap_content"
android:text="@string/bouton_vrai"/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="@string/bouton_faux"/>
</LinearLayout>
Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android
</LinearLayout> Semestre Automne 2016
 Ajout des ressources string
nécessaires
50

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Aperçu
51

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – la hiérarchie de vues
52

 Les widgets existent dans une hiérarchie d’objets View, appelée hiérarchie de vues.
 Une hiérarchie de vues contient:
 Un élément racine
 Cet élément doit spécifier le nom de domaine des ressources Android
 xmlns:android="[Link]

 Cet élément hérite de la sous-classe de View appelée ViewGroup.

 Un ViewGroup est un widget qui contient et arrange d’autres widgets.
 Vous devez utiliser un LinearLayout à chaque fois que vous voulez avoir vos widgets affichés sous
une seule colonne ou ligne.
 D’autres sous-classes de ViewGroup sont: FrameLayout, TableLayout et RelativeLayout

 Des enfants de cet élément racine

 Enfants du ViewGroup

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Etude du fichier d’interface
53

LinearLayout
xmlns:android="[Link]
android:layout_width="match_parent"
Elément racine
android:layout_height="match_parent"
android:gravity="center"
android:orientation="vertical"

TextView LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content" Enfants de android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:padding="24dp"
android:text="@string/question_text"
l’élément racine android:orientation="horizontal"

Button Enfants du Button

android:layout_width="wrap_content“
android:layout_height="wrap_content“
deuxième android:layout_width="wrap_content“
android:layout_height="wrap_content“
android:text="@string/true_button" LinearLayout android:text="@string/false_button"

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – attributs des widgets
54

android:layout_width et
android:layout_height

android:orientation

android:text

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – attributs des widgets (1)
android:layout_width and
android:layout_height
55

 Les attributs android:layout_width et android:layout_height sont

requis pour presque tous les types de widgets
 Généralement définis sur match_parent ou wrap_parent
 match_parent la vue sera aussi grande que l’élément parent
 Vous pouvez aussi trouver « fill_parent » qui est une valeur dépréciée
 wrap_parent la vue sera aussi grande que nécessite son contenu

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Etude des attributs des widgets (1)
android:layout_width and
android:layout_height
56

LinearLayout
xmlns:android="[Link]
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
Dimensions définies sur « match_parent », or il s’agit de
android:orientation="vertical" l’élément racine. Il est tout de même contenu dans un élément
de type View (conteneur de la hiérarchie de classes, fourni
par défaut par Android).

LinearLayout Button
android:layout_width="wrap_content"
android:layout_width="wrap_content“ Dimensions définies sur
android:layout_height="wrap_content"
android:layout_height="wrap_content“ « wrap_content »
android:orientation="horizontal"
android:text="@string/bouton_vrai"

Plus large que le texte qu’il contient, à cause de l’attribut:

TextView android:padding="24dp"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
Cet attribut spécifie au widget d’ajouter l’espace défini à son
android:padding="24dp" contenu lors du calcul de ses dimensions.
android:text="@string/question_text"
Le padding permet d’aérer un peu l’interface.
Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016
 Théorie – attributs des widgets (2)
android:orientation
57

 L’attribut android:orientation spécifie si les enfants d’un widget sont

affichés à la verticale ou à l’horizontale

 L’ordre dans lequel les enfants sont spécifiés dans le fichier XML détermine leur
ordre d’affichage à l’écran:
 Dans un LinearLayout vertical, le premier enfant apparaîtra le plus en haut
 Dans un LinearLayout horizontal, le premier enfant apparaîtra le plus à gauche
 A moins d’avoir spécifié un langage affiché de droite à gauche (type Arabe ou Hébreu) pour le terminal

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Etude des attributs des widgets
(2)
android:orientation
58

LinearLayout
xmlns:android="[Link]
android:layout_width="match_parent"
android:layout_height="match_parent"
android:gravity="center"
Eléments enfants affichés à la verticale.
android:orientation="vertical"

LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="horizontal"
Eléments enfants affichés à l’horizontale.

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – attributs des widgets (3)
android:text
59

 L’attribut android:text spécifie le texte à afficher

 Cet attribut ne prend pas des valeurs littérales, mais des références vers des ressources
string (chaîne de caractères)
 Il est possible de lui spécifier une valeur directement, mais ce n’est pas la pratique
recommandée
 android:text=“Mon texte”

 Une ressource string est une variable de type chaîne de caractères, dont le nom
et la valeur sont définis dans un fichier XML à part:
 res\values\[Link]
 L’utilisation de ressources string facilite la traduction des applications

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Etude des attributs des widgets
(3)
android:text
60

Button
android:layout_width="wrap_content“
android:layout_height="wrap_content“
android:text="@string/bouton_vrai"
Deux attributs android:text pointant vers
les ressources string:
Button - bouton_vrai
android:layout_width="wrap_content“ - bouton_faux
android:layout_height="wrap_content“
android:text="@string/bouton_faux"

TextView Un attributs android:text pointant vers la

android:layout_width="wrap_content" ressources string:
android:layout_height="wrap_content"
android:padding="24dp" - question_text
android:text="@string/question_text"

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Fichier [Link]
61

 Ouvrez le fichier res/values/[Link]

 Cliquez sur le texte « Open editor » en haut à droite

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Translation Editor
62

 Modifiez la valeur de la variable question_text sur « Paris est la capitale de la

France. »

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Remarques
63

 Le fichier par défaut s’appelle [Link], mais vous pouvez nommer ce fichier
comme vous voulez
 Il est aussi possible d’avoir plusieurs fichiers de ressources string
 Les placer dans le dossier res/values/
 Spécifier un élément racine <resources>

 Visualisez la mise en page de l’application une fois

ces modifications appliquées

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

64

3.3 MODIFICATION DU CODE

Interaction avec les boutons
Affichage de toasts

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 De la mise en page XML aux objets
View
65

 Comment les éléments XML déclarés dans content_main.xml deviennent des

objets View ?
 Lors de la création du projet GeoQuiz, une première activité a été créée:
 MainActivity sous-classe de la classe Activity
 Le fichier *.java correspondant se trouve dans le dossier /src du projet
 Le dossier /src contient l’ensemble du code Java du projet

 Affichez le contenu du fichier [Link]

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 [Link]
66

 onCreate est la méthode appelée

lorsqu’une instance de sous-classe
d’Activity est créée.
 Lorsqu’une activité est créée, elle a
besoin d’une interface à gérer.
 Pour spécifier à l’activité l’interface
à utiliser, on appelle la méthode
public setContentView(int
layoutResID).
 Cette méthode développe une mise en
page (layout) et l’affiche à l’écran.
 Lorsqu’un layout est développé, chaque
widget présent dans le layout est
instancié comme spécifié par ses attributs.
 Vous spécifiez la mise en page à utiliser
en passant l’identifiant de la ressource
Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android layout. Semestre Automne 2016
 Lien entre les deux fichiers de layout
67

 Précédemment nous avons édité le fichier content_main.xml

 Il contenait un ligne qui le reliait à activity_main.xml

 Le fichier activity_main.xml est relié à activity_main.java

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – ressources et identifiants
de ressources
68

 Une mise en page (layout) est une ressource

 Une ressource est une partie d’application qui n’est pas du code (images, fichiers audio,
fichiers XML, etc.)
 Les ressources sont toujours placées dans le dossier /res/
 Les mises en page sont placées dans le dossier /res/layout/
 La mise en page actuelle se trouve dans /res/layout/activity_main.xml

 Les chaînes de caractères sont placées dans le dossier /res/values/

 Le fichier [Link] se trouve dans /res/values/[Link]

 Pour accéder à une ressource depuis le code Java, il faut utiliser son ID
 L’identifiant pour la mise en page actuelle est: [Link].activity_main.
 Modifier le nom de l’application: setTitle([Link].app_name);
 Pour voir l’ensemble des identifiants de ressources pour le projet GeoQuiz, affichez
le contenu du fichier /gen/[Link]

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Identifiants de ressources définis
dans GeoQuiz
69

Il s’agit d’un fichier automatiquement

généré par Android, à ne PAS modifier !!!

Android génère un identifiant de

ressource pour chaque mise en page et
chaque chaîne de caractères, mais pas
pour les widgets individuels présents
dans content_main.xml.

Il n’est pas obligatoire d’avoir un

identifiant pour chaque ressource. Nous
allons en définir un pour les 2 boutons
avec lesquels nous souhaitons interagir.

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Définir un identifiant pour un bouton
70

Nous créons un identifiant (d’où le “+”).

Nous référençons une chaîne de caractères.

android:id="@+id/bouton_vrai"
android:text="@string/bouton_vrai“

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Accéder aux boutons depuis le code
(1)
71

 Maintenant que les boutons ont des identifiants, il est possible d’y accéder à partir
du code Java – ouvrez à nouveau [Link]
 Avant toute chose, supprimez le code inutile (lignes illustrées ci-dessous)

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Accéder aux boutons depuis le code
(1)
72

 La première étape est d’ajouter les 2 variables correspondant aux boutons

Vérifiez l’import du package

[Link].

Sinon ajoutez la ligne manquante

dans les imports:
import
[Link]

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Accéder aux boutons depuis le code
(2)
73

 Il faut ensuite lier nos 2 variables aux références vers les 2 boutons
 Dans une activité, l’appel de la méthode suivante permet d’avoir une référence vers un
widget:
public View findViewById(int id)

 Objet
Ajoutez de type
les lignes View dans [Link]
suivantes Identifiant de ressource

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – Définir un écouteur
d’événements
74

 Les applications Android sont orientées événements – elles débutent, puis

attendent la production d’un événement (e.g. appui sur un bouton)
 Les événements peuvent être déclenchés par l’OS ou une autre application, mais les
événements déclenchés par l’utilisateur sont les plus courants.
 Lorsqu’une application attend un événement particulier, on dit qu’elle écoute cet
événement
 Pour répondre à un événement, il faut créer un objet appelé écouteur
 Un écouteur est un objet qui implémente une interface d’écouteur pour l’événement
considéré.

 Le SDK Android dispose de plusieurs interfaces d’écouteurs pour différents types

d’événements (vous n’avez pas à l’écrire)

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Définir un écouteur d’événements
75

 Nous souhaitons écouter un clic sur un bouton, donc notre écouteur va

implémenter l’interface [Link]
 Ajoutez les lignes de code suivantes:
On définit un écouteur pour nous
informer d’un clic sur le bouton appelé
monBoutonVrai.

La méthode
setOnClickListener(OnClickListener)
prend un écouteur en argument, plus
particulièrement un objet qui implémenter
l’interface OnClickListener.

Utilisez l’auto-complétion pour générer le

corps des méthodes surchargées
(@override).
Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016
 Utilisation de classes internes
anonymes
76

 L’écouteur est implémenté en tant que classe interne anonyme

 Tout ce qui est compris entre (…) est passé à
setOnClickListener(OnClickListener)
 Nous y créons une nouvelle classe, sans nom, et passons toute son implémentation

 L’ensemble des écouteurs de ce cours seront implémentés de la même manière

 Notre classe anonyme implémente OnClickListener, elle doit donc implémenter
la seule méthode de cette interface – onClick(View)
 C’est fait, mais nous n’y avons pas spécifié de code

Si vous n’êtes pas familiers avec les classes anonymes,

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android les écouteurs ou les interfaces, vous pourriez
Semestre Automneavoir
2016
besoin de revoir vos cours Java…
 Faire un toast 
77

 Lors du clic sur chaque bouton, nous souhaitons afficher un message à l’utilisateur –
ces messages sont appelés toasts
 Toast = message court qui informe l’utilisateur de quelque chose, mais ne nécessite aucune
action ou aucun retour de sa part.
 Nos toasts doivent afficher s’il s’agit d’une réponse correcte ou pas.

 Dans [Link] – ajouter les ressources string qui seront affichées par les toasts

 Dans [Link], nous allons devoir créer le toast:

public static Toast makeText(Context context, int resId, int duration)

Une instance d’activité Identifiant de la Combien de

(Activity est sous-classe de Context) ressource string temps le toast
à afficher doit rester visible
Le contexte est nécessaire afin de pouvoir trouver et utiliser l’identifiant de la ressource.
Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016
 Ajout des 2 variables string
78

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Création de la méthode makeText
avec Android Studio
79

Vous n’avez plus qu’à spécifier la chaîne de

caractères à afficher – R .string.toast_faux
(dans ce cas).

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Création des toasts
80

On affiche le toast

Une instance de Ressource Durée

l’activité en cours string créée courte
précédemment (constante)

Testez ensuite l’application sur un

émulateur (ex: Galaxy Nexus, Google API –
API Level 15, RAM à 512 Mo)

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Premier test
81

Lorsque l’on clique sur un des

deux boutons, le message
approprié est affiché.

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – processus de compilation
82

res/-
gen/- src/-
activity_quiz.xml [Link]
[Link] [Link]
[Link]
Contient des métadonnées
à propos de l’application.
Android Asset
Compilation Java
Packaging Tool (aapt)

Compilation .class
vers Dalvik

Ressources
.dex
compilées Installation et
exécution
Signature avec une « release key »
pour distribuer l’application. Sinon Construction et
Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android .apk Semestre Automne 2016
« debug key ». signature de l’appli
 Théorie – création de l’interface
83

Les ressources compilées par l’aapt

sont incluses dans le *.apk

Lors de l’appel à
la méthode
setContentView,
QuizActivity
utilise la classe
LayoutInflater
pour instantier
chacun des
objets View
définis dans le
fichier layout.

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Théorie – Android build tools
84

 Pour effectuer des compilations en dehors d’Android Studio (invite commande)

 Les outils les plus connus sont maven et ant (plus facile, moins de fonctionnalités)
 Avec ant:
 Pré-requis: Les dossiers tools/ et platform-tools/ du SDK Android sont inclus dans les paths
 Aller dans le dossier du projet puis exécuter les commandes suivantes:
 $ android update project -p .
 Genère le fichier [Link] nécessaire à ant
 $ ant debug
 Construit et signe le fichier *.apk
 $ adb install bin/[Link]
 Installation de l’apk sur le terminal connecté (pas d’exécution)

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016

 Aller plus loin…
85

 Nous souhaitons supprimer le bouton flottant en bas à droite

 Etudier le fichier activity_main.xml

 Identifier les lignes correspondant à ce bouton

 Supprimer ces lignes

 Tester à nouveau 

Ana ROXIN | Cours M2 MUTLIMEDIA | Programmation Android Semestre Automne 2016