Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

RecyclerView expandable cardView

I make small project with RecyclerView with CardView items inside. I created expandable card (expanded by pressing on small button inside the card). Each card always contain visible part (id:top_layout) and expandable part (id:expandable_part_layout).

Problem is that when I expand last item or item which after expand has bottom edge below bottom edge of RecyclerView (some part of item or expanded item is invisible to user) the RecyclerView should scroll up all items to show whole item that I expanded. I tried use scrollToPosition and similar methods to scroll to end of expanded card but without success.

So, my question is how to make that after I expand card scroll up RecyclerView about height of expanded part of card? - That is my idea, maybe someone has better solution.

<android.support.v7.widget.CardView xmlns:android="http://schemas.android.com/apk/res/android"
   xmlns:app="http://schemas.android.com/apk/res-auto"
   android:layout_width="match_parent"
   android:layout_height="wrap_content"
   app:cardCornerRadius="8px"
   app:cardPreventCornerOverlap="false">

<RelativeLayout 
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    >

    <RelativeLayout
        android:id="@+id/top_layout"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="false"
        android:layout_alignParentTop="true"
        >
             <!-- some other controls -->

            <ImageButton
                android:id="@+id/card_header_inner_expand_btn"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:background="?android:selectableItemBackground"
                android:clickable="true"
                android:padding="6dp"
                android:src="@drawable/expand_icon" />

    </RelativeLayout>

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/expandable_part_layout"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/top_layout"
        android:animateLayoutChanges="true"
        android:clickable="false"
        android:visibility="gone">

        <RadioGroup
            android:id="@+id/extened_stage_radiogroup"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentLeft="true"
            android:layout_centerVertical="true"
            android:orientation="vertical">

            <RadioButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

            <RadioButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

            <RadioButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"/>

        </RadioGroup>

      <!-- some other controls -->

    </RelativeLayout>
</RelativeLayout>

like image 340
Zbyszko Avatar asked Jul 28 '15 20:07

Zbyszko


2 Answers

What tecnique are you using in order to do that?

I was in the same situation but for me the problem were these functions ExpandAndCollapseViewUtil.expand() and ExpandAndCollapseViewUtil.collapse() from this tutorial Diseño Android: Tarjetas con CardView so I didn't use it. Instead of that I just show/hide the view of the cardview without any animation.

like image 154
Moisés Moreno Avatar answered Oct 21 '22 01:10

Moisés Moreno


You can use this lib instance your self developed way, try this:

STEP 1: Add below dependency to your build.gradle file:

**compile 'com.github.traex.expandablelayout:library:1.2.2'** use instead of
 compile 'com.github.traex.expandablelayout:library:1.3'

STEP 2: Add below View to Your card layout ,card_layout Must be look like this:

<com.andexert.expandablelayout.library.ExpandableLayout
    android:id="@+id/row_0"
    xmlns:expandable="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    expandable:headerLayout="@layout/YOUR_CARD_VIEW_UI"
    expandable:contentLayout="@layout/YOUR_CARD_VIEW_EXPANDED_UI"/>

STEP 3: In your define of RecyclerView remember to:

recList.setItemViewCacheSize(ITEMS_COUNT);

Feel free to Ask :-)

like image 33
Mahdi Astanei Avatar answered Oct 21 '22 00:10

Mahdi Astanei