Макет с вкладками с рекламой внизу и кнопкой над ней

Question

Я создал макет с вкладками

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                xmlns:ads="http://schemas.android.com/apk/res-auto"
                android:layout_width="match_parent"
                android:layout_height="match_parent">

    <android.support.design.widget.CoordinatorLayout
            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.support.v7.widget.Toolbar
                    android:id="@+id/toolbar"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"/>

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

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

        <android.support.v4.view.ViewPager
                android:id="@+id/pager"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

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

    <com.google.android.gms.ads.AdView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_gravity="center"
            ads:adSize="SMART_BANNER"
            ads:adUnitId="@string/ad_id"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true">
    </com.google.android.gms.ads.AdView>

</RelativeLayout>

Одна из вкладок:

<RelativeLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:orientation="vertical"
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/image_section"
            android:layout_centerHorizontal="true"
            android:layout_centerVertical="true"
            android:orientation="vertical">
        <ImageView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/image"/>

        <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:id="@+id/text"
                android:gravity="center"/>
    </LinearLayout>

    <Button
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/button"
            android:layout_alignParentBottom="true"
            android:layout_centerHorizontal="true"
            android:gravity="center"/>

</RelativeLayout>

Проблема в том, что до загрузки объявления я могу видеть кнопку полностьюдно.Как сделать так, чтобы вкладка занимала ровно доступное пространство, а не весь экран?Точно так же, если бы я добавил кнопку и сделал ее сверху, вместо того, чтобы появляться под вкладками, она появляется полностью сверху.

РЕДАКТИРОВАТЬ: я хотел бы, чтобы это выглядело как это изображение

Кнопка является частью отображаемой вкладки, а объявление - частью основного макета.Проблема в том, что всякий раз, когда я устанавливаю кнопку на android:layout_alignParentBottom="true", я оказываюсь внизу и скрываюсь за рекламой.

Answer 1

Вы пробовали установить minHeight в вашем AdView?

Измените свой макет Tab на:

<LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/image_section"
    android:orientation="vertical">

<ImageView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/image"/>

<TextView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/text"
        android:gravity="center"/>

<View
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"/>

<Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/button"
        android:gravity="center"/>

</LinearLayout>

Answer 2

Измените корень основного макета на вертикальный LinearLayout вместо RelativeLayout.

Теперь у вас двое детей в LinearLayout, т. Е. CoordinatorLayout и AdView.

* 1009.* Поскольку вы хотите, чтобы AdView располагался ниже CoordinatorLayout и CordinatorLayout занимал остальное пространство,

установите высоту CoordinatorLayout равной android:layout_height="match_parent" с android:layout_weight="1", и проблема должнабыть исправленным.

Также измените высоту AppBarLayout и TabLayout на match_parent.

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

    <android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1">

        <android.support.design.widget.AppBarLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent">

            <android.support.v7.widget.Toolbar
                android:id="@+id/toolbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"/>

            <android.support.design.widget.TabLayout
                android:id="@+id/tabs"
                android:layout_width="match_parent"
                android:layout_height="match_parent"/>

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

        <android.support.v4.view.ViewPager
            android:id="@+id/pager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"/>

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

    <com.google.android.gms.ads.AdView
        android:layout_width="match_parent"
        android:layout_height="50dp"
        android:layout_gravity="center"
        ads:adSize="SMART_BANNER"
        ads:adUnitId="@string/ad_id">

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

</LinearLayout>

Нет необходимости изменять другой макет.Но я бы порекомендовал вам использовать LinearLayout в качестве корневого макета вместо RelativeLayout

Итак, вот изменения, которые я бы порекомендовал сделать в вашем макете вкладок:

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:id="@+id/image_section"
        android:orientation="vertical">

        <ImageView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/image"/>

        <TextView
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:id="@+id/text"
            android:gravity="center"/>
    </LinearLayout>

    <Button
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:id="@+id/button"
        android:layout_centerHorizontal="true"
        android:gravity="center"/>

</LinearLayout>

Редактировать:Прикрепленные изображения для лучшего понимания: