Merge "docs: Fixing doc issue with Android TV overscan margin recommendations." into mnc-docs
diff --git a/docs/html/design/tv/images/overscan.png b/docs/html/design/tv/images/overscan.png
index fb7e4bc..7957e97 100644
--- a/docs/html/design/tv/images/overscan.png
+++ b/docs/html/design/tv/images/overscan.png
Binary files differ
diff --git a/docs/html/design/tv/style.jd b/docs/html/design/tv/style.jd
index dd10a8a..4c43983 100644
--- a/docs/html/design/tv/style.jd
+++ b/docs/html/design/tv/style.jd
@@ -51,9 +51,11 @@
 
 <img src="{@docRoot}design/tv/images/overscan.png" alt="Overscan borders for TV" />
 
-<p>Build a 10% margin into your TV screen designs to account for overscan area the TV may not
-  display correctly. On a 1920 x 1080 pixel screen, this margin should be a minimum of 27px from the
-  top and bottom edges and a minimum of 48px from the right and left edges of the picture.</p>
+<p>Build a 5% margin into your TV screen designs to account for overscan area the TV may not
+  display correctly. On a 1920 x 1080 screen, this margin should be a minimum of 27 pixels
+  from the top and bottom edges and a minimum of 48 pixels from the right and left edges of the
+  picture.
+  </p>
 
 
 <h2>Color</h2>
diff --git a/docs/html/training/tv/start/layouts.jd b/docs/html/training/tv/start/layouts.jd
index 2b190b4..4ca77d0 100644
--- a/docs/html/training/tv/start/layouts.jd
+++ b/docs/html/training/tv/start/layouts.jd
@@ -117,25 +117,43 @@
   This behavior is generally referred to as <em>overscan</em>.
 </p>
 
-<p>
-  Avoid screen elements being clipped due to overscan and by incorporating a 10% margin
-  on all sides of your layout. This translates into a 48dp margin on the left and right edges and
-  a 27dp margin on the top and bottom of your base layouts for activities. The following
-  example layout demonstrates how to set these margins in the root layout for a TV app:
+<p>Screen elements that must be visible to the user at all times should be positioned within the
+overscan safe area. Adding a 5% margin of 48dp on the left and right edges and 27dp on the top and
+bottom edges to a layout ensures that screen elements in that layout will be within the overscan
+safe area.
+</p>
+
+<p>Background screen elements that the user doesn't directly interact with should not be adjusted or
+clipped to the overscan safe area. This approach ensures that background screen elements look
+correct on all screens.
+</p>
+
+<p>The following example shows a root layout that can contain background elements, and a nested
+child layout that has a 5% margin and can contain elements within the overscan safe area:
 </p>
 
 <pre>
 &lt;?xml version="1.0" encoding="utf-8"?&gt;
-&lt;LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
-  android:id="@+id/base_layout"
-  android:layout_width="match_parent"
-  android:layout_height="match_parent"
-  android:orientation="vertical"
-  android:layout_marginTop="27dp"
-  android:layout_marginLeft="48dp"
-  android:layout_marginRight="48dp"
-  android:layout_marginBottom="27dp" &gt;
-&lt;/LinearLayout&gt;
+&lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+   android:layout_width="match_parent"
+   android:layout_height="match_parent"
+   &gt;
+
+   &lt;!-- Screen elements that can render outside the overscan safe area go here --&gt;
+
+   &lt;!-- Nested RelativeLayout with overscan-safe margin --&gt;
+   &lt;RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
+       android:layout_width="match_parent"
+       android:layout_height="match_parent"
+       android:layout_marginTop="27dp"
+       android:layout_marginBottom="27dp"
+       android:layout_marginLeft="48dp"
+       android:layout_marginRight="48dp"&gt;
+
+      &lt;!-- Screen elements that need to be within the overscan safe area go here --&gt;
+
+   &lt;/RelativeLayout&gt;
+&lt;/RelativeLayout&gt;
 </pre>
 
 <p class="caution">