Androidentwicklung

ANDROID LISTVIEW TUTORIAL MIT LISTADAPTER (EINSTEIGER)

Eine der meist genutzten „Controls“ in Android-App ist die ListeView. Sie ist nicht nur leicht zu implementieren sondern Ihr könnt eure Inhalte auch sehr übersichtlich darstellen.

Wie Ihr eine ListView schnell und einfach hinzugefügt und wie Ihr ausgewählte Werte auslesen könnt, zeige ich euch in diesem Tutorial.

Als erstes starten wir wie gewohnt mit der Erstellung eines neuen Projektes. Dazu gehen wir wie gewohnt in Eclipse auf „File“ -> „New“ -> „Others…“und wählen dort in der Rubrik „Android“ -> „Android Project“ aus und klickt auf „Next“.

Android ListView Projekt erstellen

Danach könnt Ihr euch einen Namen für euer Projekt vergeben. Mein Projekt heißt „TutorialListView“. Wenn Ihr einen Namen gefunden und eingetragen habt, könnt Ihr wieder auf „Next“ klicken.

Android ListView Projektname

Im nächsten Schritt müsst Ihr ein Android-Target auswählen. Ich nehme wie üblich die Android-Version 2.1.

Androidprojekt erstellen Target wählen

Ist auch das geschafft, bekommt Ihr noch mal eine kurze Übersicht über eure Eingaben und könnt gegebenenfalls noch etwas anpassen. Außerdem sollte hier noch das Package geändert werden. Mein Package-Name lautet: „de.tutorial.listview“. Ist das geschafft könnt Ihr nun auf „Finish“ klicken.

Android ListView Info

Nachdem wir das Projekt nun angelegt haben, können wir mit der eigentlichen Programmierarbeit beginnen. Dazu nehmen wir uns zuerst die Layouts vor. Wir gehen also in das „res“-Verzeichnis unseres Projektes und wechseln dort in den Ordner „Layout“. In dem Ordner finden wir die „main.xml“ –Datei. Diese wollen wir nun bearbeiten und klicken sie dazu doppelt an. Damit wir am Ende eine einheitliche Android-App haben, gehen wir in der „main.xml“ unten auf den Reiter „main.xml“ in die Code-Ansicht. Hier fügen wir ganz einfach unter die „TextView“ die „ListView“ mit folgendem Code hinzu:

<ListView
android:id=“@+id/listView1″
android:layout_width=“fill_parent“
android:layout_height=“wrap_content“ >
</ListView>

Wenn keine Fehler aufgetreten sind, habt Ihr alles richtig gemacht. Hier nochmal zum Vergleich auch mein Code:

Als nächstes erzeugen wir auch gleich noch ein Layout für die Anzeige-Activity, die uns den ausgewählten Listeneintrag anzeigt. Die Anzeige wäre auch über ein Toast oder ähnliches möglich gewesen aber ich dachte mir, dass ich euch so auch noch gleich die Übergabe von Daten zeigen kann.
Um ein neues Layout zu erstellen, klicken wir mit der rechten Maustaste auf den Layout-Ordner und wählen dann „New“ -> „Others…“ -> „Android XML Layout File“ und klicken dann auf „Next“.

Neues Android-Layout erstellen

Danach geben wir dem File einen Namen und klicken dann auf „Finish“. Mein Layout-File heißt „anzeige.xml“.

Android-Layout Name

Wenn das geschafft ist, wechseln wir wieder in die Code-Ansicht des Layouts und fügen dort eine „TextView“ hinzu. Das könnt Ihr mit dem folgenden Code machen oder über die grafische Benutzeroberfläche.

<TextView
android:id=“@+id/textView1″
android:layout_width=“wrap_content“
android:layout_height=“wrap_content“
android:text=“Large Text“
android:textAppearance=“?android:attr/textAppearanceLarge“ />

Der vollständigkeit haber ist hier noch mein vollständiges Layout:

