SlideShare une entreprise Scribd logo
1  sur  32
Télécharger pour lire hors ligne
LES LISTVIEWS
Imene Sghaier
1
2017-2018
PLAN DU CHAPITRE
 Introduction
 Gestion des listes de données
 Les adapters
 Les ArrayAdapters (listes simples)
 Les SimpleAdapter (listes plus complexes)
 Méthodes communes à tous les adaptateurs
 Les vues responsables de l'affichage des listes :
les AdapterView
 Les listes standards : ListView
 Les ListViews: Gestion des événements
 Les GridViews
 Les Spinners 2
Imene Sghaier-Développement d’applications mobiles
INTRODUCTION
 Il pourrait vous arriver d'avoir à afficher une liste d'un
type d'objet particulier, des articles commerciaux par
exemple. Il existe plusieurs paramètres à prendre en
compte dans ce cas-là.
 Tout d'abord, quelle est l'information à afficher pour
chaque article? Le nom? Le prix? La quantité ? Et que
faire quand on clique sur un élément de la liste ? Et
l'esthétique dans tout ça, c'est-à-dire comment sont
représentés les articles? Affiche-t-on leur photos avec
leurs prix? Ce sont autant d'éléments à prendre en
compte quand on veut afficher une liste.
3
Imene Sghaier-Développement d’applications mobiles
GESTION DES LISTES DE DONNÉES
 La gestion des listes se divise en deux parties
distinctes.
 Les Adapter qui sont les objets qui gèrent les
données, mais pas leur affichage ou leur
comportement en cas d’interaction avec l'utilisateur.
On peut considérer un adaptateur comme une
intermédiaire entre les données et la vue qui
représente ces données.
 Les AdapterView, qui vont gérer l'affichage et
l'interaction avec l'utilisateur, mais sur lesquels on
ne peut pas effectuer d'opération de modification des
données.
4
Imene Sghaier-Développement d’applications mobiles
GESTION DES LISTES DE DONNÉES
 Le comportement typique pour afficher une liste
depuis un ensemble de données est celui-ci :
 On donne à l'adaptateur une liste d'éléments à traiter et la
manière dont ils doivent l'être,
 On passe cet adaptateur à un AdapterView.
 Dans l’AdapterView , l'adaptateur va créer un widget pour
chaque élément en fonction des informations fournies en
amont.
5
Imene Sghaier-Développement d’applications mobiles
LES ADAPTERS
 Adapter est une interface qui définit les
comportements généraux des adaptateurs.
 Si on veut bien un jour construire un adaptateur, on
le fait dériver de la classe BaseAdapter qui
implémente l’interface Adapter.
public class monAdapter extends BaseAdapter{
……….
}
6
Imene Sghaier-Développement d’applications mobiles
LES ADAPTERS
 L’adapter aide à convertir les éléments de données en
des views items de android
 Par exemple pour aligner des données verticalement
nous avons besoin d’une listView pour accopmlir ceci
 Exemple
 Ce tableau de chaines de caractères sera passé à un
ArrayAdapter.
 L’ArrayAdapter prends “pizza” comme premier élément et le
convertit en un view item.
 Le pizza view item est placé comme première ligne (row) dans
la ListView
7
Imene Sghaier-Développement d’applications mobiles
String[] eatables = new String[]{"Pizza", "Olives", "Burger", "Sauce", "Cheeze", "Onion"};
ArrayAdapter arrayAdapter = new ArrayAdapter(this, R.layout.single_item, eatables);
LES ADAPTERS
 Si on veut construire un widget simple, on retiendra
trois principaux adaptateurs :
 ArrayAdapter, qui permet d'afficher les informations simples
;
 SimpleAdapter est quant à lui utile dès qu'il s'agit d'écrire
