Xamarin.Android RecyclerView Basics


Example

This is an example of using Android Support Library V7 RecyclerView. Support libraries are generally recommended because they provide backward-compatible versions of new features, provide useful UI elements that are not included in the framework, and provide a range of utilities that apps can draw on.

To get the RecyclerView, we will install the necessary Nuget packages. First, we will search for v7 recyclerview. Scroll down until we see Xamarin Android Support Library - v7 RecyclerView. Select it and click Add Package.

enter image description here

Alternatively, Android Support Library V7 RecyclerView is available as a Xamarin component. In order to add the component, right-click on Components within the Android project in Solution explorer and click on Get More Components.

enter image description here

Within the Component Store window that appears, search for RecyclerView. In the search list, select Android Support Library V7 RecyclerView. Then click on Add to App. The component gets added to the project.

enter image description here

Next step is to add the RecyclerView to a page. Within the axml (layout) file, we can add RecyclerView as below.

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

RecyclerView requires at least two helper classes to be set-up for basic standard implementation viz: Adapter and ViewHolder. Adapter inflates item layouts and binds data to views that are displayed within a RecyclerView. ViewHolder looks up and stores view references. The view holder also helps with detecting item-view clicks.

Here is a basic example of 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;
        }
    }
}

In the OnCreateViewHolder method we first inflate a View and create an instance of the ViewHolder class. This instance has to be returned. This method is invoked by the Adapter when it requires a new instance of ViewHolder. This method won't be invoked for every single cell. Once RecyclerView has enough cells to fill the View, it will re-use the old cells that is scrolled out of the View for further cells.

The OnBindViewHolder callback is invoked by Adapter to display the data at the specified position. This method should update the contents of the itemView to reflect the item at the given position.

Since the cell contains just a single TextView, we can have a simple ViewHolder as below.

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


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

Next step is to wire-up things 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;
}

LayoutManager class is responsible for measuring and positioning item views within a RecyclerView as well as determining the policy for when to recycle item views that are no longer visible to the user. Before the RecyclerView, we had to use ListView to arrange cells in a s in a vertically scrolling list and GridViewto display items in a two-dimensional, scrollable grid. But now we can achieve both with RecyclerView by setting a different LayoutManger. LinearLayoutManager arranges cells as in a ListView and GridLayoutManager arranges cells Grid fashion.