Damit sind wir mit der Erstellung der beiden Layouts fertig und können uns um die Daten sowie um die Befüllung der „ListView“ kümmern. Dazu gehen wir in den „src“-Ordner und öffnen dort unsere „Activity.java“. Meine Datei hat den Namen „TutorialListViewActivity“. Wenn Ihr diese geöffnet habt, wollen wir uns erst mal um die Daten kümmern welche in der „ListView“ später angezeigt werden sollen. Dazu habe ich mir überlegt, dass wir eine Liste erstellen mit den Werten „value0“ bis „value9“. Das können wir ganz leicht mit einer „For-Schleife“ erledigen. Dazu Instanziieren wir als erstes eine Liste.

List valueList = new ArrayList<String>();

Danach befüllen wir dies mit Daten. Wie schon erwähnt, erledige ich das duch eine „For-Schleife“. Ihr könnt die Liste natürlich auch anders befüllen.

for (int i = 0; i < 10; i++)
{
valueList.add(„value“+i);
}

In der Liste sollten nun die Werte „value0“ bis „value9“ stehen. Als nächstes generieren wir einen „ListAdapter“ für die „ListView“. Das tun wir wie folgt:

ListAdapter adapter = new ArrayAdapter<T>(getApplicationContext(), android.R.layout.simple_list_item_1, valueList);

Danach holen wir uns noch unsere „ListView“ aus unserem Layout und geben ihr unseren eben erstellten Adapter.

final ListView lv = (ListView)findViewById(R.id.listView1);

lv.setAdapter(adapter);

Wenn Ihr die App jetzt startet, sollte auf jeden Fall schon einmal die “ListView” mit den generierten Werten erscheinen. Wir wollen aber, dass bei einem Klick auf einen Eintrag der „ListView“ eine neue „Activity“ gestartet wird, die den ausgewählten Wert anzeigt. Dazu brauchen wir noch einen „OnItemClickListener-Listener“ der den „Intent“ vorbereitet und die neue „Activity“ startet.

lv.setOnItemClickListener(new OnItemClickListener()
{
@Override
public void onItemClick(AdapterView<?> arg0, View arg1, int arg2, long arg3)
{
Intent intent = new Intent();
intent.setClassName(getPackageName(), getPackageName()+“.TutorialListViewActivityAnzeige“);
intent.putExtra(„selected“, lv.getAdapter().getItem(arg2).toString());
startActivity(intent);
}
});

Wie Ihr seht, will ich die „Activity“ „TutorialListViewActivityAnzeige“ starten und dieser „Activity“ per „intent.putExtra“ das gerade ausgewählte Item mitgeben. Damit das funktioniert müssen wir diese Activity natürlich noch anlegen. Dazu erstellen wir entweder eine neue Java-Datei oder duplizieren unsere jetzige „Activity“ und geben ihr den Namen: „TutorialListViewActivityAnzeige“. Hier wollen wir einfach nur unser Layout „anzeige“ laden und natürlich den übergebenen Wert in der „TextView“ anzeigen. Wir setzen also mit „setContentView“ unser Layout und holen uns den Intent der die „Activity“ gestartet hat. Aus diesem lesen wir dann den Wert mit „intent.getStringExtra(„selected“)“ aus. Diesen übergeben wir dann mit „setText“ der „TextView“.

setContentView(R.layout.anzeige);

Intent intent = getIntent();

((TextView)(findViewById(R.id.textView1))).setText(„Es wurde „+intent.getStringExtra(„selected“)+ “ gewählt!“);

Damit Ihr den Überblick behaltet sind hier nochmal die Codes der beiden „Activitys“:

TutorialListViewActivity

TutorialListViewActivityAnzeige

Der letzte Schritt den manche oft vergessen ist die erstellte „Activity“ nun noch der „AndroidManifest.xml“ bekannt zu machen. Dazu öffnen wir diese und gehen auf den Reiter „Application“. Dort klicken wir unter der Rubrik „Application Nodes“ auf „Add“ und fügen der Auflistung eine neue „Activity“ hinzu. Dieser geben wir nun den Namen „TutorialListViewActivityAnzeige“ und speichern die Datei.

Wenn Ihr alles gespeichert habt und keine Fehler angezeigt bekommt, könnt Ihr die Android-App nun starten.

ListView-Activity

ListView-Anzeige

Falls Ihr Fragen oder Probleme habt, schreibt uns einfach. Wir bemühen uns alle Fragen zu beantworten.

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.