Coordinator Layout cuts off screen from bottom

Question

Here I'm hiding and showing TabLayout using CollapsingToolbarLayout inside CoordinatorLayout but it everytime cuts mobile device screen and shows of black color at bottom as

And I'm following this code for it. But its still getting space from bottom without any margin.

<?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"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical">

<android.support.design.widget.CoordinatorLayout
    android:id="@+id/main_content"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="0dp">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/id_appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/tab_green"
        android:paddingBottom="0dp"
        app:elevation="0dp">

        <android.support.design.widget.CollapsingToolbarLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_scrollFlags="scroll|enterAlways">

            <android.support.design.widget.TabLayout
                android:id="@+id/mainTabLayout"
                android:layout_width="match_parent"
                android:layout_height="58dp"
                android:layout_marginBottom="0dp"
                android:clickable="false"
                app:tabBackground="@drawable/selector_tab"
                app:tabGravity="fill"
                app:tabIndicatorColor="@color/green"
                app:tabIndicatorHeight="0dp"
                app:tabMaxWidth="72dp"
                app:tabMode="scrollable"
                app:tabPaddingEnd="0dp"
                app:tabPaddingStart="0dp" />

        </android.support.design.widget.CollapsingToolbarLayout>

        <RelativeLayout
            android:id="@+id/btn_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/transparent2">

            <View
                android:id="@+id/view_black"
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:background="@color/black_light"></View>

            <View
                android:id="@+id/view"
                android:layout_width="match_parent"
                android:layout_height="1dp"
                android:layout_below="@+id/view_black"
                android:background="@color/date_color"></View>

            <ImageButton
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_below="@+id/view"
                android:layout_centerHorizontal="true"
                android:background="@drawable/tap_icon"
                android:visibility="visible"
                app:layout_behavior="@string/appbar_scrolling_view_behavior" />
        </RelativeLayout>
    </android.support.design.widget.AppBarLayout>

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@color/white"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

        <com.cws.widget.NonSiwpablePager
            android:id="@+id/pager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/white"
            app:layout_behavior="@string/appbar_scrolling_view_behavior" />

    </RelativeLayout>
</android.support.design.widget.CoordinatorLayout>

<RelativeLayout
    android:id="@+id/relative_web"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:visibility="gone">

    <ImageView
        android:id="@+id/web_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@drawable/home"
        android:visibility="gone"></ImageView>

    <Button
        android:id="@+id/close_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:background="@android:color/transparent"
        android:text="@string/got_it"
        android:textColor="@color/green"
        android:textSize="@dimen/et_tSize_big"
        android:visibility="gone" />
</RelativeLayout>
</RelativeLayout>

Answer 1

I don't know what are you trying but just set this

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.SwipeRefreshLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:id="@+id/swipeContainer"
android:layout_width="match_parent"
android:layout_height="match_parent">

<android.support.design.widget.CoordinatorLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:id="@+id/tabanim_maincontent"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/white">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/tabanim_appbar"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">


        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:layout_collapseMode="parallax"
            app:layout_scrollFlags="scroll|enterAlways|enterAlwaysCollapsed">

            <!-- View that will be hidden when video goes fullscreen -->
            <RelativeLayout
                android:id="@+id/nonVideoLayout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/white">

                // your view

            </RelativeLayout>


        </RelativeLayout>


        /***
        Here You can add custom layout
        **/


        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@android:color/white"
            app:tabIndicatorColor="@android:color/holo_blue_light"
            app:tabSelectedTextColor="@color/black"
            app:tabTextColor="@color/black" />

    </android.support.design.widget.AppBarLayout>

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior" />

</android.support.design.widget.CoordinatorLayout>


</android.support.v4.widget.SwipeRefreshLayout>

Answer 2

Try doing this way-

<?xml version="1.0" encoding="utf-8"?>
    <android.support.design.widget.CoordinatorLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/main_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:padding="0dp">

        <android.support.design.widget.AppBarLayout
            android:id="@+id/id_appbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/tab_green"
            android:paddingBottom="0dp"
            app:elevation="0dp">

            <android.support.design.widget.CollapsingToolbarLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                app:layout_scrollFlags="scroll|enterAlways">

                <android.support.design.widget.TabLayout
                    android:id="@+id/mainTabLayout"
                    android:layout_width="match_parent"
                    android:layout_height="58dp"
                    android:layout_marginBottom="0dp"
                    android:clickable="false"
                    app:tabBackground="@drawable/selector_tab"
                    app:tabGravity="fill"
                    app:tabIndicatorColor="@color/green"
                    app:tabIndicatorHeight="0dp"
                    app:tabMaxWidth="72dp"
                    app:tabMode="scrollable"
                    app:tabPaddingEnd="0dp"
                    app:tabPaddingStart="0dp" />

            </android.support.design.widget.CollapsingToolbarLayout>

            <RelativeLayout
                android:id="@+id/btn_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/transparent2">

                <View
                    android:id="@+id/view_black"
                    android:layout_width="match_parent"
                    android:layout_height="1dp"
                    android:background="@color/black_light"></View>

                <View
                    android:id="@+id/view"
                    android:layout_width="match_parent"
                    android:layout_height="1dp"
                    android:layout_below="@+id/view_black"
                    android:background="@color/date_color"></View>

                <ImageButton
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_below="@+id/view"
                    android:layout_centerHorizontal="true"
                    android:background="@drawable/tap_icon"
                    android:visibility="visible"/>
            </RelativeLayout>
        </android.support.design.widget.AppBarLayout>

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="@color/white"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">

            <com.cws.widget.NonSiwpablePager
                android:id="@+id/pager"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:background="@color/white"
                 />        
    <RelativeLayout
        android:id="@+id/relative_web"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:visibility="gone">
        <ImageView
            android:id="@+id/web_view"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/home"
            android:visibility="gone"></ImageView>

        <Button
            android:id="@+id/close_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:layout_alignParentLeft="true"
            android:background="@android:color/transparent"
            android:text="@string/got_it"
            android:textColor="@color/green"
            android:textSize="@dimen/et_tSize_big"
            android:visibility="gone" />
    </RelativeLayout>
        </RelativeLayout>
    </android.support.design.widget.CoordinatorLayout>