Put LinearLayout with banner ad on the bottom of the screen

Question

i'm trying to put an ad on the bottom of the screen. There is a scrolling viewpager that should be upside the banner ad. Instead they are overlapping:

So the ads are behind the scrolling viewpager with RecyclerView...

this is the layout code:

<android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <include
            layout="@layout/toolbar_main"/>
        <RelativeLayout

            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|enterAlways">

            <ImageView
                android:id="@+id/tabImage"
                android:layout_width="100dp"
                android:layout_height="150dp"
                android:scaleType="centerCrop"
                android:layout_centerHorizontal="true"
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:text="Anime Title"
                android:id="@+id/tabTitle"
                android:layout_below="@id/tabImage"
                android:layout_centerHorizontal="true"
                android:gravity="center"/>

        </RelativeLayout>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="fixed"
            app:tabGravity="fill"/>

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

    <LinearLayout xmlns:ads="http://schemas.android.com/apk/res-auto"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center|bottom"
        android:background="#000000"
        android:orientation="vertical">

        <com.google.android.gms.ads.AdView
            android:id="@+id/adView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal|center"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            ads:adSize="BANNER"
            ads:adUnitId="@string/banner">
        </com.google.android.gms.ads.AdView>

    </LinearLayout>

    <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>

What i'm doing wrong?

Regards,

Answer 1

Try this layout:

<android.support.design.widget.CoordinatorLayout 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.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar">

        <include
            layout="@layout/toolbar_main"/>
        <RelativeLayout

            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|enterAlways">

            <ImageView
                android:id="@+id/tabImage"
                android:layout_width="100dp"
                android:layout_height="150dp"
                android:scaleType="centerCrop"
                android:layout_centerHorizontal="true"
                />

            <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:textAppearance="?android:attr/textAppearanceLarge"
                android:text="Anime Title"
                android:id="@+id/tabTitle"
                android:layout_below="@id/tabImage"
                android:layout_centerHorizontal="true"
                android:gravity="center"/>

        </RelativeLayout>

        <android.support.design.widget.TabLayout
            android:id="@+id/tabs"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            app:tabMode="fixed"
            app:tabGravity="fill"/>

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

    <LinearLayout xmlns:ads="http://schemas.android.com/apk/res-auto"
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#000000"
        android:orientation="vertical">

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

        <com.google.android.gms.ads.AdView
            android:id="@+id/adView"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal|center"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            ads:adSize="BANNER"
            ads:adUnitId="@string/banner">
        </com.google.android.gms.ads.AdView>

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

Answer 2

This is how I did it and it works perfectly. I use Relative Layout so you can easily position your views above and below others and pin views to the top of bottom tom of the screen. Also the way that you organize them makes a difference. Sorry I can't be more specific than that because I don't really understand why but it works. Check out my XML... this just happens to be my sw720 layout for 10 inch tablets. I should note I wasnt using recycler view but maybe you can get something out of this...

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:orientation="vertical"
tools:context="com.applications.app.BookActivity">

<android.support.v4.widget.DrawerLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/drawer_layout"
    app:layout_behavior="@string/appbar_scrolling_view_behavior">

<android.support.design.widget.AppBarLayout
    android:id="@+id/top_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:theme="@style/AppTheme.AppBarOverlay">

<android.support.v7.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?android:attr/actionBarSize"
    android:background="@color/app_bar"
    android:text="@string/app_name"
    app:titleTextAppearance="@style/ToolbarTitleTextTablet10Inch"
    android:theme="@style/TipCalcAppBarStyleTablet10Inch"
    app:popupTheme="@style/Theme.AppCompat.NoActionBar"/>

    <android.support.design.widget.TabLayout
        android:id="@+id/tabs"
        style="@style/TabLayoutTextTablet10Inch"
        android:layout_width="match_parent"
        app:tabTextAppearance="@style/CategoryTabTextAppearance"
        android:layout_height="36dp"
        app:tabPaddingStart="10dp"
        app:tabPaddingEnd="10dp"/>

    <RelativeLayout
        android:id="@+id/relative_layout_view_pager"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <android.support.v4.view.ViewPager
        android:id="@+id/viewpager"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/transparent"
        android:layout_above="@id/bottom_view"/>

    <com.google.android.gms.ads.AdView
        xmlns:ads="http://schemas.android.com/apk/res-auto"
        android:id="@+id/adView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        ads:adSize="SMART_BANNER"
        ads:adUnitId="@string/main_activity_banner">

    </com.google.android.gms.ads.AdView>

        <View
            android:id="@+id/bottom_view"
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:background="@android:color/transparent"
            android:layout_alignParentBottom="true"/>

    </RelativeLayout>

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

    <android.support.design.widget.NavigationView
        android:id="@+id/nav_view"
        android:layout_width="wrap_content"
        android:layout_height="match_parent"
        android:fitsSystemWindows="true"
        android:layout_gravity="start"
        app:headerLayout="@layout/nav_header_main"
        app:menu="@menu/activity_main_drawer"/>

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

</RelativeLayout>