ListView w Android Studio - widoki wbudowane

Wykorzystanie widżetu ListView oraz wbudowanych fragmentów simple_list_item_1 oraz simple_list_item_2 do wyświetlania listy elementów.

package com.example.listviewexample 

import android.os.Bundle 
import android.widget.AdapterView 
import android.widget.ArrayAdapter 
import android.widget.ListView 
import android.widget.Toast 
import androidx.appcompat.app.AppCompatActivity 

class MainActivity : AppCompatActivity() { 
    override fun onCreate(savedInstanceState: Bundle?) { 
        super.onCreate(savedInstanceState) 
        setContentView(R.layout.activity_main) 
        
        // Pobieranie referencji do ListView 
        val listView: ListView = findViewById(R.id.listView) 

        // Lista elementów do wyświetlenia 
        val items = arrayListOf("Jabłko", "Banan", "Wiśnia", "Winogrono", "Pomarańcza") 

        // Adapter do połączenia danych z ListView 
        val adapter = ArrayAdapter(this, android.R.layout.simple_list_item_1, items) 
        listView.adapter = adapter 

        // Obsługa kliknięcia na element listy 
        listView.onItemClickListener = AdapterView.OnItemClickListener { _, _, position, _ -> 
            val selectedItem = items[position] 
            Toast.makeText(this, "Wybrałeś: $selectedItem", Toast.LENGTH_SHORT).show() 
        } 
    } 
} 

Wyjaśnienie kodu 

  1. ListView: Pobieramy referencję do widoku listy za pomocą findViewById(R.id.listView)
  1. ArrayAdapter: Tworzymy adapter, który połączy listę tekstową z ListView
  1. onItemClickListener: Obsługujemy kliknięcia na elementach listy, wyświetlając Toast

Plik wyglądu 

W pliku wyglądu należy dodać widok ListView z identyfikatorem np. listView, aby “połączyć go” z kodem powyżej. 

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="match_parent" 
    android:orientation="vertical"> 
    
    <ListView 
        android:id="@+id/listView" 
        android:layout_width="match_parent" 
        android:layout_height="match_parent"
    /> 
</LinearLayout>

Wbudowane widoki wiersza 

W Androidzie mamy dwa domyślne widoki wiersza: jednowierszowy i dwuwierszowy (tytuł i opis). Użycie ListView zawsze wymaga zdefiniowania adaptera łączącego strukturę danych (np. tablicę wartości) z widokiem. 

android.R.layout.simple_list_item_1 

Widok ten służy do wyświetlenia jednego wiersza danych. Jest przeznaczony do prostych pól tekstowych. Używamy go, gdy dane do wyświetlenia to tylko pojedynczy ciąg znaków (np. lista nazw owoców). 

Struktura XML (wbudowana, nie trzeba jej wkopiowywać)

<?xml version="1.0" encoding="utf-8"?> 
<TextView xmlns:android="http://schemas.android.com/apk/res/android" 
    android:id="@android:id/text1" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content" 
    android:padding="8dp" 
    android:textAppearance="?android:attr/textAppearanceListItemSmall" />

Użycie w kodzie

val adapter = ArrayAdapter(this, android.R.layout.simple_list_item_1, items)
listView.adapter = adapter

android.R.layout.simple_list_item_2 

Widok ten służy do wyświetlania dwóch wierszy danych: tekstu głównego (android.R.id.text1 - domyślnie większą czcionką) i tekstu dodatkowego (android.R.id.text2 - domyślnie mniejszą czcionką). Jest przeznaczony dla bardziej szczegółowych list (np. lista kontaktów z numerem telefonu). 

Struktura XML (wbudowana, nie trzeba jej wkopiowywać)

<?xml version="1.0" encoding="utf-8"?> 
<TwoLineListItem xmlns:android="http://schemas.android.com/apk/res/android" 
    android:layout_width="match_parent" 
    android:layout_height="wrap_content"> 

    <TextView 
        android:id="@android:id/text1" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:textAppearance="?android:attr/textAppearanceListItem" /> 

    <TextView 
        android:id="@android:id/text2" 
        android:layout_width="match_parent" 
        android:layout_height="wrap_content" 
        android:textAppearance="?android:attr/textAppearanceSmall" /> 

</TwoLineListItem>

Użycie w kodzie

Użycie tego widoku wymaga ArrayAdapter z Map<String, String> lub SimpleAdapter

val items = arrayListOf( 
    mapOf("title" to "Jabłko", "subtitle" to "Czerwony owoc"), 
    mapOf("title" to "Banan", "subtitle" to "Długi, żółty owoc") 
)

val adapter = SimpleAdapter( 
    this, 
    items, 
    android.R.layout.simple_list_item_2, 
    arrayOf("title", "subtitle"), 
    intArrayOf(android.R.id.text1, android.R.id.text2) 
) 

listView.adapter = adapter

Więcej informacji i źródła

Dodaj komentarz

Twój adres e-mail nie zostanie opublikowany. Wymagane pola są oznaczone *

This site uses Akismet to reduce spam. Learn how your comment data is processed.