plusieurs informations pour chaque élément (s'il y a deux
textes dans l'élément par exemple) ;
 CursorAdapter, pour adapter le contenu qui provient d'une
base de données. On y reviendra dès qu'on abordera l'accès à
une base de données (l’année prochaine enchallah ^_^)
8
Imene Sghaier-Développement d’applications mobiles
LES ARRAYADAPTERS (LISTES SIMPLES)
 La classe ArrayAdapter se trouve dans le
package android.widget.ArrayAdapter.
 On va considérer les constructeurs suivants :
public ArrayAdapter (Context contexte, int id, T[] objects)
ou
public ArrayAdapter (Context contexte, int id, List<T> objects)
 Id est une référence à un layout. C'est donc elle qui
déterminera la mise en page de l'élément. Vous pouvez
créer une ressource de layout, mais Android met à
disposition certains layouts, qui dépendent beaucoup de la
liste dans laquelle vont se trouver les widgets.
 objects est la liste ou le tableau des éléments à afficher.
9
Imene Sghaier-Développement d’applications mobiles
LES SIMPLEADAPTER (LISTES PLUS COMPLEXES)
 On peut utiliser la classe SimpleAdapter à partir
du package android.widget.SimpleAdapter.
 Le SimpleAdapter est utile pour afficher
simplement plusieurs informations par élément. En
réalité, pour chaque information de l'élément on
aura une vue dédiée qui affichera l'information
voulue. Ainsi, on peut avoir du texte, une image…
10
Imene Sghaier-Développement d’applications mobiles
EXEMPLE (1)
import java.util.ArrayList;
import java.util.HashMap;
import java.util.List;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ListAdapter;
import android.widget.ListView;
import android.widget.SimpleAdapter;
public class ListesActivity extends Activity {
ListView vue;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.activity_main);
//On récupère une ListView de notre layout en XML, c'est la vue //qui
représente la liste
vue = (ListView) findViewById(R.id.listView);
11
Imene Sghaier-Développement d’applications mobiles
/*
* On entrepose nos données dans un tableau qui contient deux colonnes :
* - la première contiendra le nom de l'utilisateur
* - la seconde contiendra le numéro de téléphone de l'utilisateur
*/
String[][] repertoire = new String[][]{
{"Imene Sghaier", " 22334455"},
{"Aida Chebaane", "51525354"},
{"Ahmed Azzouna", " 41424344"}};
/*
* On doit donner à notre adaptateur une liste du type « List<Map<String, ?> »
:
* - la clé doit forcément être une chaîne de caractères
* - en revanche, la valeur peut être n'importe quoi, un objet ou un entier par
exemple,
* si c'est un objet, on affichera son contenu avec la méthode « toString() » Dans
notre cas, la valeur sera une chaîne de caractères, puisque le nom et le numéro
de téléphone sont entreposés dans des chaînes de caractères
*/ 12
Imene Sghaier-Développement d’applications mobiles
EXEMPLE (2)
List<HashMap<String, String>> liste = new ArrayList<HashMap<String,
String>>();
HashMap<String, String> element;
//Pour chaque personne dans notre répertoire…
for(int i = 0 ; i < repertoire.length ; i++) {
//… on crée un élément pour la liste…
element = new HashMap<String, String>();
/*
* … on déclare que la clé est « text1 »
* pour le nom de la personne (première dimension du tableau de valeurs)…
*/
element.put("text1", repertoire[i][0]);
/*
* … on déclare que la clé est « text2 »
* pour le numéro de cette personne (seconde dimension du tableau de valeurs)
*/
element.put("text2", repertoire[i][1]);
liste.add(element); } 13
Imene Sghaier-Développement d’applications mobiles
EXEMPLE (3)
ListAdapter adapter = new SimpleAdapter(this, liste,
android.R.layout.simple_list_item_2, new String[] {"text1", "text2"}, new int[]
{android.R.id.text1, android.R.id.text2 });
/* Valeurs à insérer sont dans liste
* Pour le Layout de chaque élément (là, il s'agit d'un layout par défaut
* pour avoir deux textes l'un au-dessus de l'autre, c'est pourquoi on
* n'affiche que le nom et le numéro d'une personne)
* Les clés des informations à afficher pour chaque élément :
* - la valeur associée à la clé « text1 » sera la première information
* - la valeur associée à la clé « text2 » sera la seconde information
* Enfin, les layouts à appliquer à chaque widget de notre élément
* (ce sont des layouts fournis par défaut) :
* - la première information appliquera le layout « android.R.id.text1 »
* - la seconde information appliquera le layout « android.R.id.text2 »
*/
//Pour finir, on donne à la ListView le SimpleAdapter
vue.setAdapter(adapter); } } 14
Imene Sghaier-Développement d’applications mobiles
EXEMPLE (4)
 Dans l’exemple précédent nous avons utilisé le
constructeur
public SimpleAdapter(Context context, List<? , ?> data, int
Layout, String[] from, int[] to)
15
Imene Sghaier-Développement d’applications mobiles
EXEMPLE (5)
MÉTHODES COMMUNES À TOUS LES ADAPTATEURS
 Pour ajouter un objet à un adaptateur, on peut utiliser la
méthode void add (T object) ou l'insérer à une position particulière
avec void insert (T object, int position).
 Pour récupérer un objet dont on connaît la position on utilise la
méthode T getItem (int position), et pour récupérer la position
d'un objet précis on utilise la méthode int getPosition (T object).
 Pour supprimer un objet la méthode void remove (T object) est
utilisée
 Pour vider complètement l'adaptateur void clear().
 Par défaut, un ArrayAdapter affichera pour chaque objet de la liste
le résultat de la méthode String toString() associée et l'insérera dans
une TextView.
16
Imene Sghaier-Développement d’applications mobiles
EXEMPLE
// On crée un adaptateur qui fonctionne avec des chaînes
de caractères
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_list_item_1);
// On rajoute la chaîne de caractères "Pommes"
adapter.add("Pommes");
// On récupère la position de la chaîne dans l'adaptateur. Comme il n'y
a pas d'autres
// chaînes dans l'adaptateur, position vaudra 0
int position = adapter.getPosition("Pommes");
// On affiche la valeur et la position de la chaîne de caractères
Toast.makeText(this, "Les " + adapter.getItem(position) + " se trouvent
à la position " + position + ".", Toast.LENGTH_LONG).show();
// Puis on la supprime, n'en n'ayant plus besoin
adapter.remove("Pommes");
17
Imene Sghaier-Développement d’applications mobiles
LES VUES RESPONSABLES DE L'AFFICHAGE DES
LISTES : LES ADAPTERVIEW
 On trouve la classe AdapterView dans le
package android.widget.AdapterView.
 Alors que l'adapter se chargera de construire les sous-
éléments, c'est l'AdapterView qui liera ces sous-éléments et
qui fera en sorte de les afficher en une liste. De plus, c'est
l'AdapterView qui gérera les interactions avec les
utilisateurs : l‘Adapter s'occupe des éléments en tant que
données, alors que l'AdapterView s'occupe de les afficher et
veille aux interactions avec un utilisateur (sélection d’un
élément par exemple)
 On trouve trois principaux AdapterView :
 ListView, pour simplement afficher des éléments les uns après les
autres ;
 GridView, afin d'organiser les éléments sous la forme d'une grille ;
 Spinner, qui est une liste déroulante.
18
Imene Sghaier-Développement d’applications mobiles
LES VUES RESPONSABLES DE L'AFFICHAGE DES
LISTES : LES ADAPTERVIEW
 Pour associer un adapter à un AdapterView, on
utilise la méthode :
void setAdapter (Adapter adapter)
qui se chargera de peupler la vue.
19
Imene Sghaier-Développement d’applications mobiles
LES LISTES STANDARDS : LISTVIEW
 On les trouve dans le package android.widget.ListView.
 Elles affichent les éléments les uns après les autres.
 Layout de base android.R.layout.simple_list_item_1
20
Imene Sghaier-Développement d’applications mobiles
import java.util.ArrayList;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.ListView;
public class TutoListesActivity extends Activity {
ListView liste = null;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
liste = (ListView) findViewById(R.id.listView);
List<String> exemple = new ArrayList<String>();
exemple.add("Item 1");
exemple.add("Item 2");
exemple.add("Item 3");
ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,
android.R.layout.simple_list_item_1, exemple);
liste.setAdapter(adapter); } }
21
Imene Sghaier-Développement d’applications mobiles
Les listes standards : EXEMPLE
LES LISTVIEWS: GESTION DES ÉVÉNEMENTS
 Il est toujours possible de gérer plusieurs types de clic, comme
