android - Expand/collapse two CardViews inside a LinearLayout BUT keep both CardViews inside the screen boundaries -

it's been quite many hours working on , can't come solution.

i have linearlayout contains 2 cardviews. each cardview contains 2 relativelayouts. 1 relativelayout visible, has fixed height , clickable. second relativelayout can expanded/collapsed. xml structure goes this:

<linearlayout     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="match_parent"     android:orientation="vertical">      <android.support.v7.widget.cardview         android:id="@+id/cardview_one"         android:layout_width="match_parent"         android:layout_height="0dp"         android:layout_weight="1">          <linearlayout             android:layout_width="match_parent"             android:layout_height="match_parent"             android:orientation="vertical">              <relativelayout                 android:id="@+id/visible_part_one"                 android:layout_width="match_parent"                 android:layout_height="wrap_content"                 android:onclick="togglecardviews">                  <textview                     android:layout_width="wrap_content"                     android:layout_height="wrap_content"                     android:text="visible part one"/>              </relativelayout>              <com.github.aakira.expandablelayout.expandablerelativelayout                 android:id="@+id/expandable_layout_one"                 android:layout_width="match_parent"                 android:layout_height="wrap_content"                 app:ael_expanded="true"                 app:ael_duration="500"                 app:ael_interpolator="linear"                 app:ael_orientation="vertical">                  <textview                     android:layout_width="wrap_content"                     android:layout_height="wrap_content"                     android:text="expandable part one"/>              </com.github.aakira.expandablelayout.expandablerelativelayout>          </linearlayout>      </android.support.v7.widget.cardview>      <android.support.v7.widget.cardview         android:id="@+id/cardview_two"         android:layout_width="match_parent"         android:layout_height="wrap_content">          <linearlayout             android:layout_width="match_parent"             android:layout_height="match_parent"             android:orientation="vertical">              <relativelayout                 android:id="@+id/visible_part_two"                 android:layout_width="match_parent"                 android:layout_height="wrap_content"                 android:onclick="togglecardviews">                  <textview                     android:layout_width="wrap_content"                     android:layout_height="wrap_content"                     android:text="visible part two"/>              </relativelayout>              <com.github.aakira.expandablelayout.expandablerelativelayout                 android:id="@+id/expandable_layout_two"                 android:layout_width="match_parent"                 android:layout_height="wrap_content"                 app:ael_expanded="false"                 app:ael_duration="500"                 app:ael_interpolator="linear"                 app:ael_orientation="vertical">                  <textview                     android:layout_width="wrap_content"                     android:layout_height="wrap_content"                     android:text="expandable part two"/>              </com.github.aakira.expandablelayout.expandablerelativelayout>          </linearlayout>      </android.support.v7.widget.cardview>  </linearlayout> 

what want achieve click on collapsed cardvie expand it's expandable part, while collapsing collapsing other cardview. @ same time, want keep both cardviews inside screen boundaries. should that.

+--linearlayout---+ | +--cardview1---+| | |visible part  || | |--------------|| | |exppanded part|| | |80% of screen||| | |              || | +--------------+| |                 | | +--cardview2---+| | |visible part  || | |20% of screen || | +--------------+| +-----------------+ 

after user clicks on first cardview's visible part (vise versa):

+--linearlayout---+ | +--cardview1---+| | |visible part  || | |20% of screen || | +--------------+| | +--cardview2---+| | |visible part  || | |--------------|| | |exppanded part|| | |80% of screen||| | |              || | +--------------+| +-----------------+ 

for moment, in order keep both card views inside screen while collapsing or expanding, tried change cardviews weight attribute programmatically done this. solution keeps both cardviews inside screen transition animation not smooth @ all.i'm suspecting use of expandablerelativelayout causing problem.

anyone faced same problems , came solution? appreciated!!

well far there no answer. in meanwhile experimented alternatives. , found bottomsheet neat solution smooth animation.

the problem: challenge in case toggle between 2 expandable views make sure both of them remain within screen boundaries.

my initial solution (that did not work): used linearlayout parent view , set layout_weight attribute both child views. on click expand child view, other view collapsing , programmatically setting height each view. switch of views heights had bad transition animation.

the bottomsheet: solution worked me use of bottomsheetfrom android support library 23.2. layout consists of 2 viewgroups, top view , bottomsheet. when click 1 of them, bottomsheet expands or collapse accordingly. note top view not instance of expandableralativelayout anymore, rather linearlayout overlapped when bottomsheet expanded.