ListActivity<\/code>, associ\u00e9e \u00e0 un layout contenant un container de type ListView<\/code>. Dans la m\u00e9thode onCreate<\/code> de l’activit\u00e9 on va associer notre liste \u00e0 ce ListView<\/code> par l’interm\u00e9diaire d’un adapteur, en indiquant \u00e0 l’adapteur la r\u00e9f\u00e9rence du fichier de layout des ligne. Une classe adapteur permet d’adapter une classe contenant des donn\u00e9es \u00e0 ce qui est attendu dans une autre classe qui doit utiliser ces donn\u00e9es.<\/p>\nListe simple, avec l’adapteur par d\u00e9faut<\/h2>\n
Si on dispose de la liste des donn\u00e9es affich\u00e9es sous la forme d’un tableau de type ArrayList<T><\/code> on va simplement utiliser l’adapteur ArrayAdapter<T><\/code>, auquel on donnera le layout de ligne par d\u00e9faut simple, identifi\u00e9 par android.R.layout.simple_list_item_1<\/code>.<\/p>\n\nListView listView=getListView();\nArrayAdapter<String> adapter=new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, maListe);\nlistView.setAdapter(adapter);\n<\/pre>\nIci (on est dans la m\u00e9thode onCreate<\/code> de l’activit\u00e9) :<\/p>\n\n- la m\u00e9thode
getListView()<\/code> r\u00e9cup\u00e8re une r\u00e9f\u00e9rence sur le container ListView<\/code> qu’on aura pris soin de placer dans le fichier de layout de l’activit\u00e9. <\/li>\n- dans la seconde ligne on cr\u00e9e l’adapteur avec la liste et la r\u00e9f\u00e9rence au fichier de layout de la ligne. On utilise un layout de ligne par d\u00e9faut.<\/li>\n<\/ul>\n
TP<\/h3>\n
Cr\u00e9er une activit\u00e9 avec une liste en dur, de type ArrayList<String><\/code>, contenant quelques lignes. Afficher cette liste dans l’activit\u00e9.<\/p>\nTP (solution)<\/h3>\n
Voici d’abord le fichier de layout.<\/p>\n
<?xml version="1.0" encoding="utf-8"?>\n<LinearLayout xmlns:android="http:\/\/schemas.android.com\/apk\/res\/android"\n xmlns:tools="http:\/\/schemas.android.com\/tools"\n android:layout_width="match_parent"\n android:layout_height="match_parent"\n android:orientation="vertical"\n tools:context="net.chezdom.tps.prgnom2017listview.MainActivity">\n\n <ListView\n android:id="@android:id\/list"\n android:layout_width="match_parent"\n android:layout_height="match_parent" \/>\n<\/LinearLayout>\n<\/pre>\net le code java l’activit\u00e9.<\/p>\n
public class MainActivity extends ListActivity {\n\n @Override\n protected void onCreate(Bundle savedInstanceState) {\n super.onCreate(savedInstanceState);\n setContentView(R.layout.activity_main);\n\n ArrayList<String> maListe=new ArrayList<String>();\n maListe.add("AAAAA");\n maListe.add("BBBBB");\n maListe.add("CCCCC");\n maListe.add("DDDDD");\n maListe.add("EEEEE");\n\n ListView listView=this.getListView();\n ArrayAdapter<String> adapter=new ArrayAdapter<String>(this, android.R.layout.simple_list_item_1, maListe);\n listView.setAdapter(adapter);\n\n\n }\n}\n<\/pre>\nListe composite, avec son adapteur<\/h2>\n
Cette fois-ci on souhaite afficher une liste dans laquelle on pourra afficher plusieurs informations, avec une mise en page particuli\u00e8re.<\/p>\n
On va alors cr\u00e9er un fichier de layout correspondant \u00e0 notre besoin.
\n![\"Layout](\"http:\/\/chezdom.net\/etu\/wp-content\/uploads\/sites\/3\/2018\/01\/row-layout.xml_.png\")
<\/p>\n
Sur cette copie d’\u00e9cran on voit une ligne qui sera compos\u00e9e d’un champs de texte affich\u00e9 en gros avec en dessous 2 champs de textes plus petit, l’un \u00e0 gauche de l’\u00e9cran, l’autre, en Italique, \u00e0 droite.<\/p>\n
Ensuite un va cr\u00e9er un adapteur dans lequel on d\u00e9finira ce qui doit \u00eatre affich\u00e9 dans chacun des des champs, via la m\u00e9thode getView(int position, @Nullable View convertView, @NonNull ViewGroup parent)<\/code>. position<\/code> correspond \u00e0 l’\u00e9l\u00e9ment de la liste. la fonction get View va cr\u00e9er une ligne de la liste en pla\u00e7ant les valeurs de cet \u00e9l\u00e9ment (position<\/code>) de la liste dans le layout de liste. le syst\u00e8me appellera donc getView<\/code> pour chacune des lignes.<\/p>\nTP<\/h3>\n
Reprendre la premi\u00e8re partie, remplacer la liste de cha\u00eenes de caract\u00e8res par une liste plus compliqu\u00e9e, ou chaque \u00e9l\u00e9ment contient plusieurs valeurs (au moins 3). On pourra par exemple cr\u00e9er une classe pour stocker ces objets. Cr\u00e9er ensuite l’adapteur permettant de d’afficher la liste sous la forme indiqu\u00e9e sur la copie d’\u00e9cran montr\u00e9e plus haut.<\/p>\n
Voir une copie d’\u00e9cran du r\u00e9sultat attendu<\/a><\/p>\nTP (solution)<\/h3>\n
On va cr\u00e9er une classe objet comprenant 3 cha\u00eenes de caract\u00e8res.<\/p>\n
public class MyObject {\n private String str1, str2, str3;\n private String Str2;\n private String Str3;\n\n public MyObject(String str1, String str2, String str3) {\n this.str1 = str1;\n this.str2 = str2;\n this.str3 = str3;\n }\n<\/pre>\nOn la compl\u00e8tera avec une m\u00e9thode toString<\/code>et des methodes de type getters pour r\u00e9cup\u00e9rer chacune des 3 cha\u00eenes de caract\u00e8res :<\/p>\npublic class MyObject {\n public String getStr1() {\n return this.str1;\n }\n<\/pre>\nVoici le code du layout de ligne my_list_row.xml<\/code> :<\/p>\n<?xml version="1.0" encoding="utf-8"?>\n<LinearLayout xmlns:android="http:\/\/schemas.android.com\/apk\/res\/android"\n android:layout_width="match_parent"\n android:layout_height="wrap_content"\n android:orientation="vertical">\n\n <TextView\n android:id="@+id\/textView1"\n android:layout_width="match_parent"\n android:layout_height="wrap_content"\n android:text="TextView"\n android:textSize="30sp"\n android:textStyle="bold" \/>\n\n <LinearLayout\n android:layout_width="match_parent"\n android:layout_height="wrap_content"\n android:orientation="horizontal">\n\n <TextView\n android:id="@+id\/textView2"\n android:layout_width="wrap_content"\n android:layout_height="wrap_content"\n android:layout_weight="1"\n android:text="TextView" \/>\n\n <TextView\n android:id="@+id\/textView3"\n android:layout_width="wrap_content"\n android:layout_height="wrap_content"\n android:layout_weight="1"\n android:text="TextView"\n android:textAlignment="textEnd"\n android:textStyle="italic" \/>\n <\/LinearLayout>\n<\/LinearLayout>\n<\/pre>\nOn cr\u00e9e ensuite l’adapteur :<\/p>\n
public class MyAdapter extends ArrayAdapter<MyObject> {\n\n public MyAdapter(@NonNull Context context, @NonNull List<MyObject> objects) {\n super(context, R.layout.my_list_row, objects);\n }\n\n @NonNull\n @Override\n public View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) {\n\n LayoutInflater inflater=(LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);\n\n View myRowView = inflater.inflate(R.layout.my_list_row, parent, false);\n\n TextView tv1=myRowView.findViewById(R.id.textView1);\n TextView tv2=myRowView.findViewById(R.id.textView2);\n TextView tv3=myRowView.findViewById(R.id.textView3);\n\n tv1.setText(this.getItem(position).getStr1());\n tv2.setText(this.getItem(position).getStr2());\n tv3.setText(this.getItem(position).getStr3());\n\n return myRowView;\n }\n}\n<\/pre>\nIci l’inflater<\/code>va cr\u00e9er la vue correspondant \u00e0 une ligne particuli\u00e8re, on va ensuite r\u00e9cup\u00e9rer les r\u00e9f\u00e9rences aux diff\u00e9rents textView<\/code> et leur assigner les valeurs en provenance de la classe myObject<\/code>.<\/p>\nEnfin il reste \u00e0 appeler cet adapteur dans le onCreate<\/code> de l’activit\u00e9 principale (ListActivity<\/code>) :<\/p>\n\nListView listView=this.getListView();\nMyAdapter adapter=new MyAdapter(this, maListe);\nlistView.setAdapter(adapter);\n<\/pre>\nDonn\u00e9es r\u00e9cup\u00e9r\u00e9es dans la base de donn\u00e9es<\/h2>\n
Dans ce cas, les donn\u00e9es sont r\u00e9cup\u00e9r\u00e9es dans la base gr\u00e2ce \u00e0 une requ\u00eate SQL (voir les \u00e9l\u00e9ments de cours Enregistrer des donn\u00e9es<\/a>)<\/p>\nOn commence par cr\u00e9er un fichier de layout pour la ligne.<\/p>\n
Comme on l’a vu dans ce cours, la m\u00e9thode query<\/code> renvoie un objet de type Cursor<\/code>. Il reste \u00e0 faire un adapteur pour adapter un cursor \u00e0 notre layout de ligne.<\/p>\nTP<\/h3>\n
Reprendre le TP2<\/a> (enregistrement de donn\u00e9es), ajouter une activit\u00e9 pour afficher la liste des donn\u00e9es enregistr\u00e9es (voir le cours sur les Intents<\/a>. Cr\u00e9er maintenant un adapteur pour afficher les r\u00e9sultats de notre requ\u00eate dans la liste.<\/p>\n","protected":false},"excerpt":{"rendered":"Principe On souhaite cr\u00e9er une activit\u00e9 de type \u00ab\u00a0liste\u00a0\u00bb, afin d’afficher le contenu d’une liste. Le cas typique est d’afficher des r\u00e9sultats retourn\u00e9s par une requ\u00eate sur la base de donn\u00e9es. On peut aussi utiliser une liste pour cr\u00e9er un…<\/span> Lire la suite ›<\/a><\/span><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"jetpack_post_was_ever_published":false,"footnotes":""},"class_list":["post-800","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/P9qu1A-cU","_links":{"self":[{"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/pages\/800","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/comments?post=800"}],"version-history":[{"count":15,"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/pages\/800\/revisions"}],"predecessor-version":[{"id":820,"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/pages\/800\/revisions\/820"}],"wp:attachment":[{"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/media?parent=800"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}
![Voir une copie d’\u00e9cran du r\u00e9sultat attendu<\/a><\/p>\nTP (solution)<\/h3>\nOn va cr\u00e9er une classe objet comprenant 3 cha\u00eenes de caract\u00e8res.<\/p>\npublic class MyObject {\n private String str1, str2, str3;\n private String Str2;\n private String Str3;\n\n public MyObject(String str1, String str2, String str3) {\n this.str1 = str1;\n this.str2 = str2;\n this.str3 = str3;\n }\n<\/pre>\nOn la compl\u00e8tera avec une m\u00e9thode toString<\/code>et des methodes de type getters pour r\u00e9cup\u00e9rer chacune des 3 cha\u00eenes de caract\u00e8res :<\/p>\npublic class MyObject {\n public String getStr1() {\n return this.str1;\n }\n<\/pre>\nVoici le code du layout de ligne my_list_row.xml<\/code> :<\/p>\n<?xml version="1.0" encoding="utf-8"?>\n<LinearLayout xmlns:android="http:\/\/schemas.android.com\/apk\/res\/android"\n android:layout_width="match_parent"\n android:layout_height="wrap_content"\n android:orientation="vertical">\n\n <TextView\n android:id="@+id\/textView1"\n android:layout_width="match_parent"\n android:layout_height="wrap_content"\n android:text="TextView"\n android:textSize="30sp"\n android:textStyle="bold" \/>\n\n <LinearLayout\n android:layout_width="match_parent"\n android:layout_height="wrap_content"\n android:orientation="horizontal">\n\n <TextView\n android:id="@+id\/textView2"\n android:layout_width="wrap_content"\n android:layout_height="wrap_content"\n android:layout_weight="1"\n android:text="TextView" \/>\n\n <TextView\n android:id="@+id\/textView3"\n android:layout_width="wrap_content"\n android:layout_height="wrap_content"\n android:layout_weight="1"\n android:text="TextView"\n android:textAlignment="textEnd"\n android:textStyle="italic" \/>\n <\/LinearLayout>\n<\/LinearLayout>\n<\/pre>\nOn cr\u00e9e ensuite l’adapteur :<\/p>\npublic class MyAdapter extends ArrayAdapter<MyObject> {\n\n public MyAdapter(@NonNull Context context, @NonNull List<MyObject> objects) {\n super(context, R.layout.my_list_row, objects);\n }\n\n @NonNull\n @Override\n public View getView(int position, @Nullable View convertView, @NonNull ViewGroup parent) {\n\n LayoutInflater inflater=(LayoutInflater) getContext().getSystemService(Context.LAYOUT_INFLATER_SERVICE);\n\n View myRowView = inflater.inflate(R.layout.my_list_row, parent, false);\n\n TextView tv1=myRowView.findViewById(R.id.textView1);\n TextView tv2=myRowView.findViewById(R.id.textView2);\n TextView tv3=myRowView.findViewById(R.id.textView3);\n\n tv1.setText(this.getItem(position).getStr1());\n tv2.setText(this.getItem(position).getStr2());\n tv3.setText(this.getItem(position).getStr3());\n\n return myRowView;\n }\n}\n<\/pre>\nIci l’inflater<\/code>va cr\u00e9er la vue correspondant \u00e0 une ligne particuli\u00e8re, on va ensuite r\u00e9cup\u00e9rer les r\u00e9f\u00e9rences aux diff\u00e9rents textView<\/code> et leur assigner les valeurs en provenance de la classe myObject<\/code>.<\/p>\nEnfin il reste \u00e0 appeler cet adapteur dans le onCreate<\/code> de l’activit\u00e9 principale (ListActivity<\/code>) :<\/p>\n\nListView listView=this.getListView();\nMyAdapter adapter=new MyAdapter(this, maListe);\nlistView.setAdapter(adapter);\n<\/pre>\nDonn\u00e9es r\u00e9cup\u00e9r\u00e9es dans la base de donn\u00e9es<\/h2>\nDans ce cas, les donn\u00e9es sont r\u00e9cup\u00e9r\u00e9es dans la base gr\u00e2ce \u00e0 une requ\u00eate SQL (voir les \u00e9l\u00e9ments de cours Enregistrer des donn\u00e9es<\/a>)<\/p>\nOn commence par cr\u00e9er un fichier de layout pour la ligne.<\/p>\nComme on l’a vu dans ce cours, la m\u00e9thode query<\/code> renvoie un objet de type Cursor<\/code>. Il reste \u00e0 faire un adapteur pour adapter un cursor \u00e0 notre layout de ligne.<\/p>\nTP<\/h3>\nReprendre le TP2<\/a> (enregistrement de donn\u00e9es), ajouter une activit\u00e9 pour afficher la liste des donn\u00e9es enregistr\u00e9es (voir le cours sur les Intents<\/a>. Cr\u00e9er maintenant un adapteur pour afficher les r\u00e9sultats de notre requ\u00eate dans la liste.<\/p>\n","protected":false},"excerpt":{"rendered":"Principe On souhaite cr\u00e9er une activit\u00e9 de type \u00ab\u00a0liste\u00a0\u00bb, afin d’afficher le contenu d’une liste. Le cas typique est d’afficher des r\u00e9sultats retourn\u00e9s par une requ\u00eate sur la base de donn\u00e9es. On peut aussi utiliser une liste pour cr\u00e9er un…<\/span> Lire la suite ›<\/a><\/span><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"jetpack_post_was_ever_published":false,"footnotes":""},"class_list":["post-800","page","type-page","status-publish","hentry"],"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/P9qu1A-cU","_links":{"self":[{"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/pages\/800","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/comments?post=800"}],"version-history":[{"count":15,"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/pages\/800\/revisions"}],"predecessor-version":[{"id":820,"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/pages\/800\/revisions\/820"}],"wp:attachment":[{"href":"https:\/\/chezdom.net\/etu\/wp-json\/wp\/v2\/media?parent=800"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}](\"http:\/\/chezdom.net\/etu\/wp-content\/uploads\/sites\/3\/2018\/01\/copie-\u00e9cran-android-listview-exemple.png\"){kind=link}