Expanding/Collapsing CardView with click or swipe gesture (Android)?

Question

I'm looking for a solution to this that will allow me to expand a cardview to see more information and then easily collapse it. Google Keep has examples of cards like this. Anyone know how they do this? Would I create 2 versions of my cardview (one collapsed and one expanded) and then use an Animator class coupled with gesture methods to transition between the two views? I'm using a Recyclerview to hold my cardviews.

I found this if it is at all relevant: http://developer.android.com/training/animation/layout.html

There are two parts on the card view, top part which is always gonna be shown and a bottom part that will be hidden or shown, right? Then you can change the visibility of bottom part each time card is touched (or any other event) and make card view height `wrap_content`. If this works as you intent, then you can easily make this an animation by using `` and `` in an xml file inside your `anim` folder. Is this what you are asking for? If it is then let me know, I will post the code for it. — NecipAllef, Nov 24 '15 at 02:18

score 0 · Answer 1 · answered Jul 15 '16 at 08:15

<?xml version="1.0" encoding="utf-8"?>
<android.support.v7.widget.CardView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/tools"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="wrap_content">

<LinearLayout
android:layout_width="match_parent"
android:orientation="vertical"
android:animateLayoutChanges="true"
android:layout_height="match_parent">

<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content">
   //here put the view which is always visible
<LinearLayout
android:layout_width="match_parent"
android:visibilty="gone"
android:id="@+id/expandableLayout"
android:layout_height="wrap_content">
   //here put which will collapse and expand
</LinearLayout>
</android.support.v7.widget.CardView>

take a boolean isexpanded in you arraylist object class

  if (listobj.isexpanded)
    {
        holder.expandableLayout.setVisibility(View.VISIBLE);
    }
    else {
        holder.expandableLayout.setVisibility(View.GONE);
    }
    holder.cardView.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View v) {
            if (listobj.isexpanded)
            {
                holder.expandableLayout.setVisibility(View.GONE);
                listobj.isexpanded=false;
                notifyItemChanged(position);
            }
            else {
                holder.expandableLayout.setVisibility(View.VISIBLE);
                listobj.isexpanded=true;
                notifyItemChanged(position);
            }
        }
    });

try someting like this

Expanding/Collapsing CardView with click or swipe gesture (Android)?

1 Answers1