Xamarin RecyclerView with button on item other items are clicked

Question

I have a Recyclerview with items who have some hidden extra description.

I put a button to reveal or hide the extra description.

It works ok, but the problem is that, If I press the first item, when I scroll I see some other items also revealed (for example if I press the first, it also reveals the 7, the 10, the 17 and the 20).

When I scroll back the revealed item is hidden again, that doesn't botter me, but it gives any info.

This is the code of the adapter

class ArticulosAdapter : RecyclerView.Adapter
{
    // Event handler for item clicks:
    public event EventHandler<int> ItemClick;

    // Underlying data set 
    public List<Articulo> listado;


    public ArticulosAdapter(List<Articulo> listadoArticulos)
    {
        listado = listadoArticulos;
    }

    // Create a new CardView (invoked by the layout manager): 
    public override ViewHolder OnCreateViewHolder(ViewGroup parent, int viewType)
    {
        // Inflate the CardView for the photo:
        View itemView = LayoutInflater.From(parent.Context).
                    Inflate(Resource.Layout.filaArticulo, parent, false);

        // Create a ViewHolder to find and hold these view references, and 
        ArticuloViewHolder vh = new ArticuloViewHolder(itemView,OnClick);
        vh.Arrow.Click += (o, e) =>
        {
            if (vh.Info.Visibility == ViewStates.Gone)
                vh.Info.Visibility = ViewStates.Visible;
            else
                vh.Info.Visibility = ViewStates.Gone;
        };
        return vh;
    }

    // Fill in the contents
    public override void OnBindViewHolder(ViewHolder holder, int position)
    {
        ArticuloViewHolder vh = holder as ArticuloViewHolder;
        if (listado[position].imagen != null)
            vh.Image.SetImageBitmap(listado[position].BitImage);
        vh.Caption.Text = listado[position].nombre;
        vh.Cantidad.Text = "DISPONIBLE :" + listado[position].cantidad;


    }
    void OnClick(int position)
    {
        if (ItemClick != null)
            ItemClick(this, position);
    }

    // Return the number of photos available in the photo album:
    public override int ItemCount
    {
        get { return listado.Count; }
    }

    public class ArticuloViewHolder : ViewHolder
    {
        public ImageView Image { get; private set; }
        public TextView Caption { get; private set; }
        public TextView Cantidad { get; private set; }
        public LinearLayout Info { get; private set; }
        public ImageButton Arrow { get; private set; }

        // Get references to the views defined in the CardView layout.
        public ArticuloViewHolder(View itemView, Action<int> listener)
            : base(itemView)
        {
            Image = itemView.FindViewById<ImageView>(Resource.Id.foto);
            Caption = itemView.FindViewById<TextView>(Resource.Id.nombre);
            Cantidad = itemView.FindViewById<TextView>(Resource.Id.cantidad);
            Arrow = itemView.FindViewById<ImageButton>(Resource.Id.arrowButt);
            Info = itemView.FindViewById<LinearLayout>(Resource.Id.infoLay);
            itemView.Click += (sender, e) => listener(base.Position);
        }
    }
}

And this is the code of the row

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout xmlns:card_view="http://schemas.android.com/apk/res-auto"
  xmlns:android="http://schemas.android.com/apk/res/android"
  android:layout_width="fill_parent"
  android:layout_height="wrap_content">
<android.support.v7.widget.CardView
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    card_view:cardElevation="4dp"
    card_view:cardUseCompatPadding="true"
    card_view:cardCornerRadius="5dp">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="vertical"
        android:padding="8dp">
        <ImageView
            android:layout_width="150px"
            android:layout_height="150px"
            android:id="@+id/foto"
            android:scaleType="centerCrop"
            android:layout_gravity="center"/>
        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:textAppearance="?android:attr/textAppearanceMedium"
            android:textColor="#333333"
            android:text="Caption"
            android:id="@+id/nombre"
            android:layout_gravity="center_horizontal"
            android:layout_marginLeft="4dp" />
    <LinearLayout
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:orientation="vertical"
          android:id="@+id/infoLay"
          android:visibility="gone"
          android:padding="8dp">
         <TextView
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:textAppearance="?android:attr/textAppearanceMedium"
              android:textColor="#333333"
              android:text="Caption"
              android:id="@+id/cantidad"
              android:layout_gravity="center_horizontal"
              android:layout_marginLeft="4dp" />
      </LinearLayout>

      <ImageButton
            android:id="@+id/arrowButt"
            android:layout_width="match_parent"
            android:src="@drawable/down"
            android:layout_height="50dp"/>
      </LinearLayout>
</android.support.v7.widget.CardView>   

Answer 1

The other revealed items are the ones using the same (recycled) view holder and views. You need to (re)set the visibility of the Info part in OnBindViewHolder().

In your case, as you don't mind if the item is hidden again when scrolling back, you can simply do something like :

public override void OnBindViewHolder(ViewHolder holder, int position)
{
    ...

    vh.Info.Visibility = ViewStates.Gone
}