Programmierbare ListView erstellen um Daten in einer Listenansicht anzuzeigen

Veröffentlicht: 05. Oktober 2019

Hier erfahren wir, wie wir die Klasse und Komponente ListView verwenden, um Daten in Zeilen in einer Listenansicht anzuzeigen. Die Listenansicht ist scrollbar und kann Text, Schaltflächen, Checkboxen usw. anzeigen. Die Daten für die Listenansicht werden über eine Java-Klasse (eine Activity) geladen.

Wir werden hier eine Textansicht (Text view) und ein Kontrollkästchen (Checkbox) verwenden. Die Listenansicht verwendet die Modell-Einkaufsliste. Als Beispiel dient hier eine Einkaufslisten-App.

Android-Layoutdatei für die Zeilen der Liste erstellen

Erstellen Sie die Datei layout_row.xml mit diesem Inhalt:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
 
    <CheckBox
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/checkbox"
        android:text="Buy"/>
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/shoppingitem"
        android:layout_marginLeft="15dp"
        android:textSize="22sp"
        android:text="shoppingitem"/>
 
</LinearLayout>

Dies definiert das Layout einer Zeile der Listenansicht. Später werden wir eine Liste dieses Zeilenlayouts erstellen und auf die Checkbox-Komponente (mit der ID "Checkbox") und die Textansicht (mit der ID "shoppingitem") zugreifen.

Listenansicht zur Haupt-Layoutdatei "activity_main.xml" hinzufügen

Diese Layoutdatei enthält nur die Listenansicht, um diese Einführung von ListView leicht verständlich zu halten.
Fügen Sie die Komponente ListView wie hier gezeigt hinzu:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
 
    <ListView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:id="@+id/shoppinglistview">
    </ListView>


</LinearLayout>

Java-(Modell-)Klasse "Shopping.java" erstellen

Erstellen Sie eine Java-Klasse, die für ein List-Array der Listenansicht verwendet wird. Sie enthält hier die boolesche Variable isMarked, die speichert, wenn das Kontrollkästchen aktiviert ist. Aber diese Klasse hat auch eine String-Variable, die den Namen des Einkaufsartikels speichert.

public class Shopping {
 
    private boolean isMarked;
    private String shoppingItem;
 
    public String getShoppingItem() {
        return shoppingItem;
    }
 
    public void setShoppingItem(String shoppingItem) {
        this.shoppingItem = shoppingItem;
    }
 
    public boolean getMarked() {
        return isMarked;
    }
 
    public void setMarked(boolean marked) {
        isMarked = marked;
    }
}

Adapterklasse "ShoppingAdapter.java" anlegen

Diese Klasse muss die Klasse "BaseAdapter" erweitern (Befehl "extends"). Sie enthält die folgenden Instanzvariablen: Kontextvariable "context" und ArrayList "modelShoppingList" mit der zuvor erstellten Klasse "Shopping". Sie müssen sechs Funktionen überschreiben.

Die Klasse enthält folgendes:

import android.content.Context;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;
import android.widget.BaseAdapter;
import android.widget.CheckBox;
import android.widget.TextView;
import android.widget.Toast;
import java.util.ArrayList;

public class ShoppingAdapter extends BaseAdapter {
 
    private Context context;
    public static ArrayList<Shopping> modelShoppingList;
 
 
    public ShoppingAdapter(Context context, ArrayList<Shopping> modelShoppingList) {
 
        this.context = context;
        this.modelShoppingList = modelShoppingList;
 
    }
 
    @Override
    public int getViewTypeCount() {
        return getCount();
    }
    @Override
    public int getItemViewType(int position) {
 
        return position;
    }
 
    @Override
    public int getCount() {
        return modelShoppingList.size();
    }
 
    @Override
    public Object getItem(int position) {
        return modelShoppingList.get(position);
    }
 
    @Override
    public long getItemId(int position) {
        return 0;
    }
 
    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        final ViewHolder holder;
 
        if (convertView == null) {
            holder = new ViewHolder(); LayoutInflater inflater = (LayoutInflater) context
                    .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
            convertView = inflater.inflate(R.layout.shoppinglistview, null, true);
 
            holder.checkBox = (CheckBox) convertView.findViewById(R.id.checkbox);
            holder.shoppingitem = (TextView) convertView.findViewById(R.id.shoppingitem);
 
            convertView.setTag(holder);
        }else {
            // Die Methode getTag() erstellt das viewHolder-Objekt als Tag und gibt es an die View zurück.
            holder = (ViewHolder)convertView.getTag();
        }
 
 
        holder.checkBox.setText("Checkbox No. "+position);
        holder.shoppingitemText.setText(modelShoppingList.get(position).getShoppingItem());
 
        holder.checkBox.setChecked(modelShoppingList.get(position).getSelected());
        
        //Speichern dieser Komponente in der View ID 1
        holder.checkBox.setTag(1, convertView);
        holder.checkBox.setTag(position);
        holder.checkBox.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Integer listPosition = (Integer) holder.checkBox.getTag();
                Toast.makeText(context, "You clicked Checkbox "+pos, Toast.LENGTH_SHORT).show();
 