void setOnItemClickListener(AdapterView.OnItemClickListener listener)
pour un clic simple sur un élément de la liste.
 La fonction de callback associée est :
void onItemClick (AdapterView<?> adpter, View v, int pos, long id),
 adpter l'AdapterView qui contient la vue sur laquelle le clic a été
effectué,
 v est la vue en elle-même,
 pos qui est la position de la vue dans la liste
 id est l'identifiant de la vue.
 void setOnItemLongClickListener AdapterView.OnItemLongClickListener
listener) pour un clic prolongé sur un élément de la liste.
 La fonction de callback associée est boolean onItemLongClick
(AdapterView<?> adpter, View v, int pos, long id).
22
Imene Sghaier-Développement d’applications mobiles
listView.setOnItemClickListener(new
AdapterView.OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?>
adapterView,
View view, int position, long id) {
// Ce qu’on veut faire quand on clique sur un
élément //de la liste
}
});
23
Imene Sghaier-Développement d’applications mobiles
Gestion des événements: EXEMPLE
LES LISTVIEWS: GESTION DES ÉVÉNEMENTS
Sélection de plusieurs éléments
 Il peut arriver qu'on ait besoin de sélectionner un ou plusieurs
éléments.
 Dans ce cas, il faut indiquer à la liste quel mode de sélection elle
accepte.
 On peut le préciser en XML à l'aide de l’attribut
android:choiceMode qui peut prendre les valeurs :
 singleChoice (sélectionner un seul élément)
 multipleChoice (sélectionner plusieurs éléments).
 On peut le faire aussi en Java, il suffit d'utiliser la méthode void
setChoiceMode(int mode) en passant comme mode
 ListView.CHOICE_MODE_SINGLE (sélectionner un seul élément)
 ListView.CHOICE_MODE_MULTIPLE (sélectionner plusieurs éléments).
 Il nous faut choisir un layout adapté.
 Pour les sélections uniques, on peut
utiliser android.R.layout.simple_list_item_single_choice,
 Pour les sélections multiples, on peut
utiliser android.R.layout.simple_list_item_multiple_choice
24
Imene Sghaier-Développement d’applications mobiles
Liste de sélection unique
Liste de sélection multiple
25
Imene Sghaier-Développement d’applications mobiles
LES LISTVIEWS: GESTION DES ÉVÉNEMENTS
Sélection de plusieurs éléments
LES LISTVIEWS: GESTION DES ÉVÉNEMENTS
Récupération de l’élément sélectionné:
 Pour récupérer le rang de l'élément sélectionné :
 dans le cas d'une sélection unique, on utilise la méthode int
getCheckedItemPosition()
 dans le cas d'une sélection multiple on utilise
SparseBooleanArray getCheckedItemPositions()
 Un SparseBooleanArray est un tableau associatif dans
lequel on associe un entier à un booléen, c'est-à-dire que
c'est un équivalent à la structure Java
standard Hashmap<Integer, Boolean>
 Pour un SparseBooleanArray, il est possible de vérifier la
valeur associée à une clé entière avec la méthode boolean
get(int key).
 Exemple
boolean b= liste.getCheckedItemPositions().get(3);
si b vaut true, alors l'élément est bien sélectionné dans
la liste
26
Imene Sghaier-Développement d’applications mobiles
LES GRIDVIEWS
 On peut utiliser la classe GridView à partir du
package android.widget.GridView.
 Ce type de liste fonctionne presque comme le précédent ;
cependant, il met les éléments dans une grille dont il
détermine automatiquement le nombre d'éléments par
ligne, comme le montre la figure suivante.
 Il est possible d'imposer ce nombre d'éléments par ligne à
l'aide de android:numColumns en XML et void
setNumColumns (int column) en Java
27
Imene Sghaier-Développement d’applications mobiles
LES SPINNERS
 La classe Spinner se trouve dans le
package android.widget.Spinner.
 On utilisera deux vues. Une pour l'élément
sélectionné qui est affiché, et une pour la liste
d'éléments sélectionnables. La figure suivante
montre ce qui arrive si on ne définit pas de mise
en page pour la liste d'éléments.
28
Imene Sghaier-Développement d’applications mobiles
LES SPINNERS
 on peut personnaliser l'affichage avec la fonction
 void setDropDownViewResource (int id).
 D'ailleurs, il existe déjà un layout par défaut
pour cela:
 android.R.layout.simple_spinner_dropdown_item
