如何在BottomNavigationView上方显示Snackbar并移动FAB?

时间:2019-05-08 12:35:33

标签: android android-layout android-fragments bottomnavigationview android-snackbar

这与许多问题相似,但我遇到了一些不同的情况。首先让我解释一下场景,我有一个MainActivity和BottomNavigationView&FrameLayout,用于根据BottomNavigation项目的单击切换片段。其中一个片段具有FAB,在这个片段中,我需要显示Snackbar。

到目前为止我已经尝试过的,
1)在另一个FrameLayout中添加了BottomNavigationView,但是SnackBar重叠了。
2)将BottomBar添加到子CoordinatorLayout中,并且Snackbar位于Bottombar后面

以下是MainActivity和Fragment的XML

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".activities.HomeActivity">

<FrameLayout
    android:id="@+id/frame_container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="@string/appbar_scrolling_view_behavior" />

<android.support.design.widget.BottomNavigationView
    android:id="@+id/navigation"
    android:layout_width="match_parent"
    android:layout_height="50dp"
    android:layout_gravity="bottom"
    android:elevation="5dp"
    android:background="@android:color/white"
    app:itemBackground="@android:color/white"
    android:foreground="?attr/selectableItemBackground"
    app:labelVisibilityMode="labeled"
    app:itemTextColor="@color/darkestGrey"
    app:menu="@menu/navigation" />

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

这是片段布局:

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/coordinator_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".fragments.PayloadsFragment">

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

        <FrameLayout
            android:id="@+id/toolbar_container"
            android:layout_width="match_parent"
            android:layout_height="wrap_content">

            <android.support.v7.widget.Toolbar
                android:id="@+id/payloads_toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                android:background="@color/colorPrimary"
                app:title="@string/overview"
                app:titleTextColor="@color/white"
                app:popupTheme="@style/AppTheme.PopupOverlay" />

            <com.miguelcatalan.materialsearchview.MaterialSearchView
                android:id="@+id/search_view"
                android:hint="@string/hint_search_payload"
                android:layout_width="match_parent"
                android:layout_height="wrap_content" />
        </FrameLayout>


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

    <include layout="@layout/content_main" />

    <include layout="@layout/bottom_filter_sheet" />

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

content_main.xml

<?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"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_marginBottom="51dp"
    android:background="@color/white"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:context=".activities.HomeActivity">

    <TextView
        android:id="@+id/txt_stick_status_title"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_marginStart="@dimen/padd_10"
        android:layout_marginTop="@dimen/padd_10"
        android:fontFamily="sans-serif-medium"
        android:maxLines="2"
        android:text="@string/str_stick"
        android:textColor="@color/item_name"
        android:textSize="17sp" />

    <TextView
        android:id="@+id/txt_stick_status_value"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_marginStart="5dp"
        android:layout_marginTop="9dp"
        android:layout_toEndOf="@id/txt_stick_status_title"
        android:fontFamily="sans-serif-medium"
        android:maxLines="2"
        android:text="@string/str_stick_not_available"
        android:textColor="@color/darkestGrey"
        android:textSize="18sp" />

    <ImageButton
        android:id="@+id/btn_connect_stick"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginStart="@dimen/title_margin"
        android:layout_marginTop="9dp"
        android:layout_toEndOf="@+id/txt_stick_status_value"
        android:background="@null"
        android:scaleType="centerCrop"
        app:srcCompat="@drawable/ic_disconnected" />


    <ImageButton
        android:id="@+id/btn_filter"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_marginTop="8dp"
        android:layout_marginEnd="@dimen/padd_10"
        android:background="@drawable/bg_grey_rounded_border"
        android:padding="6dp"
        app:srcCompat="@drawable/ic_filter" />

    <ImageView
        android:id="@+id/img_filter_active"
        android:layout_width="25dp"
        android:layout_height="25dp"
        android:layout_alignParentEnd="true"
        android:padding="@dimen/small_5_margin"
        android:src="@drawable/ic_active_filter"
        android:visibility="gone" />

    <RelativeLayout
        android:id="@+id/layout_no_device_configure"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/btn_filter"
        android:layout_marginTop="@dimen/row_padding_vertical"
        android:background="@color/snackbar_bg"
        android:elevation="3dp"
        android:padding="@dimen/title_margin"
        android:visibility="visible">

        <TextView
            android:id="@+id/lbl_no_device_configure"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginStart="5dp"
            android:fontFamily="sans-serif-light"
            android:text="@string/lbl_no_device_configure"
            android:textColor="@color/white"
            android:textSize="16sp" />

        <TextView
            android:id="@+id/lbl_buy_input_stick_website"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentEnd="true"
            android:layout_marginStart="@dimen/activity_horizontal_margin"
            android:layout_marginEnd="5dp"
            android:ellipsize="end"
            android:fontFamily="sans-serif-medium"
            android:text="@string/lbl_tap_to_configure"
            android:textAllCaps="true"
            android:textColor="@color/colorAccent"
            android:textSize="16sp" />

    </RelativeLayout>

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/layout_no_device_configure">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:orientation="vertical">

            <TextView
                android:id="@+id/title_default_payloads"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:padding="@dimen/padd_10"
                android:text="@string/default_payloads_title"
                android:textColor="@color/item_name"
                android:textStyle="bold" />

            <android.support.v7.widget.RecyclerView
                android:id="@+id/payload_recycler_view_default_payloads"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="@dimen/small_5_margin"
                android:scrollbars="vertical" />

            <TextView
                android:id="@+id/title_custom_payloads"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="20dp"
                android:padding="@dimen/padd_10"
                android:text="@string/custom_payloads_title"
                android:textColor="@color/item_name"
                android:textStyle="bold" />

            <android.support.v7.widget.RecyclerView
                android:id="@+id/payload_recycler_view_custom_payloads"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:scrollbars="vertical" />
        </LinearLayout>

    </ScrollView>


    <android.support.design.widget.FloatingActionButton
        android:id="@+id/fb_add_payload"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_marginTop="@dimen/activity_horizontal_margin"
        android:layout_marginEnd="@dimen/activity_horizontal_margin"
        android:layout_marginBottom="10dp"
        app:backgroundTint="@color/colorAccent"
        app:fabSize="normal"
        app:maxImageSize="17dp"
        app:srcCompat="@drawable/ic_add" />


</RelativeLayout>

请告知是否需要其他信息。

任何帮助将不胜感激。

2 个答案:

答案 0 :(得分:1)

如果您从Fragment调用SnackBar,则可以执行以下操作:

private fun showSnackBarMessage() {
    val bottomNavView: BottomNavigationView = activity?.findViewById(R.id.bottom_nav)!!
    Snackbar.make(bottomNavView, "No data available", Snackbar.LENGTH_SHORT).apply {
        anchorView = bottomNavView
    }.show()
}

您可以从活动的布局中获取bottomNavView,然后将其用作SnackBar的锚点视图。现在,它将显示在底部导航栏

上方

答案 1 :(得分:0)

以编程方式显示小吃店时,请尝试以下操作:

 Snackbar snack = Snackbar.make(findViewById(R.id.coordinator_layout),
            successMessage, Snackbar.LENGTH_INDEFINITE);

    snack.setAction("Ok", v -> snack.dismiss());
    CoordinatorLayout.LayoutParams params = (CoordinatorLayout.LayoutParams)
            snack.getView().getLayoutParams();
    params.setAnchorId(R.id.navigation);
    params.anchorGravity = Gravity.TOP;
    params.gravity = Gravity.TOP;
    snack.getView().setLayoutParams(params);
    snack.show();