title: Same elevation of views looks different for top and bottom views
body: <p>Recently, I stunned with a problem. On my android phone elements of the list or scroll views with the same elevation have different shadows related to their positioning. For example, <strong>views on the top of the screen</strong> have a small light shadow, whenever <strong>views on the bottom of the screen</strong> have more dark and strong shadow. Here is a screenshot from Google Keep application:</p>
  
  <p><a href="https://i.stack.imgur.com/p7OEx.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/p7OEx.jpg" alt="If you will look at first card view and last one, you will see different shadows"></a></p>
  
  <p>So, I thought that this is because of exactly Google Keep application. Maybe guys from Google decided to do that trick with shadows for their application. Thus, I created a sample application.</p>
  
  <p><strong>My layout:</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;LinearLayout
      xmlns:android="http://schemas.android.com/apk/res/android"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:orientation="vertical"&gt;
  
      &lt;TextView
          style="@style/AppButton"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="16dp"
          android:text="Test"/&gt;
  
      &lt;TextView
          style="@style/AppButton"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="16dp"
          android:text="Test"/&gt;
  
      &lt;TextView
          style="@style/AppButton"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="16dp"
          android:text="Test"/&gt;
  
      &lt;TextView
          style="@style/AppButton"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="16dp"
          android:text="Test"/&gt;
  
      &lt;TextView
          style="@style/AppButton"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="16dp"
          android:text="Test"/&gt;
  
      &lt;TextView
          style="@style/AppButton"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="16dp"
          android:text="Test"/&gt;
  
      &lt;TextView
          style="@style/AppButton"
          android:layout_width="match_parent"
          android:layout_height="wrap_content"
          android:layout_margin="16dp"
          android:text="Test"/&gt;
  
  &lt;/LinearLayout&gt;
  </code></pre>
  
  <p><strong>My styles:</strong></p>
  
  <pre><code>&lt;?xml version="1.0" encoding="utf-8"?&gt;
  &lt;resources&gt;
  
      &lt;!-- Base application theme. --&gt;
      &lt;style name="AppTheme" parent="Theme.AppCompat.Light.DarkActionBar"&gt;
          &lt;!-- Customize your theme here. --&gt;
          &lt;item name="colorPrimary"&gt;@color/colorPrimary&lt;/item&gt;
          &lt;item name="colorPrimaryDark"&gt;@color/colorPrimaryDark&lt;/item&gt;
          &lt;item name="colorAccent"&gt;@color/colorAccent&lt;/item&gt;
      &lt;/style&gt;
  
      &lt;style name="AppButton"&gt;
          &lt;item name="android:background"&gt;@color/colorAccent&lt;/item&gt;
          &lt;item name="android:elevation"&gt;4dp&lt;/item&gt;
          &lt;item name="android:gravity"&gt;center&lt;/item&gt;
          &lt;item name="android:padding"&gt;16dp&lt;/item&gt;
          &lt;item name="android:textColor"&gt;@android:color/white&lt;/item&gt;
      &lt;/style&gt;
  
  &lt;/resources&gt;
  </code></pre>
  
  <p><strong>And the output is:</strong></p>
  
  <p><a href="https://i.stack.imgur.com/evLVy.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/evLVy.jpg" alt="enter image description here"></a></p>
  
  <p>As you see, we have the same effect (top view has a small shadow, bottom view have a big shadow). So my questions are:</p>
  
  <ol>
  <li>What I did wrong?</li>
  <li>How can I achieve the same shadow for all views (not different by their positions)?</li>
  <li>Also, I haven't found any explanations in docs, so where I can read about that phenomenon?</li>
  <li>Does it happen on all devices or only on specific? </li>
  </ol>
  
  <p><strong>P.S.:</strong> I have <em>Nexus 5X, Android 7.1.2</em>.</p>
  
  <p><strong>UPD:</strong>
  An important mention that from Android Studio Preview Window everything is fine. Every view has the same shadow as other. But on a real device, you can see the difference.</p>