Fab внутри linearlayout, чтобы быть поверх фрагментов

В моем файле макета у меня есть LinearLayout в качестве родительского макета, в котором я отображал ImageView с помощью appBarLayout, и есть Tablayout, которые содержат listview. Мне нужно отображать FloatingActionButton во всех этих макетах.

Когда я включаю FAB в LinearLayout, он не отображает FAB.

Если я использую FrameLayout вместо LinearLayout в качестве родительского макета, он отображает fab, но искажает изображение и заставляет исчезнуть все другие представления (проверьте изображение: https://drive.google.com/file/d/1OTqXIMVGh_7sRtkLYu7Snn0fTP-e4VCE/view?usp=sharing). Пожалуйста, помогите мне в этом, вот мой xml-код:

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


    <android.support.design.widget.AppBarLayout
        android:layout_width="match_parent"
        android:layout_height="170dp"
        android:gravity="center"
        android:elevation="0dp"
        android:id="@+id/appbarid">
        <ImageView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:padding="10dp"
            android:src="@drawable/imagep"
            tools:ignore="contentDescription"/>

    </android.support.design.widget.AppBarLayout>
    <android.support.design.widget.TabLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:tabGravity="fill"
        app:tabMode="scrollable"
        android:id="@+id/tablayout_id"
        app:tabTextColor="@color/tabtextcolor"
        app:tabIndicatorColor="@color/tabindicatorcolor"
        android:background="@color/colorPrimary" />
    <android.support.v4.view.ViewPager
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:id="@+id/viewpager_id" >

</android.support.v4.view.ViewPager>

    <com.github.clans.fab.FloatingActionMenu
        android:id="@+id/menu"
        android:layout_above="@id/viewpager_id"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:layout_marginRight="10dp"
        android:layout_marginBottom="10dp"
        android:layout_marginLeft="10dp"
        fab:menu_fab_size="normal"
        fab:menu_showShadow="true"
        fab:menu_shadowColor="#66000000"
        fab:menu_shadowRadius="4dp"
        fab:menu_shadowXOffset="1dp"
        fab:menu_shadowYOffset="3dp"
        fab:menu_colorNormal="@color/colorPrimary"
        fab:menu_colorPressed="@color/colorAccent"
        fab:menu_colorRipple="#ffffff"
        fab:menu_animationDelayPerItem="50"
        fab:menu_icon="@drawable/plus"
        fab:menu_buttonSpacing="0dp"
        fab:menu_labels_margin="0dp"
        fab:menu_labels_showAnimation="@anim/fab_slide_in_from_right"
        fab:menu_labels_hideAnimation="@anim/fab_slide_out_to_right"
        fab:menu_labels_paddingTop="4dp"
        fab:menu_labels_paddingRight="8dp"
        fab:menu_labels_paddingBottom="4dp"
        fab:menu_labels_paddingLeft="8dp"
        fab:menu_labels_padding="8dp"
        fab:menu_labels_textColor="#FFFFFF"
        fab:menu_labels_textSize="14sp"
        fab:menu_labels_cornerRadius="3dp"
        fab:menu_labels_colorNormal="#333333"
        fab:menu_labels_colorPressed="#444444"
        fab:menu_labels_colorRipple="#66FFFFFF"
        fab:menu_labels_showShadow="true"
        fab:menu_labels_singleLine="false"
        fab:menu_labels_ellipsize="none"
        android:layout_gravity="bottom|right"
        fab:menu_labels_maxLines="-1"
        fab:menu_labels_position="left"
        fab:menu_openDirection="up"
        fab:menu_backgroundColor="@android:color/transparent"
        fab:menu_fab_label="Menu"
        fab:menu_fab_show_animation="@anim/my_show_animation"
        fab:menu_fab_hide_animation="@anim/my_hide_animation">


        <com.github.clans.fab.FloatingActionButton
            android:id="@+id/myFAB"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:fab_colorNormal="#2196f3"
            app:fab_colorPressed="#40c4ff"
            app:fab_colorRipple="#99FFFFFF"
            android:src="@drawable/parts"
            fab:fab_size="mini"
            fab:fab_label="Share the app with your friends" />

        <com.github.clans.fab.FloatingActionButton
            android:id="@+id/myFAB2"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:fab_colorNormal="#7e57c2"
            app:fab_colorPressed="#9575cd"
            app:fab_colorRipple="#99ffffff"
            android:src="@drawable/post"
            fab:fab_size="mini"
            fab:fab_label="Send Suggestion/Feedback" />

    </com.github.clans.fab.FloatingActionMenu>
    </LinearLayout>
0
0
217
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Измените верхний LinearLayout на CoordinatorLayout и добавьте app:layout_behavior="@string/appbar_scrolling_view_behavior" в FAB.

Вы должны поместить кнопку действия Floating внутри CoordinatorLayout вместе с вашим LinearLayout. Когда вы делаете это, кнопка действия всегда должна плавать сверху, и вы получите классное поведение, например, если вы показываете Toast to Fab автоматически перемещается вверх.

Прочтите это, чтобы получить некоторую помощь по реализации: https://material.io/develop/android/components/floating-action-button/

Другие вопросы по теме