Search code examples
androidandroid-coordinatorlayoutfloating-action-button

Stopping a FAB from changing its size


I've anchored a floating action button to a collapsing toolbar. When my activity starts my FAB is a normal size and anchored to the bottom right.

Activity Start

When I collapse the toolbar the FAB disappears.

Toolbar Collapsed

I'd prefer to keep the FAB and not have it disappear when the toolbar collapses. I'm not sure how to do this. Can anyone help me with how to do that?

My layout:

 <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:background="@android:color/background_light"
    android:fitsSystemWindows="true">

    <android.support.design.widget.AppBarLayout
        android:id="@+id/main.appbar"
        android:layout_width="match_parent"
        android:layout_height="300dp"
        android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"
        android:fitsSystemWindows="true"
        >
        <android.support.design.widget.CollapsingToolbarLayout
            android:id="@+id/main_collapsing"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:layout_scrollFlags="scroll|exitUntilCollapsed"
            app:contentScrim="?attr/colorPrimary"
            >

            <ImageView
                android:id="@+id/photo"
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:scaleType="centerCrop"
                android:fitsSystemWindows="true"
                app:layout_collapseMode="parallax"
                />

            <android.support.v7.widget.Toolbar
                android:id="@+id/main.toolbar"
                android:layout_width="match_parent"
                android:layout_height="?attr/actionBarSize"
                app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
                app:layout_collapseMode="pin"
                />
        </android.support.design.widget.CollapsingToolbarLayout>
    </android.support.design.widget.AppBarLayout>

    <android.support.v4.widget.NestedScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior"
        >

        <TextView
            android:id="@+id/article_body"
            style="?android:attr/textAppearanceMedium"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:padding="16dp"
            android:textSize="20sp"
            android:lineSpacingMultiplier="@fraction/detail_body_line_spacing_multiplier" />
    </android.support.v4.widget.NestedScrollView>

    <android.support.design.widget.FloatingActionButton
        android:id="@+id/share_fab"
        android:stateListAnimator="@anim/fab_state_list_anim"
        android:background="@drawable/add_fab_background"
        android:layout_marginRight="@dimen/fab_margin"
        android:layout_width="56dp"
        android:layout_height="56dp"
        android:src="@drawable/ic_share"
        android:elevation="@dimen/fab_elevation"
        android:contentDescription="@string/action_share"
        app:layout_anchor="@id/main.appbar"
        app:layout_anchorGravity="bottom|right|end"/>

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

Solution

  • try this make small change in your FloatingActionButton

    <android.support.design.widget.FloatingActionButton
            android:id="@+id/share_fab"
            android:stateListAnimator="@anim/fab_state_list_anim"
            android:background="@drawable/add_fab_background"
            android:layout_marginRight="@dimen/fab_margin"
            android:layout_width="56dp"
            android:layout_height="56dp"
            android:src="@drawable/ic_share"
            android:elevation="@dimen/fab_elevation"
            android:contentDescription="@string/action_share"
            app:layout_anchor="@id/main_collapsing"
            app:layout_anchorGravity="bottom|right|end"/>