DevCorner: creiamo una ListView, aggiungiamo ed eliminiamo elementi

Nella propria vita, ogni buon sviluppatore Android si troverà prima o poi a scontrarsi con le amate/odiate ListView: che sia per creare un lettore di feed RSS, un elenco di giocatori in una squadra o quant'altro, siamo sicuri che presto o tardi ne avrete a che fare. Proprio per questo motivo non ci lasciamo intimorire da questo afoso martedì di agosto e nell'episodio odierno di DevCorner vi spieghiamo le basi su come creare una ListView, aggiungere o rimuovere elementi.

Per prima cosa facciamo un po' di chiarezza: una ListView, come suggerisce il nome, è una lista di elementi scrollabili che viene molto spesso utilizzata per mostrare degli elenchi. Solitamente viene affiancata da un database o da una serie di dati scaricati da internet, ma per questa prima introduzione all'argomento la popoleremo con una lista statica di dati, precisamente un Array di Stringhe contenenti i nomi degli autori del nostro portale.

Per prima cosa, quindi, creiamo un nuovo progetto che noi abbiamo chiamato ListViewEsempio e definiamo il layout della nostra Activity di base (nonché unica) che abbiamo esplicitamente chiamato ListViewActivity: all'interno ci sarà una TextView con il nostro titolo (Lista Autori AndroidWorld), la famigerata ListView e, in fondo, un campo di testo dove digitare un nome da inserire nella lista accompagnato dal bottone per completare l'aggiunta. In definitiva, il tutto avrà un aspetto simile:

Tuttavia, quanto fatto finora non è ancora sufficiente a definire la nostra interfaccia: ogni singolo elemento della nostra ListView, infatti, si compone a sua volta di un altro layout che dobbiamo creare: per farlo, clicchiamo col tasto destro sulla cartella layout, scegliamo New e successivamente Android XML File. Il file appena creato, che chiameremo row, è in realtà molto semplice in quanto, per questo primo tutorial, abbiamo scelto di inserire solo del testo.

Le (poche) righe di codice saranno quindi le seguenti:

Adesso, dopo aver stabilito l'interfaccia, arriva come sempre la parte più divertente, ossia quella del nostro codice Java. Apriamo il file contenente la nostra unica Activity e, per prima cosa, definiamo tramite i loro ID tutti gli elementi che ci saranno utili, in particolare la ListView, l'ArrayAdapter, l'EditText e il Button.

	private ListView mainListView;
	private ArrayAdapter listAdapter;
	private EditText nuovoNome;
	private Button tastoAggiungi;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_list_view);
		nuovoNome = (EditText) findViewById(R.id.nuovoNome);
		tastoAggiungi = (Button) findViewById(R.id.bottoneAggiungi);
		mainListView = (ListView) findViewById(R.id.listView);

A proposito dell'ArrayAdapter, si tratta di una componente che ha il compito di "sistemare al loro posto" gli elementi contenuti nell'Array (che presto andremo a scrivere) all'interno della ListView.

In secondo luogo, scriviamo il nostro Array di String chiamato autori (citati in ordine rigorosamente sparso!) e successivamente un'ArrayList al quale aggiungiamo tutti gli elementi del suddetto Array.

Infine, istanziamo (e richiamiamo), il nostro ArrayAdapter chiamato listAdapter affinché posizioni tutti gli elementi nel posto corretto: passiamogli, quindi la nostra Activity (this), il layout di ogni singola cella (R.layout.row) e ovviamente la nostra ArrayList(listaAutori). Continuando nell'OnCreate, digitiamo quindi:

String[] autori = new String[] { "Emanuele Cisotti", "Nicola Ligas", "Giuseppe Tripodi", "Roberto Orgiu", "Marco Giannino", "Agostino Caruso", "Lorenzo Quiroli", "Lorenzo Delli", "Erika Gherardi", "Nicola Randone", "Giorgio Palmieri", "Emanuele Manili", "Francesco Fumelli" };
		final ArrayList listaAutori = new ArrayList();
		listaAutori.addAll(Arrays.asList(autori));
		listAdapter = new ArrayAdapter(this, R.layout.row, listaAutori);
		mainListView.setAdapter(listAdapter);

Adesso è giunto il momento di dare la possibilità di aggiungere tutti gli autori che preferite al nostro team: da Pippo a Ziggy Stardust, potete inserire chiunque nell'elenco! Per prima cosa, quindi, implementiamo il metodo OnClickListener per far "funzionare" il nostro bottone:

public class ListViewActivity extends Activity implements OnClickListener {

In secondo luogo, aggiungiamo un OnClickListener al nostro tasto, scrivendo quanto segue nell'OnCreate:

tastoAggiungi.setOnClickListener(this);

Infine, aggiungiamo il metodo OnClick dal quale prenderemo il contenuto dell'EditText nuovoNome salvandolo nella variabile nuovoAutore per poi aggiungerla all'elenco e svuotare nuovamente il campo di testo.

@Override
	public void onClick(View v) {
		// TODO Auto-generated method stub
		String nuovoAutore = nuovoNome.getText().toString();
		listAdapter.add(nuovoAutore);
		nuovoNome.setText("");
	}

Ma dopo aver fatto tutto ciò, non vorrete certo toglierci la soddisfazione di poter eliminare un autore (o qualche editor fastidioso come il buon Nicola!) dalla lista, vero? Nell'OnCreate aggiungiamo quindi un OnItemClickListener alla nostra ListView: questo metodo capta quando clicchiamo su una casella dell'elenco e, registrandone la posizione (come int), ci consente di operare sul singolo elemento.

In questo esempio, spieghiamo come far comparire un Altert che ci chiederà conferma se eliminare o meno il nome che abbiamo cliccato e, in caso di risposta affermativa, lo rimuoverà dalla lista. Per farlo richiamiamo l'AlertBuilder con il quale settiamo titolo, messaggio e tasto positivo e negativo: in caso di clic su "Ok", verrà richiamato il metodo remove del listAdapter che, dopo aver ricevuto la posizione da rimuovere si occuperà di eliminare l'elemento corrispondente.

Il tutto si riassume con le seguenti righe di codice:

