Home > Mobile >  Multiple cards opening in RecyclerView when clicked on only Single card
Multiple cards opening in RecyclerView when clicked on only Single card

Time:02-15

I am trying to make a periodic table app. RecyclerView was used to display items in listed fashion. When an item is clicked then the hidden layout which contains element details changes from View.GONE to View.VISIBLE.

1st Item clicked

Problem is that when I click 1st item and then scroll then every 11th item is opened (11,21,31..) and when closed every 11th item is closed.

Code for hiding and unhiding the details layout:

    holder.element_single_card.setOnClickListener {

        if(holder.hidden_elements.visibility == View.GONE) {
            holder.hidden_elements.visibility = View.VISIBLE
        }
        else{
            holder.hidden_elements.visibility = View.GONE
        }
    }

Code of Parent Layout containing all text views for showing details of element

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@ id/element_hidden_information"
            android:visibility="gone"
            android:layout_below="@id/element_shown_information"
            >

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@ id/element_symbol"
                android:layout_centerHorizontal="true"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@ id/element_period"
                android:layout_below="@id/element_symbol"
                android:layout_centerHorizontal="true"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@ id/element_mass"
                android:layout_below="@id/element_period"
                android:layout_centerHorizontal="true"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@ id/element_density"
                android:layout_below="@id/element_mass"
                android:layout_centerHorizontal="true"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@ id/element_boiling_point"
                android:layout_below="@id/element_density"
                android:layout_centerHorizontal="true"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@ id/element_melting_point"
                android:layout_below="@id/element_boiling_point"
                android:layout_centerHorizontal="true"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@ id/element_electron_affinity"
                android:layout_below="@id/element_melting_point"
                android:layout_centerHorizontal="true"
                />
            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:id="@ id/element_summary"
                android:layout_below="@id/element_electron_affinity"
                android:layout_centerHorizontal="true"
                />

        </RelativeLayout>

11th Item automatically opened

How can I stop every 11th item from opening and what is the problem with my code?

CodePudding user response:

Ideally, you should have a Boolean type isExpanded variable in your model along with getter/setter methods. This variable will be responsible for storing the expanded state corresponding to each item.

From onClick call -

 myModel.setIsExpanded(true);

and write below code in onBindViewHolder()

if(myModel.getIsExpanded())
{
    holder.hidden_elements.visibility = View.VISIBLE
}
else
{
    holder.hidden_elements.visibility = View.GONE
}

Since RecyclerView reuses it's viewHolder objects, you can't rely on the earlier state of the View.

Let me know if you need any more clarification :)

CodePudding user response:

This is because when you scroll down the 11th element is reusing the same view as the 1st element(this is a desired android feature due to memory constraints) you need to reset the layout to View.GONE if the element you are trying to display is not in open state.

To do this you cannot rely on the view's current state as you are doing in OnClickListener and should instead maintain a state of selected or clicked in the list item itself that you are using to display the data.

Further documentation about view recycling can be found in the official Android docs.

  • Related