Share
ListView è uno dei controlli di visualizzazione più utili disponibili sulla piattaforma Android per la visualizzazione di quantità variabili di dati. In questo tutorial su Mobiletuts +, ti mostreremo come utilizzare ListView per sfogliare un elenco di articoli!
Negli ultimi mesi, hai visto molti tutorial che coprivano vari controlli di layout. Userai molti di questi in combinazione con un ListView nel tutorial di oggi. L'applicazione stessa sarà molto semplice: visualizzerà un elenco di titoli di articoli che, se cliccati, visualizzano il contenuto dell'articolo. Il ritmo di questo tutorial sarà più veloce di alcune delle nostre esercitazioni iniziali; potrebbe non essere necessario rivedere alcuni dei nostri altri tutorial su questo sito o anche nel riferimento API Android se non si ha familiarità con i comandi o concetti base di Android. Il codice open source finale è disponibile per il download su Google code hosting.
Crea un nuovo progetto Android in Eclipse. Abbiamo chiamato il nostro MT-List, con un'attività di avvio chiamata TutListActivity. Questa attività deve estendere la classe ListActivity, che è una classe di attività speciale che consente di gestire un controllo ListView. Utilizziamo un livello API di destinazione 10 (Android 2.3.3).
In realtà, qui c'è pochissimo lavoro di progettazione. Un controllo ListView è costituito da elementi ripetuti, ciascuno con lo stesso layout (un modello per un elemento). Vogliamo visualizzare un elenco di titoli di articoli. Ogni titolo sarà un singolo elemento in ListView. Pertanto, il modello per ciascun elemento dell'elenco deve avere solo un controllo TextView. Aggiungi un nuovo file di risorse di layout al tuo progetto chiamato list_item.xml che rappresenta il layout del modello per ciascun elemento nell'elenco. In questo caso, dovrebbe assomigliare a questo:
La dimensione del testo più gli attributi del padding assicurano che ogni elemento dell'elenco sia un target touch abbastanza grande per il dito medio su uno schermo di dimensioni medie?
I controlli ListView sono progettati per caricare i dati da un'origine dati. È possibile utilizzare un adattatore per leggere da un database, array o altra origine dati. Useremo un'implementazione dell'array per questa applicazione. In seguito, è sempre possibile sostituire l'array con una sorta di fonte di dati live. Crea due risorse array di stringhe nel tuo progetto (puoi aggiungerle a strings.xml oa un file arrays.xml separato, a tua scelta). Assegna un array a "tut_titles" e l'altro a "tut_links". Compila gli array con titoli validi e URL validi dal sito Web di Mobiletuts +. Ecco i nostri array:
- Progetta e costruisci un'app per iOS Phone anni '80: Design Comp Slicing
- Best of Tuts + a febbraio 2011
- Crea un gioco Brick Breaker con Corona SDK: Controlli di gioco
- Esportazione di grafica per app mobili: PNG o JPEG?
- Design del tablet Android
- Crea un'app per ordinare pizze mobili in titanio: configurazione modulo ordine
- Crea un gioco Brick Breaker con Corona SDK: Application Setup
- Configurazioni del dispositivo virtuale del tablet Android
- Costruisci un'app per ordinare pizze mobili in titanio: Topping Selection
- Progetta e costruisci un'app per iOS Phone degli anni '80: configurazione di Interface Builder
- http://mobile.tutsplus.com/tutorials/mobile-design-tutorials/80s-phone-app-slicing/
- http://mobile.tutsplus.com/articles/news/best-of-tuts-in-february-2011/
- http://mobile.tutsplus.com/tutorials/corona/create-a-brick-breaker-game-with-the-corona-sdk-game-controls/
- http://mobile.tutsplus.com/tutorials/mobile-design-tutorials/mobile-design_png-or-jpg/
- http://mobile.tutsplus.com/tutorials/android/android-tablet-design/
- http://mobile.tutsplus.com/tutorials/appcelerator/build-a-titanium-mobile-pizza-ordering-app-order-form-setup/
- http://mobile.tutsplus.com/tutorials/corona/corona-sdk_brick-breaker/
- http://mobile.tutsplus.com/tutorials/android/android-sdk_tablet_virtual-device-configuration/
- http://mobile.tutsplus.com/tutorials/appcelerator/pizza-ordering-app-part-2/
- http://mobile.tutsplus.com/tutorials/iphone/1980s-phone-app_interface-builder-setup/
Questi dati sono, ovviamente, statici. In alcuni casi, l'utilizzo di dati statici può avere senso per un controllo ListView. L'utilizzo di una risorsa array di stringhe per questi casi risulta molto semplice e conveniente. Assicurati che l'ordine dei titoli e dei loro collegamenti sia identico, in modo tale che gli indici dell'array corrispondano.
Ora che l'applicazione ha i dati, è ora di visualizzarli. Tornato in TutListActivity.java, modifica il file onCreate () metodo per usare il setListAdapter () metodo per caricare i dati. A differenza delle attività regolari, a ListActivity non è necessario l'uso di setContentView () per i casi in cui l'intera attività è solo un ListView. Al termine, l'intera ListActivity sarà ora simile a questa:
public class TutListActivity estende ListActivity @Override public void onCreate (Bundle savedInstanceState) super.onCreate (savedInstanceState); setListAdapter (ArrayAdapter.createFromResource (getApplicationContext (), R.array.tut_titles, R.layout.list_item));
A questo punto, è possibile eseguire l'applicazione. Ora vedrai una ListView con tutti i titoli delle esercitazioni. Scorrere su e giù funziona come previsto. Tuttavia, fare clic su un titolo non fa ancora nulla.
La gestione dei clic sugli oggetti all'interno di ListView avviene in modo simile ad altri oggetti View: utilizzando un listener. In questo caso, siamo interessati a OnTimeClickListener. Avrai notato che non abbiamo mai trattato direttamente l'oggetto ListView. Ora è il momento. In una ListActivity, è sufficiente effettuare una chiamata al getListView () metodo per recuperare il ListView e quindi chiamare il setOnItemClickListener () metodo e implementarlo tutto in una volta:
getListView (). setOnItemClickListener (new OnItemClickListener () @Override public void onItemClick (AdapterView genitore, Visualizza vista, posizione int, ID lungo) // TBD);
Il onItemClick () il metodo verrà chiamato ogni volta che l'utente fa clic su un particolare oggetto all'interno di ListView. Convenientemente, passa in diversi parametri utili, uno dei quali è necessario per avviare l'attività di visualizzazione. Aspetta, quale attività di visualizzazione?
Buona domanda. Creiamo ora un'attività per gli spettatori! Questa attività verrà utilizzata per visualizzare i contenuti del tutorial all'utente. Crea una nuova classe estendendo Attività e chiamala TutViewerActivity.java. Crea un file di risorse di layout per esso che ha esattamente un elemento: un controllo WebView. Il file di layout dovrebbe assomigliare a questo:
All'interno del onCreate () metodo della classe TutViewerActivity, chiamare il setContentView () metodo e passare questo layout. Infine, non dimenticare di aggiungere l'attività al tuo file AndroidManifest.xml.
Riattiva la tua attenzione su TutListActivity per un momento. Diamo un'occhiata a ciò che dobbiamo fare per avviare l'attività del visualizzatore con il link dell'articolo appropriato. Dentro il onItemClick () metodo, la posizione dell'elemento su cui è stato fatto clic è passata come int tipo valore. Questo è esattamente ciò di cui abbiamo bisogno per accedere alla serie di collegamenti degli articoli.
I valori di stringa all'interno della matrice di collegamenti sono URL. Un modo conveniente per passare un URL ad un'altra attività è aggiungere un Uri all'Intento tramite il setData () metodo. Ecco la finale onItemClick () implementazione che avvia l'attività del visualizzatore, passando nell'URL appropriato:
@Override public void onItemClick (AdapterView genitore, Visualizza vista, posizione int, ID lungo) String content = links [position]; Inten showContent = new Intent (getApplicationContext (), TutViewerActivity.class); showContent.setData (Uri.parse (contenuto)); startActivity (showContent);
Se lo incolli alla fine del onCreate () metodo, noterete che la variabile dei collegamenti non è ancora stata definita. Poiché verrà utilizzato all'interno della classe OnItemClickListener, la variabile deve essere un valore finale, in questo modo:
final String [] links = getResources (). getStringArray (R.array.tut_links);
Questa riga deve essere posizionata prima della definizione di OnItemClickListener. Sì, avresti potuto renderlo membro variabile senza essere definitivo. Per un caso più complesso, potrebbe anche essere necessario. Ma, in questo caso, possiamo effettivamente mantenere tutto il codice all'interno del metodo.
A questo punto, se esegui l'applicazione, riceverai una schermata bianca vuota. L'attività viene avviata correttamente, ma è necessario andare a collegare l'attività del visualizzatore per caricare l'URL nel controllo WebView.
Rivolgi la tua attenzione a TutViewerActivity.java. Dopo il setContentView () chiama, aggiungi il codice per recuperare l'Uri dall'intento passato e convertilo in una variabile String. Quindi aggiungi una chiamata al loadURL () metodo della classe WebView. L'intera classe TutViewerActivity ora sarà simile a questa:
public class TutViewerActivity estende Activity @Override public void onCreate (Bundle savedInstanceState) super.onCreate (savedInstanceState); setContentView (R.layout.tut_view); Intent launchingIntent = getIntent (); String content = launchingIntent.getData (). ToString (); WebView viewer = (WebView) findViewById (R.id.tutView); viewer.loadUrl (contenuto);
Esegui l'applicazione ora. Funziona? Non ancora! Un ultimo dettaglio: è necessario aggiungere l'autorizzazione Internet al file AndroidManifest.xml. Ora esegui l'applicazione. Vedrai ora che l'implementazione funziona:
L'esperienza, così com'è, funziona. Un ListView mostra tutti i titoli degli articoli, un utente può fare clic su un elemento specifico dell'elenco ed essere reindirizzato a un'attività con una WebView per mostrare l'URL appropriato. Alcuni perfezionamenti che potresti prendere in considerazione per questa implementazione di base includono:
Altre esercitazioni Android su questo sito ti insegneranno come eseguire molte di queste funzionalità opzionali. Altre persone potrebbero dover scoprire te stesso - o chiedere nei commenti!
Il widget ListView è un modo rapido per organizzare i dati in un formato elenco sullo schermo. Abbiamo solo graffiato la superficie del controllo ListView in questo tutorial. Tuttavia, hai imparato le basi di: creazione di voci di elenco, utilizzo di adattatori di dati e gestione dei clic sugli elementi di elenco.
Gli sviluppatori mobili Lauren Darcey e Shane Conder hanno coautore diversi libri sullo sviluppo di Android: un libro di programmazione approfondito intitolato Sviluppo di applicazioni wireless Android e Sams ti insegna a sviluppare applicazioni Android in 24 ore. Quando non scrivono, passano il loro tempo a sviluppare software mobile presso la loro azienda ea fornire servizi di consulenza. Possono essere contattati via email a [email protected], tramite il loro blog su androidbook.blogspot.com e su Twitter @androidwireless.
Accentsconagua