29
Imene Sghaier-Développement d’applications mobiles
import java.util.ArrayList;
import android.app.Activity;
import android.os.Bundle;
import android.widget.ArrayAdapter;
import android.widget.Spinner;
public class TutoListesActivity extends Activity {
private Spinner liste = null;
@Override
public void onCreate(Bundle savedInstanceState) {
super.onCreate(savedInstanceState);
setContentView(R.layout.main);
liste = (Spinner) findViewById(R.id.spinner1);
List<String> exemple = new ArrayList<String>();
30
Imene Sghaier-Développement d’applications mobiles
LES SPINNERS: EXEMPLE (1)
exemple.add("Element 1");
……
exemple.add("Element 6");
ArrayAdapter<String> adapter = new
ArrayAdapter<String>(this,
android.R.layout.simple_spinner_item, exemple);
//Le layout par défaut est
android.R.layout.simple_spinner_dropdown_item
adapter.setDropDownViewResource(android.R.layout.
simple_spinner_dropdown_item);
liste.setAdapter(adapter);
}
}
31
Imene Sghaier-Développement d’applications mobiles
LES SPINNERS: EXEMPLE (2)
RÉFÉRENCES
 https://openclassrooms.com/courses/creez-des-
applications-pour-android/des-widgets-plus-
avances-et-des-boites-de-dialogue
32

Contenu connexe

Similaire à chapitre-7-listviews.pdf

chapitre-2-les-activites.pdf
chapitre-2-les-activites.pdfchapitre-2-les-activites.pdf
chapitre-2-les-activites.pdfferiel53
 
Les intents sous Android
Les intents sous Android Les intents sous Android
Les intents sous Android Houssem Lahiani
 
Android2 composant-layout-menu (1)
Android2 composant-layout-menu (1)Android2 composant-layout-menu (1)
Android2 composant-layout-menu (1)Chaikhani Ibtissam
 
Les interface graphiques sous android
Les interface graphiques sous androidLes interface graphiques sous android
Les interface graphiques sous androidHoussem Lahiani
 
Introduction à Android
Introduction à AndroidIntroduction à Android
Introduction à AndroidYoann Gotthilf
 
TP Fouille de données (Data Mining) et Apprentissage Machine
TP Fouille de données (Data Mining) et Apprentissage MachineTP Fouille de données (Data Mining) et Apprentissage Machine
TP Fouille de données (Data Mining) et Apprentissage MachineBoubaker KHMILI
 
Stratégie et veille : Extraire et trier des données en ligne
Stratégie et veille : Extraire et trier des données en ligneStratégie et veille : Extraire et trier des données en ligne
Stratégie et veille : Extraire et trier des données en ligneErwan Tanguy
 
React redux-tutoriel-1
React redux-tutoriel-1React redux-tutoriel-1
React redux-tutoriel-1Sem Koto
 
React redux-tutoriel-1
React redux-tutoriel-1React redux-tutoriel-1
React redux-tutoriel-1Sem Koto
 
Chapitre4 cours de java
Chapitre4 cours de javaChapitre4 cours de java
Chapitre4 cours de javainfo1994
 
interface graphique mobile.pdf
interface graphique mobile.pdfinterface graphique mobile.pdf
interface graphique mobile.pdfYasmineChihab1
 
Interace Utilisateur.pdf
Interace Utilisateur.pdfInterace Utilisateur.pdf
Interace Utilisateur.pdfRihabBENLAMINE
 
Chapitre8: Collections et Enumerations En Java
Chapitre8: Collections et Enumerations En JavaChapitre8: Collections et Enumerations En Java
Chapitre8: Collections et Enumerations En JavaAziz Darouichi
 
Chapitre 2 elements graphiques android
Chapitre 2   elements graphiques androidChapitre 2   elements graphiques android
Chapitre 2 elements graphiques androidAmir Souissi
 

Similaire à chapitre-7-listviews.pdf (20)

chapitre-2-les-activites.pdf
chapitre-2-les-activites.pdfchapitre-2-les-activites.pdf
chapitre-2-les-activites.pdf
 
Les Activités.pdf
Les Activités.pdfLes Activités.pdf
Les Activités.pdf
 
Les intents sous Android
Les intents sous Android Les intents sous Android
Les intents sous Android
 
Les Layouts XML
Les Layouts XMLLes Layouts XML
Les Layouts XML
 
Android2 composant-layout-menu (1)
Android2 composant-layout-menu (1)Android2 composant-layout-menu (1)
Android2 composant-layout-menu (1)
 
Les interface graphiques sous android
Les interface graphiques sous androidLes interface graphiques sous android
Les interface graphiques sous android
 
Introduction à Android
Introduction à AndroidIntroduction à Android
Introduction à Android
 
TP Fouille de données (Data Mining) et Apprentissage Machine
TP Fouille de données (Data Mining) et Apprentissage MachineTP Fouille de données (Data Mining) et Apprentissage Machine
TP Fouille de données (Data Mining) et Apprentissage Machine
 
Stratégie et veille : Extraire et trier des données en ligne
Stratégie et veille : Extraire et trier des données en ligneStratégie et veille : Extraire et trier des données en ligne
Stratégie et veille : Extraire et trier des données en ligne
 
React redux-tutoriel-1
React redux-tutoriel-1React redux-tutoriel-1
React redux-tutoriel-1
 
React redux-tutoriel-1
React redux-tutoriel-1React redux-tutoriel-1
React redux-tutoriel-1
 
Chapitre4 cours de java
Chapitre4 cours de javaChapitre4 cours de java
Chapitre4 cours de java
 
Presentation JPA
Presentation JPAPresentation JPA
Presentation JPA
 
interface graphique mobile.pdf
interface graphique mobile.pdfinterface graphique mobile.pdf
interface graphique mobile.pdf
 
Spring 3.0
Spring 3.0Spring 3.0
Spring 3.0
 
Interace Utilisateur.pdf
Interace Utilisateur.pdfInterace Utilisateur.pdf
Interace Utilisateur.pdf
 
Chapitre8: Collections et Enumerations En Java
Chapitre8: Collections et Enumerations En JavaChapitre8: Collections et Enumerations En Java
Chapitre8: Collections et Enumerations En Java
 
Chapitre 2 elements graphiques android
Chapitre 2   elements graphiques androidChapitre 2   elements graphiques android
Chapitre 2 elements graphiques android
 
