Creare elenchi dinamici con RecyclerView Parte di Android Jetpack.

Prova il metodo Scrivi
Jetpack Compose è il toolkit consigliato per la UI per Android. Scopri come utilizzare i layout in Compose.

RecyclerView semplifica la visualizzazione efficiente di grandi set di dati. Tu fornisci i dati e definire l'aspetto di ogni elemento, e la libreria RecyclerView crea dinamicamente gli elementi quando sono necessari.

Come suggerisce il nome, RecyclerView ricicla i singoli elementi. Quando l'elemento scorre fuori dallo schermo, RecyclerView non ne distrugge la visualizzazione. Invece, RecyclerView riutilizza la visualizzazione per i nuovi elementi che sono stati fatti scorrere sullo schermo. RecyclerView migliora le prestazioni e la reattività della tua app riduce il consumo energetico.

Classi chiave

Più corsi collaborano per creare il tuo elenco dinamico.

  • RecyclerView è la ViewGroup che contiene le visualizzazioni corrispondenti ai tuoi dati. È una visualizzazione stessa, quindi aggiungi RecyclerView al layout che aggiungeresti a qualsiasi altro elemento UI.

  • Ogni singolo elemento dell'elenco è definito da un oggetto view holder. Quando della vista creata, non sono associati ad alcun dato. Dopo il giorno viene creato il titolare della vista, RecyclerView lo associa ai propri dati. Tu definisci il titolare della vista estendendo RecyclerView.ViewHolder

  • RecyclerView richiede le viste e le associa ai propri dati. chiamando i metodi nell'adattatore. Definisci l'adattatore estendendo RecyclerView.Adapter

  • Lo strumento di gestione del layout consente di organizzare i singoli elementi dell'elenco. Puoi usare uno dei gestori del layout forniti dalla libreria RecyclerView oppure e definire la tua. I gestori dei layout si basano tutti LayoutManager una classe astratta.

Puoi vedere come tutti i pezzi si incastrano insieme nell'app di esempio RecyclerView (Kotlin) o App di esempio RecyclerView (Java).

Passaggi per implementare RecyclerView

Se utilizzerai RecyclerView, ci sono alcune cose da fare. Sono descritti dettagliatamente nelle sezioni seguenti.

  1. Decidi l'aspetto dell'elenco o della griglia. In genere, è possibile utilizzare uno dei gestori del layout standard della libreria RecyclerView.

  2. Progetta l'aspetto e il comportamento di ogni elemento nell'elenco. Sede su questo design, estendi la classe ViewHolder. La tua versione di ViewHolder fornisce tutte le funzionalità per gli elementi dell'elenco. Il titolare della vista è un wrapper attorno a un View, che è gestita da RecyclerView.

  3. Definisci il valore Adapter che associa i tuoi dati alle viste ViewHolder.

Sono disponibili anche personalizzazioni avanzate personalizzate che ti consentono di personalizzare RecyclerView in base alle tue esigenze specifiche.

Pianifica il layout

Gli elementi in RecyclerView sono disposti in base a un LayoutManager . La libreria RecyclerView mette a disposizione tre gestori del layout, che gestiscono situazioni di layout più comuni:

  • LinearLayoutManager dispone gli elementi in un elenco unidimensionale.
  • GridLayoutManager dispone gli elementi in una griglia bidimensionale:
    • Se la griglia è disposta in verticale, GridLayoutManager cerca di rendere tutti gli elementi in ogni riga hanno la stessa larghezza e altezza, ma righe diverse possono avere altezze diverse.
    • Se la griglia è disposta in orizzontale, GridLayoutManager cerca di rendere tutti gli elementi di ogni colonna hanno la stessa larghezza e altezza, ma differenti le colonne possono avere larghezze diverse.
  • StaggeredGridLayoutManager è simile a GridLayoutManager, ma non richiede che gli elementi in un riga hanno la stessa altezza (per le griglie verticali) o gli elementi nella stessa colonna abbiano la stessa larghezza (per le griglie orizzontali). Il risultato è che gli elementi in una riga o in una colonna possono finire con un offset l'uno dall'altro.

Devi anche progettare il layout dei singoli elementi. Ti serve quando progetti il contenitore della vista, come descritto nella sezione successiva.

Implementare l'adattatore e il supporto della vista

Una volta stabilito il layout, devi implementare Adapter e ViewHolder. Queste due classi collaborano per definire in che modo vengono visualizzati. ViewHolder è un wrapper attorno a un View che contiene il per un singolo elemento dell'elenco. L'Adapter crea ViewHolder oggetti in base alle esigenze e imposta anche i dati per quelle viste. Il processo di L'associazione di viste ai relativi dati prende il nome di binding.

