title: Android - Remove Background from Circular Reveal (Lollipop)
body: <p>I'm in the process of converting my application to the new Material Design Pattern and I've noticed a minor annoyance. When I use the <a href="https://developer.android.com/training/material/animations.html#Reveal" rel="nofollow noreferrer">Reveal Effect</a> there is a white background behind the view before it transitions between visible and invisible. </p>
  
  <p>Currently it looks like this when it animates</p>
  
  <p><strong>Start</strong></p>
  
  <p><img src="https://i.stack.imgur.com/4uiIr.png" alt="start"></p>
  
  <p><strong>Middle</strong></p>
  
  <p><img src="https://i.stack.imgur.com/nxsLV.png" alt="middle"></p>
  
  <p><strong>Finish</strong></p>
  
  <p><img src="https://i.stack.imgur.com/Ez9HG.png" alt="finish"></p>
  
  <p><strong>XML</strong></p>
  
  <pre><code>&lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      xmlns:tools="http://schemas.android.com/tools"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="horizontal" &gt;
  
      &lt;include layout="@layout/actionbar_visualizer" /&gt;
  
      &lt;LinearLayout
          android:id="@+id/visualizerProductContainer"
          android:layout_width="280dp"
          android:layout_height="match_parent"
          android:layout_below="@id/visualizerActionBar"
          android:background="@color/black"
          android:gravity="left"
          android:orientation="vertical" &gt;
  
          &lt;TextView
              android:id="@+id/gridHeader"
              android:layout_width="match_parent"
              android:layout_height="wrap_content"
              android:background="@color/fifty_transparent_black"
              android:gravity="center"
              android:padding="10dp"
              android:text="@string/products"
              android:textColor="@color/white" /&gt;
  
          &lt;GridView
              android:id="@+id/productGrid"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:columnWidth="75dp"
              android:numColumns="auto_fit"
              android:paddingTop="10dp"
              android:stretchMode="columnWidth" /&gt;
      &lt;/LinearLayout&gt;
  
      ...
  
  &lt;/RelativeLayout&gt;
  </code></pre>
  
  <p><strong>Animation</strong></p>
  
  <pre><code>...
  mProductContainer = (LinearLayout)findViewById(R.id.visualizerProductContainer);
  ...
  
  private void showHideProducts() {
      if (mProductContainer.getVisibility() == View.VISIBLE) {
          int cx = (mProductContainer.getLeft() + mProductContainer.getRight()) / 8;
          int cy = (mProductContainer.getTop() + mProductContainer.getBottom()) / 8;
  
          int initialRadius = mProductContainer.getWidth();
  
          Animator anim = ViewAnimationUtils.createCircularReveal(mProductContainer, cx, cy, initialRadius, 0);
  
          anim.addListener(new AnimatorListenerAdapter() {
              @Override
              public void onAnimationEnd(Animator animation) {
                  super.onAnimationEnd(animation);
                  mProductContainer.setVisibility(View.GONE);
              }
          });
  
          anim.start();
      } else {
          int cx = (mProductContainer.getLeft() + mProductContainer.getRight()) / 8;
          int cy = (mProductContainer.getTop() + mProductContainer.getBottom()) / 8;
  
          int finalRadius = Math.max(mProductContainer.getWidth(), mProductContainer.getHeight());
  
          Animator anim = ViewAnimationUtils.createCircularReveal(mProductContainer, cx, cy, 0, finalRadius);
  
          mProductContainer.setVisibility(View.VISIBLE);
          anim.start();
      }
  }
  </code></pre>
  
  <p>So does anyone know a way of removing the background/making it transparent between animations?</p>