Gestion des ui
Gestion des uiGestion des ui
Gestion des ui
 
My droid
My droidMy droid
My droid
 

Plus de olfaharrabi2

AI.Harshini,Norah,Bhavika-2 (1).pdf presentation
AI.Harshini,Norah,Bhavika-2 (1).pdf presentationAI.Harshini,Norah,Bhavika-2 (1).pdf presentation
AI.Harshini,Norah,Bhavika-2 (1).pdf presentationolfaharrabi2
 
Ethics de lintelligence artificielle dans le domaine de business
Ethics de lintelligence artificielle dans le domaine de businessEthics de lintelligence artificielle dans le domaine de business
Ethics de lintelligence artificielle dans le domaine de businessolfaharrabi2
 
artificial intelligence and applications
artificial intelligence and applicationsartificial intelligence and applications
artificial intelligence and applicationsolfaharrabi2
 
Chap 1 Initiation.pptx
Chap 1 Initiation.pptxChap 1 Initiation.pptx
Chap 1 Initiation.pptxolfaharrabi2
 
Manipulation des fichiers en C.pptx
Manipulation des fichiers en C.pptxManipulation des fichiers en C.pptx
Manipulation des fichiers en C.pptxolfaharrabi2
 
intro final html.docx
intro final html.docxintro final html.docx
intro final html.docxolfaharrabi2
 
Présentation1.pptx
Présentation1.pptxPrésentation1.pptx
Présentation1.pptxolfaharrabi2
 
Introduction to ORoperationresearch UTC.pdf
Introduction to ORoperationresearch UTC.pdfIntroduction to ORoperationresearch UTC.pdf
Introduction to ORoperationresearch UTC.pdfolfaharrabi2
 
Cours AA S2 Ch4+5.ppt
Cours AA S2 Ch4+5.pptCours AA S2 Ch4+5.ppt
Cours AA S2 Ch4+5.pptolfaharrabi2
 
chapitre 1 programmation linéaire.pdf
chapitre 1 programmation linéaire.pdfchapitre 1 programmation linéaire.pdf
chapitre 1 programmation linéaire.pdfolfaharrabi2
 
Planning-externes-MA-Informatique-session_2019.pdf
Planning-externes-MA-Informatique-session_2019.pdfPlanning-externes-MA-Informatique-session_2019.pdf
Planning-externes-MA-Informatique-session_2019.pdfolfaharrabi2
 
chapitre-1-introduction-plateforme-android (2).pdf
chapitre-1-introduction-plateforme-android (2).pdfchapitre-1-introduction-plateforme-android (2).pdf
chapitre-1-introduction-plateforme-android (2).pdfolfaharrabi2
 
cours-syst (1).pdf
cours-syst (1).pdfcours-syst (1).pdf
cours-syst (1).pdfolfaharrabi2
 

Plus de olfaharrabi2 (16)

AI.Harshini,Norah,Bhavika-2 (1).pdf presentation
AI.Harshini,Norah,Bhavika-2 (1).pdf presentationAI.Harshini,Norah,Bhavika-2 (1).pdf presentation
AI.Harshini,Norah,Bhavika-2 (1).pdf presentation
 
Ethics de lintelligence artificielle dans le domaine de business
Ethics de lintelligence artificielle dans le domaine de businessEthics de lintelligence artificielle dans le domaine de business
Ethics de lintelligence artificielle dans le domaine de business
 
artificial intelligence and applications
artificial intelligence and applicationsartificial intelligence and applications
artificial intelligence and applications
 
Chap 1 Initiation.pptx
Chap 1 Initiation.pptxChap 1 Initiation.pptx
Chap 1 Initiation.pptx
 
sa a dos.pdf
sa a dos.pdfsa a dos.pdf
sa a dos.pdf
 
Manipulation des fichiers en C.pptx
Manipulation des fichiers en C.pptxManipulation des fichiers en C.pptx
Manipulation des fichiers en C.pptx
 
intro final html.docx
intro final html.docxintro final html.docx
intro final html.docx
 
chapitre 1 PI.pdf
chapitre 1 PI.pdfchapitre 1 PI.pdf
chapitre 1 PI.pdf
 
Présentation1.pptx
Présentation1.pptxPrésentation1.pptx
Présentation1.pptx
 
Introduction to ORoperationresearch UTC.pdf
Introduction to ORoperationresearch UTC.pdfIntroduction to ORoperationresearch UTC.pdf
Introduction to ORoperationresearch UTC.pdf
 
Cours AA S2 Ch4+5.ppt
Cours AA S2 Ch4+5.pptCours AA S2 Ch4+5.ppt
Cours AA S2 Ch4+5.ppt
 
chapitre 1 programmation linéaire.pdf
chapitre 1 programmation linéaire.pdfchapitre 1 programmation linéaire.pdf
chapitre 1 programmation linéaire.pdf
 
Planning-externes-MA-Informatique-session_2019.pdf
Planning-externes-MA-Informatique-session_2019.pdfPlanning-externes-MA-Informatique-session_2019.pdf
Planning-externes-MA-Informatique-session_2019.pdf
 
chapitre-1-introduction-plateforme-android (2).pdf
chapitre-1-introduction-plateforme-android (2).pdfchapitre-1-introduction-plateforme-android (2).pdf
chapitre-1-introduction-plateforme-android (2).pdf
 
cours-syst (1).pdf
cours-syst (1).pdfcours-syst (1).pdf
cours-syst (1).pdf
 
17. Le DOS.pdf
17. Le DOS.pdf17. Le DOS.pdf
17. Le DOS.pdf
 

