如何在TabLayout的RelativeLayout中正常显示FAB（设备端消失问题）

我帮你排查了一下，核心问题出在TabLayout的布局高度设置上，另外还有ViewPager的高度配置需要调整——这两个问题直接导致你的Fragment内容（包括FAB）被挤压甚至完全不可见。

第一步：修复TabLayout的高度设置 #

在你的TabLayout父布局里，TabLayout的android:layout_height被设成了match_parent，这会让TabLayout占满整个屏幕的剩余空间，直接把下方的ViewPager挤得完全没有显示空间，自然Fragment里的内容和FAB都看不到。

把TabLayout的高度改成wrap_content：

<android.support.design.widget.TabLayout
    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:id="@+id/message_basket_tab_layout"
    android:layout_width="match_parent"
    android:layout_height="wrap_content" <!-- 这里改成wrap_content -->
    app:tabTextAppearance="@android:style/TextAppearance.Widget.TabWidget"
    android:background="@color/colorPrimaryDark"
    app:tabGravity="center"
    app:tabMaxWidth="0dp"
    app:tabMode="scrollable"
    app:tabSelectedTextColor="@color/muzima_theme_blue"
    app:tabTextColor="@android:color/white"
    tools:context="phr.muzima.org.phr.MessageBasketMainActivity">
</android.support.design.widget.TabLayout>

第二步：调整ViewPager的高度让它占满剩余空间 #

父布局是LinearLayout，现在要让ViewPager占据TabLayout下方的所有剩余空间，需要给它设置android:layout_weight="1"，同时把android:layout_height改成0dp：

<android.support.v4.view.ViewPager
    android:id="@+id/message_basket_view_pager"
    android:layout_width="match_parent"
    android:layout_height="0dp" <!-- 改成0dp -->
    android:layout_weight="1" /> <!-- 添加weight属性 -->

额外优化：避免EditText挤压FAB #

另外，你的Fragment布局里，两个EditText如果输入内容过多，可能会把FAB盖住。可以把EditText放在ScrollView中，确保FAB始终在底部可见：

修改Fragment的RelativeLayout布局：

<?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:id="@+id/compose_query_content_linear_layout"
    android:background="@color/colorPrimaryDark"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_above="@+id/query_floatingActionButton">
        
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <EditText
                android:id="@+id/query_subject_editText"
                android:hint="@string/query_subject_text"
                android:textColor="@android:color/white"
                android:textColorHint="@android:color/white"
                android:padding="16dp"
                android:ems="10"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />

            <EditText
                android:id="@+id/query_content_editText"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:ems="10"
                android:hint="@string/compose_query_content_text"
                android:padding="16dp"
                android:textColor="@android:color/white"
                android:textColorHint="@android:color/white" />
        </LinearLayout>
    </ScrollView>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/query_floatingActionButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentEnd="true"
        android:layout_marginBottom="16dp" <!-- 用标准边距更规范 -->
        android:layout_marginEnd="16dp"
        android:src="@drawable/ic_action_notifications_busket"
        android:tint="@android:color/white"
        app:borderWidth="4dp"
        app:fabSize="normal"
        app:rippleColor="@color/muzima_theme_blue" />

</RelativeLayout>

这样修改后，ViewPager就能正常显示Fragment内容，FAB也会稳定出现在标签页的底部，同时EditText内容过多时可以滚动，不会遮挡FAB。

内容的提问来源于stack exchange，提问作者Samuel Owino