title: Animate replacement of one framelayout with two
body: <p>I have three framelayouts as shown in the code below. Initially, only one framelayout is to be shown and after clicking an item in it, it should exit slide down and two other framelayouts are supposed to slide up from the bottom of the screen.</p>
  
  <p>Replacing one framelayout with another is what we all do, but this sounds a bit trivial.</p>
  
  <p>Please help, how to implement this along with animations(slide up and slide down).
  I am talking about framelayouts with ids: primaryMenu, secondaryMenu and tertiaryMenu.</p>
  
  <p>activity_main.xml:</p>
  
  <pre><code>    &lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
  xmlns:app="http://schemas.android.com/apk/res-auto"
  android:layout_width="match_parent"
  android:id="@+id/parentLayout"
  android:layout_height="match_parent"
  android:animateLayoutChanges="true"
  android:background="@color/primaryDark"
  android:orientation="vertical"&gt;
  
  
  &lt;FrameLayout
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:layout_above="@+id/control_area"
      android:layout_below="@+id/button_container"
      android:background="@color/primaryDark"&gt;
  
      &lt;org.ArtIQ.rex.editor.view.imagezoom.ImageViewTouch
          android:id="@+id/main_image"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:layout_gravity="center" /&gt;
  
      &lt;org.ArtIQ.rex.editor.view.StickerView
          android:id="@+id/sticker_panel"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:layout_gravity="center"
          android:visibility="gone" /&gt;
  
      &lt;org.ArtIQ.rex.editor.view.CropImageView
          android:id="@+id/crop_panel"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:layout_gravity="center"
          android:visibility="gone" /&gt;
  
      &lt;org.ArtIQ.rex.editor.view.RotateImageView
          android:id="@+id/rotate_panel"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:layout_gravity="center"
          android:visibility="gone" /&gt;
  
      &lt;org.ArtIQ.rex.editor.view.TextStickerView
          android:id="@+id/text_sticker_panel"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:layout_gravity="center"
          android:visibility="gone" /&gt;
  
      &lt;org.ArtIQ.rex.editor.view.CustomPaintView
          android:id="@+id/custom_paint_view"
          android:layout_width="fill_parent"
          android:layout_height="fill_parent"
          android:layout_gravity="center"
          android:visibility="gone" /&gt;
  &lt;/FrameLayout&gt;
  
  
  &lt;LinearLayout
      android:layout_marginTop="@dimen/margin_3"
      android:id="@+id/control_area"
      android:layout_width="match_parent"
      android:layout_height="wrap_content"
      android:layout_alignParentBottom="true"
      android:orientation="vertical"&gt;
  
      &lt;FrameLayout
          android:id="@+id/tertiaryMenu"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          /&gt;
  
      &lt;FrameLayout
          android:id="@+id/secondaryMenu"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          /&gt;
  
      &lt;FrameLayout
          android:id="@+id/primaryMenu"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          /&gt;
  
  
  
  &lt;/LinearLayout&gt;
  </code></pre>
  
  <p></p>