Android ListView Tutorial mit ListAdapter (Einsteiger)

ListView-Activity

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

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

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

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

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:

Android Tutorial ListView hinzufügen Main.xml

Android Tutorial ListView hinzufügen Main.xml

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

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

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:

Layout der Anzeige-Activity

Layout der Anzeige-Activity

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

ListView-Activity des Android ListView Tutroials

ListView-Activity des Android ListView Tutroials

TutorialListViewActivityAnzeige

Anzeige-Activity des Android ListView Tutorials

Anzeige-Activity des Android ListView Tutorials

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.

Android-Manifest des ListView-Toturials

Android-Manifest des ListView-Toturials

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

ListView-Activity

ListView-Activity

ListView-Anzeige

ListView-Anzeige

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

You can leave a response, or trackback from your own site.

30 Kommentare zu “Android ListView Tutorial mit ListAdapter (Einsteiger)”

  1. Torben sagt:

    Hallo Daniel,

    zuerst einmal Danke für die Tutorials!
    Ich fange langsam an mich für das Programmieren zu interessieren und man findet hier wirklich viel Hilfe.
    Momentan habe ich folgendes Problem: Soweit ich es weis, stimmt mein Programm mit deinem überein, es gibt weder Fehlermeldungen noch fehlt etwas. Wenn ich allerdings das Projekt debugge und über den AVD ausgeben lasse kommt nur ein Android-Schriftzug, es tut sich allerdings nichts. Woran kann das liegen? Danke im Voraus

    • Daniel sagt:

      Hi Torben,

      das ist schön, dass freut mich zu hören. Zu deinem Problem: Startet der Emulator denn richtig? Oder welchen Android-Schriftzug meinst du?

      MfG Daniel

      • Torben sagt:

        Habe mich glaube schlecht ausgedrückt ;)
        Der Emulator startet, ich kann auch die Standardfunktionen ausführen, die App finde ich nicht einmal.
        Mfg,
        Torben

        • Daniel sagt:

          Hi, kannst du denn andere Apps über den Emulator ausführen?
          Sonst kannst du auch mal versuchen den Emu zu starten und dann erst zu erstellen.
          MfG Daniel

          • Torben sagt:

            Also z.B. HelloWorld läuft.
            Folgende Fehlerausgabe hab ich gerade noch gefunden:
            [2012-02-13 21:50:48 - listviewer] No Launcher activity found!
            [2012-02-13 21:50:48 - listviewer] The launch will only sync the application package on the device!

          • Sebastian sagt:

            Hallo,
            hört sich an als würde der Intentfilter fehlen. Schau doch mal in deiner AndroidManifest.xml, ob dort folgendes steht:

            <intent-filter>
            <action android:name="android.intent.action.MAIN" />
            <category android:name="android.intent.category.LAUNCHER" />
            </intent-filter>

            Das sollte in der start-Activity stehen.
            Gruss Sebastian

  2. Torben sagt:

    Genau das war es ;) Herzlichen Dank euch beiden!

  3. Nina sagt:

    Hallo,

    vielen Dank für dein Tutorial!!
    Bei mir tritt leider ein Fehler auf…ich denke wegen:

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

    Woher soll er eigentlich simple_list_item_1 kennen?
    Fehlermeldung:
    The constructor ArrayAdapter<T>(Context, int, List<T>) refers to the missing type T

    DANKE!!

    • Sebastian sagt:

      Hi,

      simple_list_item_1 ist aus dem SDK (erkennbar am Package android.R.layout).

      Der Fehler ist, das Du dem ArrayAdapter einen Typ zuweisen musst, wie die Fehlermeldung ja auch sagt.
      Denkbar wäre ArrayAdapter<String> oder eben ArrayAdapter<MeinObjekt>.

  4. Joachim sagt:

    hi,

    wie kann ich die Farbe für den Text in den ListView-Items ändern?

    am Beispiel:
    value1
    value2
    usw.
    soll nicht mehr weiß, sondern rot sein.

    MfG

    • Daniel sagt:

      Dazu musst du dir ein neues Layout sowie einen ListAdapter bauen. Im Adapter musst du das Layout dann zuweisen sowie mit Daten füllen.

      MfG Daniel

  5. Shadowcrow sagt:

    Ich hatte da auch erst nen Fehler weil ich in der Klassendefinition erst "public class MainActivity" hatte und nicht "public class MainActivity<T>"

  6. Claudii sagt:

    VIELEN DANK!
    hat alles geklappt ;)
    Habe dennoch eine Frage…
    ist es möglich die values umzubenennen
    z.b statt Value 0, Kategorie1
    Value 1, Kategrie 2
    usw…

    • Sebastian sagt:

      Hi,
      an der Stelle wo in der Schleife die Liste gefüllt wird, kannst Du natürlich jeden String eingeben.
      Also quasi:
      for (int i = 0; i < 10; i++)
      {
      valueList.add(“Kategorie ”+i);
      }

  7. Claudii sagt:

    vielen vielen dank
    hat mir sehr weitergeholfen :)
    und wenn ich jetzt die farbe der kategorie value ändern möchte?

    also..
    statt "Kategorie1" in weiss, '"Kategorie1" in schwarz
    alle Kategorien in schware schrift…

  8. Jan sagt:

    Hallo,
    ein schönes Tutorial muss ich sagen.
    Habe dennoch ein Problem.
    An der Stelle wo der adapter initialisiert wird, darf ich laut eclipse die valueList
    nicht mit anhängen da der Konstruktor dafür nicht existiert.
    Er schlägt mir vor valueList in integer zu wandeln, aber das ist ja nicht Sinn der Sache.
    Irgendeine Idee?

    Vielen Dank im voraus.

    MfG Jan

    • Sebastian sagt:

      Hi,
      probier mal das:
      ListAdapter adapter = new ArrayAdapter<String>(getApplicationContext(), android.R.layout.simple_list_item_1, valueList);

      also quasi String statt dem generischen T.

      Gruss Sebastian

  9. Miche sagt:

    Hi,
    hab heute die java Platform und den eclipse installiert. Würde gerne obiges App ausprobieren. Kann leider das File-New-other-Android-Android Project nicht finden. Ist dies vergleichbar mit android application project. Wenn ja, dann sind die nachfolgenden Fenster leider anders und ich tu mich schwer. Vielleicht hab ich ja auch einen Fehler bei der Installation gemacht.
    Gruss Miche

  10. Wladimir sagt:

    Hey gutes Tutorial aber bei mir stimmt was mit der Farbe nicht ..also bei mir ist alles weiß und die items wechseln nur die Farbe wenn ich darüber fahre :( Also seh ich immer nur einen Eintrag

  11. Martin sagt:

    Super Tutorial. Mich würde noch interessieren, wie ich die angezeigte Liste zur Laufzeit verlängern kann. Immer komplett neu aufbauen über einen neu erzeugten ListAdapter, oder geht es inkrementell?

  12. Der Abt sagt:

    HI! Danke für das Tutorial!
    Ich verwende eine neuere Ecplipse Version und auch höhere Android UMgebung.
    Ecplise meckert bei
    lv.setOnItemClickListener(new OnItemClickListener(){ …
    Fehler:
    The method onItemClick(AdapterView<?>, View, int, long) of type new AdapterView.OnItemClickListener(){} must override a superclass method
    1 quick fix available:
    Remove '@Override' annotation.

    Wenn ich das mache, ist der Fehler weg, aber wenn ich die App im Emu ausführe crasht sie, sobald ich auf ein Item klicke.
    Im LogCat wir dies kommentiert mit:
    android.app.SuperNotCalledException: Activity {com.example.tutoriallistview/com.example.tutoriallistview.TutorialListViewActivityAnzeige} did not call through to super.onCreate()
    etc…

  13. Finn sagt:

    Kanst du auch noch einTutorial machen wie man das ganze dann durchsuchen kann ?

    • Daniel sagt:

      Hi,

      was meinst du mit durchsuchen? Willst du wissen auf welches ListItem du geklickt hast? Ich habe leider zur Zeit viel zu tun. Ich versuche aber mal wieder ein paar Tutorials zu schreiben. Vielleicht hat ja auch einer von euch Lust mal eins für die Leser ein Tutorial zu schreiben.

      MfG Daniel

  14. Holger2013 sagt:

    Hallo zusammen und auch von mir Danke für das hervorragende Tutorial (T.). Habe 2 Sachen: Zunächst ist mir aufgefallen, dass Copy und paste aus dem T. in den Editor meistens nicht geht. Der Debugger schlägt an, obwohl der Code genauso aussieht, wie im T. Erst manuelles eintippen geht-hat mich Stunden gekostet, dahinter zu kommen. Zweitens noch 2 Fehler, die ich einfach nicht lösen kann: In der class zur Anzeige eines Listviewelements (im T. die class TutorialListViewActivityAnzeige)wird '…anzeige' und '…TextView1' nicht gefunden – auch nicht blau dargestellt. Alle anderen Klassen schaftt der Debugger ohne Probleme. Ein Tipp wäre hilfreich – Danke i. v.
    Gruss
    Holger

  15. Tom sagt:

    Hallo,

    das Tutorial hat mir auch gut weitergeholfen, danke.
    Es funktioniert zwar nicht per Copy&Paste, aber die Änderungen welche nötig sind hat man ja fix gefunden :)

    Ich stehe nun vor folgendem Problem wo ich noch nicht herausgefunden habe wie ich es lösen kann:
    Eine ListView soll 3 Elemente beinhalten, Button, TextField, Button.
    [-] 0 [+]
    Also durch den Klick auf den Button der jeweiligen Zeile, soll der Integerwert in der jeweiligen Zeile erhöht/erniedrigt werden.
    Soweit theoretisch kein Problem, aber:
    Egal in welcher Zeile ich auf den Button klicke, es wird immer der oberste Wert erhöht/erniedrigt :(
    Ich verwende mit Buttons onClickListener in der ListView, onItemClickListener würde ich gerne umgehen da ich ja nicht alles, sondern nur die Buttons "clickable" haben möchte.

    Eine Antwort auf mein Problem könnte auch als Tutorial verwender werden, wie man auf die Zeilenelemente zugreifen und diese Modifizieren kann *hust hust*.

    Nein Spaß, großes Lob für das Tutorial aber ich komm bei meinem Problem echt nicht vorran, für Tipps/Hilfen wäre ich echt dankbar :)

    • Sebastian sagt:

      Hi,

      also ohne deinen Code genau zu kennen ist das schwierig, aber du musst die werte ja irgendwo speichern. Beim zugriff auf diese Werte musst du dann die Position mit beachten, die du im getView des Adapters hast.

      Sebastian

  16. Claire sagt:

    Super, die Liste klappt!
    Aber wie kann ich für den User ermöglichen neue Listen Items hinzuzufügen?

NEUEN KOMMENTAR HINZUFÜGEN