Xamarin.Android
RecyclerView

Informazioni di base su RecyclerView

Questo è un esempio di utilizzo di Android Support Library V7 RecyclerView . Le librerie di supporto sono generalmente raccomandate perché forniscono versioni compatibili con le versioni precedenti di nuove funzionalità, forniscono utili elementi dell'interfaccia utente che non sono inclusi nel framework e forniscono una gamma di utilità che le app possono utilizzare.

Per ottenere il RecyclerView , installeremo i pacchetti necessari di Nuget. In primo luogo, cercheremo la v7 recyclerview . Scorri verso il basso fino a visualizzare la Xamarin Android Support Library - v7 RecyclerView . Selezionalo e fai clic su Aggiungi pacchetto .

In alternativa, Android Support Library V7 RecyclerView è disponibile come componente Xamarin. Per aggiungere il componente, fare clic con il tasto destro del mouse su Components all'interno del progetto Android in Esplora soluzioni e fare clic su Get More Components .

All'interno della finestra Component Store visualizzata, cercare RecyclerView. Nell'elenco di ricerca, selezionare Android Support Library V7 RecyclerView . Quindi fare clic su Add to App . Il componente viene aggiunto al progetto.

Il prossimo passo è aggiungere il RecyclerView a una pagina. All'interno del file axml (layout), possiamo aggiungere RecyclerView come di seguito.

<android.support.v7.widget.RecyclerView
        android:id="@+id/recyclerView"
        android:scrollbars="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

RecyclerView richiede l'impostazione di almeno due classi helper per l'implementazione dello standard di base: Adapter e ViewHolder . Adapter gonfia i layout degli articoli e associa i dati alle viste visualizzate in RecyclerView. ViewHolder cerca e memorizza i riferimenti delle viste. Il titolare della vista aiuta anche a rilevare i clic di visualizzazione delle voci.

Ecco un esempio di base di Adapter Class

public class MyAdapter : RecyclerView.Adapter
{
    string [] items;

    public MyAdapter (string [] data)
    {
        items = data;
    }

    // Create new views (invoked by the layout manager)
    public override RecyclerView.ViewHolder OnCreateViewHolder (ViewGroup parent, int viewType)
    {   
        // set the view's size, margins, paddings and layout parameters
        var tv = new TextView (parent.Context);
        tv.SetWidth (200);
        tv.Text = "";

        var vh = new MyViewHolder (tv);
        return vh;
    } 

    // Replace the contents of a view (invoked by the layout manager)
    public override void OnBindViewHolder (RecyclerView.ViewHolder viewHolder, int position)
    {
        var item = items [position];

        // Replace the contents of the view with that element
        var holder = viewHolder as MyViewHolder;
        holder.TextView.Text = items[position];
    }

    public override int ItemCount {
        get {
            return items.Length;
        }
    }
}

Nel metodo OnCreateViewHolder , prima gonfiamo una vista e creiamo un'istanza della classe ViewHolder. Questa istanza deve essere restituita. Questo metodo viene richiamato dall'adapter quando richiede una nuova istanza di ViewHolder. Questo metodo non verrà invocato per ogni singola cella. Una volta che RecyclerView ha abbastanza celle per riempire la vista, riutilizzerà le vecchie celle che vengono scorse dalla vista per ulteriori celle.

Il callback OnBindViewHolder viene richiamato da Adapter per visualizzare i dati nella posizione specificata. Questo metodo dovrebbe aggiornare il contenuto dell'elementoView per riflettere l'elemento nella posizione specificata.

Poiché la cella contiene solo un singolo TextView , possiamo avere un semplice ViewHolder come sotto.

public class MyViewHolder : RecyclerView.ViewHolder 
{
    public TextView TextView { get; set; }


    public MyViewHolder (TextView v) : base (v)
    {
        TextView = v;
    }
}

Il prossimo passo è collegare le cose in Activity .

RecyclerView mRecyclerView;
MyAdapter mAdapter;
protected override void OnCreate (Bundle bundle)
{
    base.OnCreate (bundle);
    SetContentView (Resource.Layout.Main);
    mRecyclerView = FindViewById<RecyclerView> (Resource.Id.recyclerView);

    // Plug in the linear layout manager:
    var layoutManager = new LinearLayoutManager (this) { Orientation = LinearLayoutManager.Vertical };
    mRecyclerView.SetLayoutManager (layoutManager);
    mRecyclerView.HasFixedSize = true;

    var recyclerViewData = GetData();
    // Plug in my adapter:
    mAdapter = new MyAdapter (recyclerViewData);
    mRecyclerView.SetAdapter (mAdapter);
}

string[] GetData()
{ 
     string[] data;
     .
     .
     .
     return data;
}