                //Einstellung der Anzeige des Kontrollkästchens
                if(modelShoppingList.get(listPosition).getSelected()){
                    modelShoppingList.get(listPosition).setSelected(false);
                }else {
                    modelShoppingList.get(listPosition).setSelected(true);
                }
            }
        });
 
        return convertView;
    }
 
    private class ViewHolder {
 
        protected CheckBox checkBox;
        private TextView shoppingitemText;
 
    }
 
}

Der Inhalt der View wird in der Funktion getView() programmiert. In der Funktion onClick() (aufgerufen durch einen OnClickListener auf der Checkbox) definieren wir, was passieren soll, wenn eine Checkbox angeklickt wird. Die Komponente der Layoutdatei (View) layout_row.xml wird in einer Variablenklasse von Holder in "holder.checkBox" gespeichert. Die Halter-Variable(n) werden in der Klasse ViewHolder in derselben Datei angelegt. Die Ansicht mit ihrem Inhalt wird als Tag gespeichert, der eine ID hat. Hier verwenden wir die ID 1.

Es wird empfohlen, die IDs für die Ansicht in der Datei "integer.xml" zu speichern. Sie müssen diese Datei im Verzeichnis res/values erstellen. Dort können Sie Integer-Werte speichern, auf die folgendermaßen im Java-Code zugegriffen werden kann: "R.integer.YOUR_ID"

Eine "integer.xml"-Datei sieht so aus:

<?xml version="1.0" encoding="utf-8"?>
<resources>
 
<integer name="MY_INTEGER_VARIABLE">1</integer>
 
</resources>

Sie können auch einige Funktionen in der Funktion onClick() in der oben erstellten Klasse "ShoppingAdapter.java" erweitern.
Wenn Sie Komponenten in der Listenzeile bearbeiten oder darauf zugreifen möchten, können Sie sie wie folgt aufrufen:

//(Einkaufslistenzeile) und Komponenten in der Ansicht durch diesen Befehl laden
View shoppingitemRow = (View) holder.checkBox.getTag(1);
TextView shoppingitemTextview = (TextView) shoppingitemRow.findViewById(R.id.shoppingitem);

Die TextView shoppingitemTextview bezieht sich auf die aktuelle Zeile in der Zeilenaufbauansicht der erstellten Listenansicht für diese Einkaufslisten-App. Sie können nun die Textansicht (hier den Textnamen eines Einkaufsartikels) des Artikels einer Zeile bearbeiten, in der das Kontrollkästchen angeklickt wurde.

Hinzufügen der Listenansicht zur Haupt-Activity-Klasse "MainActivity.java".

Fügen Sie diesen folgenden Code in der Klasse "MainActivity" hinzu:

import android.content.Intent;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.ListView;
import java.util.ArrayList;
 
public class MainActivity extends AppCompatActivity {
 
    private ListView shoppingListView;
    public static ArrayList<Shopping> shoppingListArray;
    private ShoppingAdapter shoppingAdapter;
    private String[] shoppingitemslist = new String[]{"Ice Cream", "Apple", "Chocolate", "Cheese", "Watermelon", "Salad"};
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        //ListView erstellen
        shoppingListView = (ListView) findViewById(R.id.shoppinglistview);
 
        //ListView konfigurieren
        shoppingListArray = createAndGetShoppinglistModel(false);
        shoppingAdapter = new ShoppingAdapter(this, this.shoppingListArray);
        shoppingListView.setAdapter(this.shoppingAdapter);
    }
 
     /**
    * Erstellt eine Liste von Einkaufsartikelzeilen aus einem definierten String-Array  "shoppingitemslist".
    **/
    private ArrayList<Shopping> createAndGetShoppinglistModel(boolean isSelect){
        ArrayList<Shopping> shoppingList = new ArrayList<>();
        for(int i = 0; i < 6; i++){
 
            Shopping shopping = new Shopping();
            shopping.setMarked(isSelect);
            shopping.setShoppingItem(shoppingList[i]);
            shoppingList.add(shopping);
        }
        return list;
    }
 
}

Die Daten für die Listenansicht werden in der Funktion onCreate() hinzugefügt, da die Listenansicht direkt nach dem Start der App angezeigt wird. Die ListView erhält einen Adapter (hier den erstellten "shoppingAdapter"), der die Daten (Komponenten, Werte in Zeilen) der Listenansicht verwaltet.
Hier wird aus einem definierten String-Array "shoppingitemslist" das Listenarray "shoppingListArray" erstellt, das die Elemente der Einkaufsliste enthält.

Sie können die Anwendung auch erweitern, um Daten aus einer Datenbank zu laden. Das Speichern und Laden von Daten aus der Datenbank in Android wird in einem weiteren Tutorial auf dieser Seite erwähnt, das Sie hier finden:
https://ard-site.net/tutorials/android/room-database-app-to-save-data-in-a-database-format-more-easily

Wenn Sie mehr über den hier verwendeten ListView oder BaseAdapter erfahren möchten, dann besuchen Sie bitte diese Seiten:

Mehr über ListView:
https://developer.android.com/reference/android/widget/ListView

Mehr über BaseAdapter:
https://developer.android.com/reference/android/widget/BaseAdapter

Kategorie: Android