Quando definisci l'adattatore, esegui l'override di tre metodi chiave:

  • onCreateViewHolder(): RecyclerView chiama questo metodo ogni volta che deve creare un nuovo ViewHolder. Il metodo crea e inizializza ViewHolder e il relativo View associato, ma non compila il valore della visualizzazione contenuti: l'elemento ViewHolder non è stato ancora associato a dati specifici.

  • onBindViewHolder(): RecyclerView chiama questo metodo per associare ViewHolder ai dati. La recupera i dati appropriati e li utilizza per riempire la vista del proprietario. Ad esempio, se RecyclerView mostra un elenco di nomi, il metodo potrebbe trovare il nome appropriato nell'elenco e compilare la visualizzazione widget TextView del titolare.

  • getItemCount(): RecyclerView chiama questo metodo per ottenere la dimensione del set di dati. Ad esempio: in un'app di rubrica, potrebbe essere il numero totale di indirizzi. RecyclerView lo utilizza per determinare quando non ci sono altri elementi che possono essere visualizzati.

Ecco un esempio tipico di un adattatore semplice con un elemento ViewHolder nidificato che mostra un elenco di dati. In questo caso, RecyclerView mostra un semplice elenco di elementi di testo. L'adattatore passa un array di stringhe contenenti il testo per gli elementi ViewHolder.

Kotlin


class CustomAdapter(private val dataSet: Array<String>) :
        RecyclerView.Adapter<CustomAdapter.ViewHolder>() {

    /**
     * Provide a reference to the type of views that you are using
     * (custom ViewHolder)
     */
    class ViewHolder(view: View) : RecyclerView.ViewHolder(view) {
        val textView: TextView

        init {
            // Define click listener for the ViewHolder's View
            textView = view.findViewById(R.id.textView)
        }
    }

    // Create new views (invoked by the layout manager)
    override fun onCreateViewHolder(viewGroup: ViewGroup, viewType: Int): ViewHolder {
        // Create a new view, which defines the UI of the list item
        val view = LayoutInflater.from(viewGroup.context)
                .inflate(R.layout.text_row_item, viewGroup, false)

        return ViewHolder(view)
    }

    // Replace the contents of a view (invoked by the layout manager)
    override fun onBindViewHolder(viewHolder: ViewHolder, position: Int) {

        // Get element from your dataset at this position and replace the
        // contents of the view with that element
        viewHolder.textView.text = dataSet[position]
    }

    // Return the size of your dataset (invoked by the layout manager)
    override fun getItemCount() = dataSet.size

}

Java


public class CustomAdapter extends RecyclerView.Adapter<CustomAdapter.ViewHolder> {

    private String[] localDataSet;

    /**
     * Provide a reference to the type of views that you are using
     * (custom ViewHolder)
     */
    public static class ViewHolder extends RecyclerView.ViewHolder {
        private final TextView textView;

        public ViewHolder(View view) {
            super(view);
            // Define click listener for the ViewHolder's View

            textView = (TextView) view.findViewById(R.id.textView);
        }

        public TextView getTextView() {
            return textView;
        }
    }

    /**
     * Initialize the dataset of the Adapter
     *
     * @param dataSet String[] containing the data to populate views to be used
     * by RecyclerView
     */
    public CustomAdapter(String[] dataSet) {
        localDataSet = dataSet;
    }

    // Create new views (invoked by the layout manager)
    @Override
    public ViewHolder onCreateViewHolder(ViewGroup viewGroup, int viewType) {
        // Create a new view, which defines the UI of the list item
        View view = LayoutInflater.from(viewGroup.getContext())
                .inflate(R.layout.text_row_item, viewGroup, false);

        return new ViewHolder(view);
    }

    // Replace the contents of a view (invoked by the layout manager)
    @Override
    public void onBindViewHolder(ViewHolder viewHolder, final int position) {

        // Get element from your dataset at this position and replace the
        // contents of the view with that element
        viewHolder.getTextView().setText(localDataSet[position]);
    }

    // Return the size of your dataset (invoked by the layout manager)
    @Override
    public int getItemCount() {
        return localDataSet.length;
    }
}

Il layout di ogni elemento di visualizzazione viene definito, come di consueto, in un file di layout XML. In questo caso, l'app ha un file text_row_item.xml simile al seguente:

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="@dimen/list_item_height"
    android:layout_marginLeft="@dimen/margin_medium"
    android:layout_marginRight="@dimen/margin_medium"
    android:gravity="center_vertical">

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="@string/element_text"/>
</FrameLayout>

Passaggi successivi

Il seguente snippet di codice mostra come utilizzare RecyclerView.

Kotlin


class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        val dataset = arrayOf("January", "February", "March")
        val customAdapter = CustomAdapter(dataset)

        val recyclerView: RecyclerView = findViewById(R.id.recycler_view)
        recyclerView.layoutManager = LinearLayoutManager(this)
        recyclerView.adapter = customAdapter

    }

}

Java


RecyclerView recyclerView = findViewById(R.id.recycler_view);
recyclerView.layoutManager = new LinearLayoutManager(this)
recyclerView.setAdapter(customAdapter);

La libreria offre anche molti modi per personalizzare l'implementazione. Per ulteriori informazioni informazioni, consulta la sezione Advanced RecyclerView personalizzazione.

Risorse aggiuntive

Per ulteriori informazioni sui test su Android, consulta le risorse che seguono.

App di esempio