title: Android draw over navigation-bar
body: <p>Good morning Stackers!</p>
  
  <p>I recently became a proud owner of a Galaxy S8. 
  However, I was kind of dissapointed in Samsungs Edge Lighting feature.
  So, I decided to throw myself into the world of android applications, and try to write a similar app myself.
  Proud to say that I got pretty far, but, I'm not just here to share my successess.</p>
  
  <p>My problem concerns the navigationbar. Since this is my first question on Stack, I'm not sure how to make this question organized, so I'll just put photo's here, with exeplenation underneath them.</p>
  
  <p>I apologize for using links instead of posting images directly. I'm new to Stack and therefor don't have enough reputation points to post images. Sadlife.</p>
  
  <p>This is a screenshot from my version of such a ring, without the navigationbar. </p>
  
  <p><a href="https://i.stack.imgur.com/AFjeF.png" rel="nofollow noreferrer">My app <em>without</em> navigation-bar</a></p>
  
  <p>Looks pretty good in my opinion! :3</p>
  
  <p>However, if I take that to an application that forces the navigationbar to be shown, my "overlay" gets pushed up, like so:</p>
  
  <p><a href="https://i.stack.imgur.com/BUl8w.png" rel="nofollow noreferrer">My app <em>with</em> navigation-bar</a></p>
  
  <p>Let me now explain what I have tried so far.
  Basically, I tried every combination of both View flags, as well as WindowManager.LayoutParams flags. I also messed around a lot with just the style of the overlay, in the XML file.</p>
  
  <p>The screenshots you see above were taken with the following configuration:</p>
  
  <p>For the LayoutParams:</p>
  
  <pre><code>WindowManager.LayoutParams params = new WindowManager.LayoutParams(
              WindowManager.LayoutParams.TYPE_SYSTEM_OVERLAY, 
              WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
                      | WindowManager.LayoutParams.FLAG_LAYOUT_ATTACHED_IN_DECOR
                      | WindowManager.LayoutParams.FLAG_FULLSCREEN
                      | WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE
                      | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION,
              PixelFormat.TRANSLUCENT
          );
  </code></pre>
  
  <p>For the View flags:</p>
  
  <pre><code>mTopView.setSystemUiVisibility(
              View.SYSTEM_UI_FLAG_FULLSCREEN
              | View.SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION
      );
  </code></pre>
  
  <p>And the XML style for the overlay:</p>
  
  <pre><code>&lt;style name="OverlayDialog" parent="android:style/Theme.Translucent.NoTitleBar"&gt;
      &lt;item name="android:statusBarColor"&gt;@android:color/transparent&lt;/item&gt;
      &lt;item name="android:windowBackground"&gt;@android:color/transparent&lt;/item&gt;
      &lt;item name="android:windowFrame"&gt;@null&lt;/item&gt;
      &lt;item name="android:navigationBarColor"&gt;@android:color/transparent&lt;/item&gt;
      &lt;item name="android:windowNoTitle"&gt;true&lt;/item&gt;
      &lt;item name="android:windowIsTranslucent"&gt;true&lt;/item&gt;
      &lt;item name="android:backgroundDimEnabled"&gt;false&lt;/item&gt;
      &lt;item name="android:windowTranslucentNavigation"&gt;true&lt;/item&gt;
  &lt;/style&gt;
  </code></pre>
  
  <p>The overlay Layout file itself looks like this:</p>
  
  <pre><code>&lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
      android:id="@+id/notification"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:layout_above="@android:id/navigationBarBackground"
      android:background="@android:color/transparent"
      android:clipToPadding="false"
      android:fitsSystemWindows="true"
      android:focusable="false"
      android:orientation="vertical"
      android:theme="@style/OverlayDialog" &gt;
  
  &lt;ImageView
      android:id="@+id/vector_drawable_image"
      android:layout_width="match_parent"
      android:layout_height="match_parent"
      android:clipToPadding="false"
      android:fitsSystemWindows="true"
      android:background="@drawable/vector_drawable"
      android:backgroundTint="@android:color/holo_blue_bright"
      android:backgroundTintMode="src_in"
      android:focusable="false"
      android:theme="@style/OverlayDialog"
      android:visibility="visible" /&gt;
  </code></pre>
  
  <p></p>
  
  <p>I have also tried the WindowManager.LayoutParams with an offset on the y-axis, to force it down. This does work, but when you then, when you open an app that doesn't have the notification-bar, the overlay get's pushed back down, going below the screen (wish I could post a screenshot). 
  Here is the code for that anyway:</p>
  
  <pre><code>WindowManager.LayoutParams params = new WindowManager.LayoutParams(-1, -1, 0, -100, 
          WindowManager.LayoutParams.TYPE_SYSTEM_OVERLAY, 
          WindowManager.LayoutParams.FLAG_LAYOUT_NO_LIMITS
                  | WindowManager.LayoutParams.FLAG_LAYOUT_ATTACHED_IN_DECOR
                  | WindowManager.LayoutParams.FLAG_FULLSCREEN
                  | WindowManager.LayoutParams.FLAG_NOT_TOUCHABLE
                  | WindowManager.LayoutParams.FLAG_TRANSLUCENT_NAVIGATION,
          PixelFormat.TRANSLUCENT
      );
  </code></pre>
  
  <p>So, to wrap things up, I leave you with the question:
  How do I create my layout such that it doesn't get pushed up by the navigationbar.</p>
  
  <p>If you need any more information, please don't hesitate to ask!
  Thanks in advance and take care!</p>