	mainListView.setOnItemClickListener(new OnItemClickListener() {

			@Override
			public void onItemClick(AdapterView<?> arg0, View view,
					int posizione, long id) {
				// TODO Auto-generated method stub

				AlertDialog.Builder adb = new AlertDialog.Builder(
						ListViewActivity.this);
				adb.setTitle("Elimina elemento:");
				adb.setMessage("Sei sicuro di voler eliminare " +listaAutori.get(posizione)+ "?");
				final int posizioneDaRimuovere = posizione;
				adb.setNegativeButton("Annulla", null);
				adb.setPositiveButton("Ok", new AlertDialog.OnClickListener() {
					public void onClick(DialogInterface dialog, int which) {
						listAdapter.remove(listAdapter.getItem(posizioneDaRimuovere));
					}
				});
				adb.show();
			}

		});

Abbiamo finalmente creato il nostro elenco con gli autori, dal quale possiamo aggiungere o eliminare nomi: per sicurezza, comunque, facciamo una ricapitolazione finale segnalando che l'intero codice della ListViewActivity.java dovrebbe essere qualcosa di simile:

package com.androidworld.listview;

import java.util.ArrayList;
import java.util.Arrays;
import android.app.Activity;
import android.app.AlertDialog;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.View;
import android.view.View.OnClickListener;
import android.widget.AdapterView;
import android.widget.AdapterView.OnItemClickListener;
import android.widget.ArrayAdapter;
import android.widget.Button;
import android.widget.EditText;
import android.widget.ListView;
import com.example.listviewesempio.R;

public class ListViewActivity extends Activity implements OnClickListener {

	private ListView mainListView;
	private ArrayAdapter listAdapter;
	private EditText nuovoNome;
	private Button tastoAggiungi;

	@Override
	public void onCreate(Bundle savedInstanceState) {
		super.onCreate(savedInstanceState);
		setContentView(R.layout.activity_list_view);

		//Definiamo ListView, EditText e Button dal loro ID
		nuovoNome = (EditText) findViewById(R.id.nuovoNome);
		tastoAggiungi = (Button) findViewById(R.id.bottoneAggiungi);
		mainListView = (ListView) findViewById(R.id.listView);

		//Aggiungiamo l'OnClickListener al tastoAggiungi
		tastoAggiungi.setOnClickListener(this);

		//Stabiliamo il nostro Array di autori
		String[] autori = new String[] { "Emanuele Cisotti", "Nicola Ligas",
				"Giuseppe Tripodi", "Roberto Orgiu", "Marco Giannino", "Agostino Caruso", "Lorenzo Quiroli",
				"Lorenzo Delli", "Erika Gherardi", "Nicola Randone",
				"Giorgio Palmieri", "Emanuele Manili", "Francesco Fumelli" };
		//Creiamo un nuovo ArrayList e aggiungiamo tutti gli autori
		final ArrayList listaAutori = new ArrayList();
		listaAutori.addAll(Arrays.asList(autori));

		//Creiamo un nuovo ArrayAdapter, necessario per "sistemare" tutti gli elementi all'interno della Listview
		listAdapter = new ArrayAdapter(this, R.layout.row, listaAutori);

		mainListView.setAdapter(listAdapter);
		mainListView.setOnItemClickListener(new OnItemClickListener() {

			@Override
			public void onItemClick(AdapterView<?> arg0, View view,
					int posizione, long id) {
				// TODO Auto-generated method stub

				AlertDialog.Builder adb = new AlertDialog.Builder(
						ListViewActivity.this);
				adb.setTitle("Elimina elemento:");
				adb.setMessage("Sei sicuro di voler eliminare " +listaAutori.get(posizione)+ "?");
				final int posizioneDaRimuovere = posizione;
				adb.setNegativeButton("Annulla", null);
				adb.setPositiveButton("Ok", new AlertDialog.OnClickListener() {
					public void onClick(DialogInterface dialog, int which) {
						listAdapter.remove(listAdapter.getItem(posizioneDaRimuovere));
					}
				});
				adb.show();
			}

		});
	}

	@Override
	public void onClick(View v) {
		// TODO Auto-generated method stub
		String nuovoAutore = nuovoNome.getText().toString();
		listAdapter.add(nuovoAutore);
		nuovoNome.setText("");
	}
}

Anche per questa settimana l'appuntamento con DevCorner è volto al termine: se vi trovate in difficoltà con questo o qualsiasi altro tutorial, prima di pensare (bene) di immergere la testa sotto le cristalline acque, venite a dare un'occhiata alla nostra sezione sul forum: siamo sicuri che, nonostante l'afa, ci sarà qualche anima pia pronta a rispondervi!