chapitre-7-listviews.pdf

  • 2. PLAN DU CHAPITRE  Introduction  Gestion des listes de données  Les adapters  Les ArrayAdapters (listes simples)  Les SimpleAdapter (listes plus complexes)  Méthodes communes à tous les adaptateurs  Les vues responsables de l'affichage des listes : les AdapterView  Les listes standards : ListView  Les ListViews: Gestion des événements  Les GridViews  Les Spinners 2 Imene Sghaier-Développement d’applications mobiles
  • 3. INTRODUCTION  Il pourrait vous arriver d'avoir à afficher une liste d'un type d'objet particulier, des articles commerciaux par exemple. Il existe plusieurs paramètres à prendre en compte dans ce cas-là.  Tout d'abord, quelle est l'information à afficher pour chaque article? Le nom? Le prix? La quantité ? Et que faire quand on clique sur un élément de la liste ? Et l'esthétique dans tout ça, c'est-à-dire comment sont représentés les articles? Affiche-t-on leur photos avec leurs prix? Ce sont autant d'éléments à prendre en compte quand on veut afficher une liste. 3 Imene Sghaier-Développement d’applications mobiles
  • 4. GESTION DES LISTES DE DONNÉES  La gestion des listes se divise en deux parties distinctes.  Les Adapter qui sont les objets qui gèrent les données, mais pas leur affichage ou leur comportement en cas d’interaction avec l'utilisateur. On peut considérer un adaptateur comme une intermédiaire entre les données et la vue qui représente ces données.  Les AdapterView, qui vont gérer l'affichage et l'interaction avec l'utilisateur, mais sur lesquels on ne peut pas effectuer d'opération de modification des données. 4 Imene Sghaier-Développement d’applications mobiles
  • 5. GESTION DES LISTES DE DONNÉES  Le comportement typique pour afficher une liste depuis un ensemble de données est celui-ci :  On donne à l'adaptateur une liste d'éléments à traiter et la manière dont ils doivent l'être,  On passe cet adaptateur à un AdapterView.  Dans l’AdapterView , l'adaptateur va créer un widget pour chaque élément en fonction des informations fournies en amont. 5 Imene Sghaier-Développement d’applications mobiles
  • 6. LES ADAPTERS  Adapter est une interface qui définit les comportements généraux des adaptateurs.  Si on veut bien un jour construire un adaptateur, on le fait dériver de la classe BaseAdapter qui implémente l’interface Adapter. public class monAdapter extends BaseAdapter{ ………. } 6 Imene Sghaier-Développement d’applications mobiles
  • 7. LES ADAPTERS  L’adapter aide à convertir les éléments de données en des views items de android  Par exemple pour aligner des données verticalement nous avons besoin d’une listView pour accopmlir ceci  Exemple  Ce tableau de chaines de caractères sera passé à un ArrayAdapter.  L’ArrayAdapter prends “pizza” comme premier élément et le convertit en un view item.  Le pizza view item est placé comme première ligne (row) dans la ListView 7 Imene Sghaier-Développement d’applications mobiles String[] eatables = new String[]{"Pizza", "Olives", "Burger", "Sauce", "Cheeze", "Onion"}; ArrayAdapter arrayAdapter = new ArrayAdapter(this, R.layout.single_item, eatables);
  • 8. LES ADAPTERS  Si on veut construire un widget simple, on retiendra trois principaux adaptateurs :  ArrayAdapter, qui permet d'afficher les informations simples ;  SimpleAdapter est quant à lui utile dès qu'il s'agit d'écrire plusieurs informations pour chaque élément (s'il y a deux textes dans l'élément par exemple) ;  CursorAdapter, pour adapter le contenu qui provient d'une base de données. On y reviendra dès qu'on abordera l'accès à une base de données (l’année prochaine enchallah ^_^) 8 Imene Sghaier-Développement d’applications mobiles
  • 9. LES ARRAYADAPTERS (LISTES SIMPLES)  La classe ArrayAdapter se trouve dans le package android.widget.ArrayAdapter.  On va considérer les constructeurs suivants : public ArrayAdapter (Context contexte, int id, T[] objects) ou public ArrayAdapter (Context contexte, int id, List<T> objects)  Id est une référence à un layout. C'est donc elle qui déterminera la mise en page de l'élément. Vous pouvez créer une ressource de layout, mais Android met à disposition certains layouts, qui dépendent beaucoup de la liste dans laquelle vont se trouver les widgets.  objects est la liste ou le tableau des éléments à afficher. 9 Imene Sghaier-Développement d’applications mobiles
  • 10. LES SIMPLEADAPTER (LISTES PLUS COMPLEXES)  On peut utiliser la classe SimpleAdapter à partir du package android.widget.SimpleAdapter.  Le SimpleAdapter est utile pour afficher simplement plusieurs informations par élément. En réalité, pour chaque information de l'élément on aura une vue dédiée qui affichera l'information voulue. Ainsi, on peut avoir du texte, une image… 10 Imene Sghaier-Développement d’applications mobiles
  • 11. EXEMPLE (1) import java.util.ArrayList; import java.util.HashMap; import java.util.List; import android.app.Activity; import android.os.Bundle; import android.widget.ListAdapter; import android.widget.ListView; import android.widget.SimpleAdapter; public class ListesActivity extends Activity { ListView vue; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); //On récupère une ListView de notre layout en XML, c'est la vue //qui représente la liste vue = (ListView) findViewById(R.id.listView); 11 Imene Sghaier-Développement d’applications mobiles
  • 12. /* * On entrepose nos données dans un tableau qui contient deux colonnes : * - la première contiendra le nom de l'utilisateur * - la seconde contiendra le numéro de téléphone de l'utilisateur */ String[][] repertoire = new String[][]{ {"Imene Sghaier", " 22334455"}, {"Aida Chebaane", "51525354"}, {"Ahmed Azzouna", " 41424344"}}; /* * On doit donner à notre adaptateur une liste du type « List<Map<String, ?> » : * - la clé doit forcément être une chaîne de caractères * - en revanche, la valeur peut être n'importe quoi, un objet ou un entier par exemple, * si c'est un objet, on affichera son contenu avec la méthode « toString() » Dans notre cas, la valeur sera une chaîne de caractères, puisque le nom et le numéro de téléphone sont entreposés dans des chaînes de caractères */ 12 Imene Sghaier-Développement d’applications mobiles EXEMPLE (2)
  • 13. List<HashMap<String, String>> liste = new ArrayList<HashMap<String, String>>(); HashMap<String, String> element; //Pour chaque personne dans notre répertoire… for(int i = 0 ; i < repertoire.length ; i++) { //… on crée un élément pour la liste… element = new HashMap<String, String>(); /* * … on déclare que la clé est « text1 » * pour le nom de la personne (première dimension du tableau de valeurs)… */ element.put("text1", repertoire[i][0]); /* * … on déclare que la clé est « text2 » * pour le numéro de cette personne (seconde dimension du tableau de valeurs) */ element.put("text2", repertoire[i][1]); liste.add(element); } 13 Imene Sghaier-Développement d’applications mobiles EXEMPLE (3)
  • 14. ListAdapter adapter = new SimpleAdapter(this, liste, android.R.layout.simple_list_item_2, new String[] {"text1", "text2"}, new int[] {android.R.id.text1, android.R.id.text2 }); /* Valeurs à insérer sont dans liste * Pour le Layout de chaque élément (là, il s'agit d'un layout par défaut * pour avoir deux textes l'un au-dessus de l'autre, c'est pourquoi on * n'affiche que le nom et le numéro d'une personne) * Les clés des informations à afficher pour chaque élément : * - la valeur associée à la clé « text1 » sera la première information * - la valeur associée à la clé « text2 » sera la seconde information * Enfin, les layouts à appliquer à chaque widget de notre élément * (ce sont des layouts fournis par défaut) : * - la première information appliquera le layout « android.R.id.text1 » * - la seconde information appliquera le layout « android.R.id.text2 » */ //Pour finir, on donne à la ListView le SimpleAdapter vue.setAdapter(adapter); } } 14 Imene Sghaier-Développement d’applications mobiles EXEMPLE (4)
  • 15.  Dans l’exemple précédent nous avons utilisé le constructeur public SimpleAdapter(Context context, List<? , ?> data, int Layout, String[] from, int[] to) 15 Imene Sghaier-Développement d’applications mobiles EXEMPLE (5)
  • 16. MÉTHODES COMMUNES À TOUS LES ADAPTATEURS  Pour ajouter un objet à un adaptateur, on peut utiliser la méthode void add (T object) ou l'insérer à une position particulière avec void insert (T object, int position).  Pour récupérer un objet dont on connaît la position on utilise la méthode T getItem (int position), et pour récupérer la position d'un objet précis on utilise la méthode int getPosition (T object).  Pour supprimer un objet la méthode void remove (T object) est utilisée  Pour vider complètement l'adaptateur void clear().  Par défaut, un ArrayAdapter affichera pour chaque objet de la liste le résultat de la méthode String toString() associée et l'insérera dans une TextView. 16 Imene Sghaier-Développement d’applications mobiles
  • 17. EXEMPLE // On crée un adaptateur qui fonctionne avec des chaînes de caractères ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1); // On rajoute la chaîne de caractères "Pommes" adapter.add("Pommes"); // On récupère la position de la chaîne dans l'adaptateur. Comme il n'y a pas d'autres // chaînes dans l'adaptateur, position vaudra 0 int position = adapter.getPosition("Pommes"); // On affiche la valeur et la position de la chaîne de caractères Toast.makeText(this, "Les " + adapter.getItem(position) + " se trouvent à la position " + position + ".", Toast.LENGTH_LONG).show(); // Puis on la supprime, n'en n'ayant plus besoin adapter.remove("Pommes"); 17 Imene Sghaier-Développement d’applications mobiles
  • 18. LES VUES RESPONSABLES DE L'AFFICHAGE DES LISTES : LES ADAPTERVIEW  On trouve la classe AdapterView dans le package android.widget.AdapterView.  Alors que l'adapter se chargera de construire les sous- éléments, c'est l'AdapterView qui liera ces sous-éléments et qui fera en sorte de les afficher en une liste. De plus, c'est l'AdapterView qui gérera les interactions avec les utilisateurs : l‘Adapter s'occupe des éléments en tant que données, alors que l'AdapterView s'occupe de les afficher et veille aux interactions avec un utilisateur (sélection d’un élément par exemple)  On trouve trois principaux AdapterView :  ListView, pour simplement afficher des éléments les uns après les autres ;  GridView, afin d'organiser les éléments sous la forme d'une grille ;  Spinner, qui est une liste déroulante. 18 Imene Sghaier-Développement d’applications mobiles
  • 19. LES VUES RESPONSABLES DE L'AFFICHAGE DES LISTES : LES ADAPTERVIEW  Pour associer un adapter à un AdapterView, on utilise la méthode : void setAdapter (Adapter adapter) qui se chargera de peupler la vue. 19 Imene Sghaier-Développement d’applications mobiles
  • 20. LES LISTES STANDARDS : LISTVIEW  On les trouve dans le package android.widget.ListView.  Elles affichent les éléments les uns après les autres.  Layout de base android.R.layout.simple_list_item_1 20 Imene Sghaier-Développement d’applications mobiles
  • 21. import java.util.ArrayList; import android.app.Activity; import android.os.Bundle; import android.widget.ArrayAdapter; import android.widget.ListView; public class TutoListesActivity extends Activity { ListView liste = null; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); liste = (ListView) findViewById(R.id.listView); List<String> exemple = new ArrayList<String>(); exemple.add("Item 1"); exemple.add("Item 2"); exemple.add("Item 3"); ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, exemple); liste.setAdapter(adapter); } } 21 Imene Sghaier-Développement d’applications mobiles Les listes standards : EXEMPLE
  • 22. LES LISTVIEWS: GESTION DES ÉVÉNEMENTS  Il est toujours possible de gérer plusieurs types de clic, comme void setOnItemClickListener(AdapterView.OnItemClickListener listener) pour un clic simple sur un élément de la liste.  La fonction de callback associée est : void onItemClick (AdapterView<?> adpter, View v, int pos, long id),  adpter l'AdapterView qui contient la vue sur laquelle le clic a été effectué,  v est la vue en elle-même,  pos qui est la position de la vue dans la liste  id est l'identifiant de la vue.  void setOnItemLongClickListener AdapterView.OnItemLongClickListener listener) pour un clic prolongé sur un élément de la liste.  La fonction de callback associée est boolean onItemLongClick (AdapterView<?> adpter, View v, int pos, long id). 22 Imene Sghaier-Développement d’applications mobiles
  • 23. listView.setOnItemClickListener(new AdapterView.OnItemClickListener() { @Override public void onItemClick(AdapterView<?> adapterView, View view, int position, long id) { // Ce qu’on veut faire quand on clique sur un élément //de la liste } }); 23 Imene Sghaier-Développement d’applications mobiles Gestion des événements: EXEMPLE
  • 24. LES LISTVIEWS: GESTION DES ÉVÉNEMENTS Sélection de plusieurs éléments  Il peut arriver qu'on ait besoin de sélectionner un ou plusieurs éléments.  Dans ce cas, il faut indiquer à la liste quel mode de sélection elle accepte.  On peut le préciser en XML à l'aide de l’attribut android:choiceMode qui peut prendre les valeurs :  singleChoice (sélectionner un seul élément)  multipleChoice (sélectionner plusieurs éléments).  On peut le faire aussi en Java, il suffit d'utiliser la méthode void setChoiceMode(int mode) en passant comme mode  ListView.CHOICE_MODE_SINGLE (sélectionner un seul élément)  ListView.CHOICE_MODE_MULTIPLE (sélectionner plusieurs éléments).  Il nous faut choisir un layout adapté.  Pour les sélections uniques, on peut utiliser android.R.layout.simple_list_item_single_choice,  Pour les sélections multiples, on peut utiliser android.R.layout.simple_list_item_multiple_choice 24 Imene Sghaier-Développement d’applications mobiles
  • 25. Liste de sélection unique Liste de sélection multiple 25 Imene Sghaier-Développement d’applications mobiles LES LISTVIEWS: GESTION DES ÉVÉNEMENTS Sélection de plusieurs éléments
  • 26. LES LISTVIEWS: GESTION DES ÉVÉNEMENTS Récupération de l’élément sélectionné:  Pour récupérer le rang de l'élément sélectionné :  dans le cas d'une sélection unique, on utilise la méthode int getCheckedItemPosition()  dans le cas d'une sélection multiple on utilise SparseBooleanArray getCheckedItemPositions()  Un SparseBooleanArray est un tableau associatif dans lequel on associe un entier à un booléen, c'est-à-dire que c'est un équivalent à la structure Java standard Hashmap<Integer, Boolean>  Pour un SparseBooleanArray, il est possible de vérifier la valeur associée à une clé entière avec la méthode boolean get(int key).  Exemple boolean b= liste.getCheckedItemPositions().get(3); si b vaut true, alors l'élément est bien sélectionné dans la liste 26 Imene Sghaier-Développement d’applications mobiles
  • 27. LES GRIDVIEWS  On peut utiliser la classe GridView à partir du package android.widget.GridView.  Ce type de liste fonctionne presque comme le précédent ; cependant, il met les éléments dans une grille dont il détermine automatiquement le nombre d'éléments par ligne, comme le montre la figure suivante.  Il est possible d'imposer ce nombre d'éléments par ligne à l'aide de android:numColumns en XML et void setNumColumns (int column) en Java 27 Imene Sghaier-Développement d’applications mobiles
  • 28. LES SPINNERS  La classe Spinner se trouve dans le package android.widget.Spinner.  On utilisera deux vues. Une pour l'élément sélectionné qui est affiché, et une pour la liste d'éléments sélectionnables. La figure suivante montre ce qui arrive si on ne définit pas de mise en page pour la liste d'éléments. 28 Imene Sghaier-Développement d’applications mobiles
  • 29. LES SPINNERS  on peut personnaliser l'affichage avec la fonction  void setDropDownViewResource (int id).  D'ailleurs, il existe déjà un layout par défaut pour cela:  android.R.layout.simple_spinner_dropdown_item 29 Imene Sghaier-Développement d’applications mobiles
  • 30. import java.util.ArrayList; import android.app.Activity; import android.os.Bundle; import android.widget.ArrayAdapter; import android.widget.Spinner; public class TutoListesActivity extends Activity { private Spinner liste = null; @Override public void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.main); liste = (Spinner) findViewById(R.id.spinner1); List<String> exemple = new ArrayList<String>(); 30 Imene Sghaier-Développement d’applications mobiles LES SPINNERS: EXEMPLE (1)
  • 31. exemple.add("Element 1"); …… exemple.add("Element 6"); ArrayAdapter<String> adapter = new ArrayAdapter<String>(this, android.R.layout.simple_spinner_item, exemple); //Le layout par défaut est android.R.layout.simple_spinner_dropdown_item adapter.setDropDownViewResource(android.R.layout. simple_spinner_dropdown_item); liste.setAdapter(adapter); } } 31 Imene Sghaier-Développement d’applications mobiles LES SPINNERS: EXEMPLE (2)