Android FloatingActionButton with fragment and bottom navigation bar

Question

I'm creating an android app with the following structure:

The main activity has a bottom navigation bar switching between 3 different fragments
2 of the fragments are going to display lists of items, with a floating action button (FAB) to add new items
The 3rd fragment is going to show something different, that doesn't need a FAB.

Based on this, it seems like the FAB should "belong" to the list fragments, and not the main activity.

I am currently have the problem that the FAB hides itself behind the bottom navigation bar, as in this question. There is a nice solution there, but it depends on the the FAB being in the same layout as the bottom navigation bar.

Is there a way to get the FAB to not hide itself behind the bottom navigation, without moving the FAB up to the main activity (which breaks the modularity of the fragments)?

My activity layout is as follows:

<?xml version="1.0" encoding="utf-8"?>
<android.support.constraint.ConstraintLayout 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/container"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"/>

    <android.support.design.widget.BottomNavigationView
        android:id="@+id/navigation"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_marginStart="0dp"
        android:layout_marginEnd="0dp"
        android:background="?android:attr/windowBackground"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_insetEdge="bottom"
        app:menu="@menu/navigation" />

</android.support.constraint.ConstraintLayout>

where the "fragment container" is replaced by the selected fragment as below:

    TodoListFragment fragment = new TodoListFragment();

    //if we were started with an intent, pass on any special arguments
    fragment.setArguments(getIntent().getExtras());

    getSupportFragmentManager().beginTransaction()
            .replace(R.id.fragment_container, fragment)
            .commit();

and finally the fragment has layout as below:

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <android.support.v7.widget.RecyclerView 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/list"
        android:name="..."
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_marginLeft="16dp"
        android:layout_marginRight="16dp"
        app:layoutManager="LinearLayoutManager"
        tools:context=".TodoListFragment"
        tools:listitem="@layout/fragment_todolist_item" />

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/floatingActionButton"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="end|bottom"
        android:src="@drawable/ic_add_white_24dp"
        android:layout_margin="16dp" />

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

Ranjan · Accepted Answer · 2019-02-03 08:23:54Z

8

Problem is with your constraints. You are setting FrameLayout's height to match parent. Try this -

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/fragment_container"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        app:layout_constraintTop_toTopOf="parent"
        app:layout_constraintBottom_toTopOf="@id/navigation"/>

answered Feb 3, 2019 at 8:23

Ranjan

1,14610 silver badges22 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

Cody Over a year ago

This. It's tricky to figure this out because when you use Android Studio's project creation wizard and choose to start as a BottomNavigation app the pre-configured activity layout Google gives you has the fragment view's height set to match_parent instead of 0dp.

Collectives™ on Stack Overflow

Android FloatingActionButton with fragment and bottom navigation bar

1 Answer 1

1 Comment

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Linked

Related