La classe LayoutManager è responsabile della misurazione e del posizionamento delle viste degli oggetti all'interno di un RecyclerView e della determinazione del criterio di riciclo delle viste degli articoli che non sono più visibili all'utente. Prima di RecyclerView , dovevamo usare ListView per disporre le celle come in un elenco a scorrimento verticale e GridView per visualizzare gli elementi in una griglia scorrevole bidimensionale. Ma ora possiamo realizzare entrambi con RecyclerView impostando un diverso LayoutManger. LinearLayoutManager organizza le celle come in un ListView e GridLayoutManager dispone le celle in modalità Grid.

RecyclerView con eventi Click

Questo esempio mostra come impostare Click EventHandlers in Xamarin.Android RecyclerView.

In Android Java , il modo per impostare un listener per un clic è utilizzare un onClickListener per la vista su cui verrà fatto clic, in questo modo:

ImageView picture = findViewById(R.id.item_picture);
picture.setOnClickListener(new View.OnClickListener() {
    public void onClick(View v) {
        // do stuff
    }
});

Tuttavia, in Xamarin.Android, il modo per impostare un listener per un evento Click è aggiungere un EventHandler, nei seguenti modi:

1.

ImageView picture = FindViewById<ImageView>(Resource.Id.item_picture);
picture.Click += delegate {
    // do stuff
};

2.

ImageView picture = FindViewById<ImageView>(Resource.Id.item_picture);
picture.Click += async delegate {
    // await DoAsyncMethod();
    // do async stuff
};

3.

ImageView picture = FindViewById<ImageView>(Resource.Id.item_picture);
picture.Click += Picture_Click;
... // rest of your method

private void Picture_Click(object sender, EventArgs e)
{
    // do stuff
}

Si noti che EventHandler viene aggiunto, non impostato. Se ClickHandler viene aggiunto all'interno di un metodo GetView da un adattatore GridView / ListView o da un metodo OnBindViewHolder da RecyclerView.Adapter, ogni volta che viene creata la vista dell'elemento verrà aggiunto un nuovo EventHandler. Dopo averlo fatto scorrere più volte, verranno aggiunti più EventHandler e, quando la vista viene cliccata, tutti verranno attivati.

Per evitare questo problema, EventHandlers deve essere annullato e sottoscritto successivamente nei metodi GetView o OnBindViewHolder. Inoltre, devono utilizzare il modo numero 3. per impostare EventHandler, altrimenti non sarà possibile annullare l'iscrizione a EventHandlers.

Di seguito è riportato un esempio di un RecyclerView.Adapter con eventi Click:

public class ViewHolderPerson : Android.Support.V7.Widget.RecyclerView.ViewHolder
{
    public View Item { get; private set; }
    public ImageView Picture { get; private set; }
    public TextView Name { get; private set; }

    public ViewHolderPerson(View itemView) : base(itemView)
    {
        this.Item = itemView;
        this.Picture = itemView.FindViewById<ImageView>(Resource.Id.Item_Person_Picture);
        this.Name = itemView.FindViewById<TextView>(Resource.Id.Item_Person_Name);
    }
}

public class AdapterPersons : Android.Support.V7.Widget.RecyclerView.Adapter
{
    private Context context;
    private Android.Support.V7.Widget.RecyclerView recyclerView;
    private List<Person> persons;

    public AdapterPersons(Context context, Android.Support.V7.Widget.RecyclerView recyclerView, List<Person> persons)
    {
        this.context = context;
        this.recyclerView = recyclerView;
        this.persons = persons;
    }

    public override int ItemCount => persons.Count;

    public override void OnBindViewHolder(RecyclerView.ViewHolder holder, int position)
    {
        Person person = this.persons[position];
        ((ViewHolderPerson)holder).Name.Text = person.Name;
        ((ViewHolderPerson)holder).Picture.SetImageBitmap(person.Picture);

        // Unsubscribe and subscribe the method, to avoid setting multiple times.
        ((ViewHolderPerson)holder).Item.Click -= Person_Click;
        ((ViewHolderPerson)holder).Item.Click += Person_Click;
    }

    private void Person_Click(object sender, EventArgs e)
    {
        int position = this.recyclerView.GetChildAdapterPosition((View)sender);
        Person personClicked = this.persons[position];
        if(personClicked.Gender == Gender.Female)
        {
            Toast.MakeText(this.context, "The person clicked is a female!", ToastLength.Long).Show();
        }
        else if(personClicked.Gender == Gender.Male)
        {
            Toast.MakeText(this.context, "The person clicked is a male!", ToastLength.Long).Show();
        }
    }

    public override RecyclerView.ViewHolder OnCreateViewHolder(ViewGroup parent, int viewType)
    {
        View itemView = LayoutInflater.From(parent.Context).Inflate(Resource.Layout.item_person, parent, false);
        return new ViewHolderPerson(itemView);
    }

}