How to add background color to RelativeLayout borders?

Question

I want to display background color #df0031 to my RelativeLayout borders so that my whole Android screen will have background #df0031 including borders that is having white color right now.

Please see above screenshot and help me update my XML in such a way so that borders of the Android Screen will have the background color #df0031 matching with the rest of the screen instead of #ffffff.

Layout (XML):

<FrameLayout 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"
tools:context="in.sitemakers.sitemakers.HomeFragment"
android:background="@color/colorBgHome"
>

<TextView
    android:id="@+id/home_heading"
    android:layout_marginTop="10dp"
    android:text="WE CREATE AWESOME WEB SITES"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColor="@color/colorTextHome"
    />
<TextView
    android:layout_below="@+id/home_heading"
    android:id="@+id/home_text"
    android:layout_marginTop="28dp"
    android:text="Lorem ipsum dolor sit amet, consectetur adipiscing elit, 
    sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut 
    enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut 
    aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit 
    in voluptate velit esse cillum dolore eu fugiat nulla pariatur."
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:textColor="@color/colorTextHome"
    />
    <ImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:src="@drawable/main_device_image"
    android:textColor="@color/colorTextHome"
    />
</FrameLayout>

Colors.xml

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <color name="colorPrimary">#3F51B5</color>
    <color name="colorPrimaryDark">#303F9F</color>
    <color name="colorAccent">#FF4081</color>
    <color name="colorBgHome">#df0031</color>
    <color name="colorTextHome">#ffffff</color>
</resources>

content_main.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="in.sitemakers.sitemakers.MainActivity"
tools:showIn="@layout/app_bar_main">

<FrameLayout
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

</RelativeLayout>

Thanks for your time.

Answer 1

Edit your content_main file to remove the padding that is causing the white borders.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="@string/appbar_scrolling_view_behavior"
tools:context="in.sitemakers.sitemakers.MainActivity"
tools:showIn="@layout/app_bar_main">

<FrameLayout
    android:id="@+id/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"/>

</RelativeLayout>