BottomSheet fly away with visibility change

Question

I have a bottom sheet with a NestedScrollView inside (see below). When I press on a FAB button, I want to make some parts in this NestedScrollView invisible. But when I change some linearlayouts visibilities to GONE, bottomsheet fly aways from the top. See here:

You can get the whole code from https://github.com/Tanrikut/BottomSheetExample

My change visibility method:

private void changeVisibility() {
    subtitleLayout.setVisibility(View.GONE);

    coordinateLayout.setVisibility(View.GONE);
    timeLayout.setVisibility(View.GONE);

}

My NestedScrollView xml:

<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView 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="wrap_content"
    app:behavior_peekHeight="120dp"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
    android:id="@+id/bottom_sheet_main">

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="28dp"
            android:background="@android:color/white"
            android:animateLayoutChanges="true"
            android:orientation="vertical"
            >

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical"
                android:paddingLeft="10dp"
                android:paddingStart="10dp"
                android:paddingTop="@dimen/activity_horizontal_margin">

                <TextView
                    style="@style/TextAppearance.AppCompat.Headline"
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:text="Dandelion Chocolate"
                    android:id="@+id/title" />
                <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginBottom="@dimen/activity_horizontal_margin"
                    android:layout_marginTop="16dp"
                    android:orientation="horizontal"
                    android:id="@+id/subtitleLayout">

                    <TextView
                        android:layout_width="match_parent"
                        android:layout_height="wrap_content"
                        android:id="@+id/subtitle"
                        android:text="Subtitle" />

                </LinearLayout>


            </LinearLayout>


            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:padding="@dimen/activity_horizontal_margin"
                android:id="@+id/coordinateLayout">

                <ImageButton
                    android:layout_width="24dp"
                    android:layout_height="24dp"
                    android:alpha="0.36"
                    android:src="@drawable/ic_room_24dp"
                    android:background="@null" />

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/activity_horizontal_margin"
                    android:layout_marginStart="@dimen/activity_horizontal_margin"
                    android:text="740, Valencia St, San Francisco, CA"
                    android:textColor="@android:color/primary_text_light"
                    android:id="@+id/bottom_sheet_coordinate" />

            </LinearLayout>

            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:padding="@dimen/activity_horizontal_margin"
                android:id="@+id/timeLayout">

                <ImageButton
                    android:layout_width="24dp"
                    android:layout_height="24dp"
                    android:alpha="0.36"
                    android:src="@drawable/ic_query_builder_24dp"
                    android:background="@null" />

                <TextView
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:layout_marginLeft="@dimen/activity_horizontal_margin"
                    android:layout_marginStart="@dimen/activity_horizontal_margin"
                    android:text="Wed, 10 AM - 9 PM"
                    android:textColor="@android:color/primary_text_light"
                    android:id="@+id/bottom_sheet_time" />

            </LinearLayout>


        </LinearLayout>

    </FrameLayout>
</android.support.v4.widget.NestedScrollView>

Where are you calling changeVisibility() method? – Dhruv Jul 13 '16 at 04:47 — Dhruv, Jul 13 '16 at 04:47
Inside a clicklistener of a fab button – Tanrikut Jul 13 '16 at 04:58 — Tanrikut, Jul 13 '16 at 04:58

brAzzi64 · Answer 1 · 2016-09-14T05:14:23.930

48

I ran into this, took a while to figure out what was the cause.

It's because you're using android:animateLayoutChanges, which surfaces a bug in either BottomSheetBehavior or CoordinatorLayout.

Remove it and the BottomSheet will stop animating on its own when it shouldn't. Not a fix, but a workaround at least.

--

Update:

Turns out that if you enable "animateLayoutChanges" programmatically by setting the LayoutTransition instance to use, you can set a flag on it that will prevent it from messing with views that are ancestors of the one you're using android:animateLayoutChanges on (aka: your BottomSheet container):

LayoutTransition transition = new LayoutTransition();
transition.setAnimateParentHierarchy(false);
yourLinearLayoutThatNeedsLayoutAnimation.setLayoutTransition(transition);

edited Sep 14 '16 at 05:14

answered Sep 13 '16 at 05:00

brAzzi64

905
8
12

This is exactly what solves the problem! - thx! this issue is still present in the current support lib v25.0.1 – koesclem Dec 01 '16 at 08:29
You are a saviour brother, spent a considerable amount of days investigating this issue. – Makari Kevin Apr 21 '20 at 06:43
3

Still an issue in 2020 – Steve M Jul 25 '20 at 16:51

Cícero Moura · Answer 2 · 2020-12-10T17:21:02.783

7

Removing the following line from my root layout solved this problem:

android:animateLayoutChanges="true"

edited Dec 10 '20 at 17:21

answered Feb 18 '20 at 18:21

Cícero Moura

1,391
1
17
30

score 1 · Answer 3 · answered Mar 25 '21 at 06:04

1

As a workaround, you need to remove the android:animateLayoutChanges="true" from the parent coordinator layout

answered Mar 25 '21 at 06:04

Suneet Srivastava

331
2
5

score 0 · Answer 4 · answered Jul 04 '19 at 08:35

Try to make the parent of bottomSheet an independent CoordinatorLayout without having any other child Views. For example:

<RelativeLayout
    android:id="@+id/some_id"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Some_View
    .../>


    <Some_Other_view>
        .
        .
        .</Some_Other_view>

    <androidx.coordinatorlayout.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true">

        <include
            android:id="@+id/included_layout"
            layout="@layout/bottom_sheet" />
    </androidx.coordinatorlayout.widget.CoordinatorLayout>
</RelativeLayout>

score 0 · Answer 5 · edited May 24 '20 at 16:03

0

Change View.GONE to View.INVISIBLE. Since the View.GONE has no size, the bottom sheet can't compute the height of the child being updated.

edited May 24 '20 at 16:03

double-beep

3,889
12
24
35

answered May 24 '20 at 15:22

Jimmy Macaraeg

27
4

score -1 · Answer 6 · edited Dec 16 '19 at 13:00

-1

The BottomSheetBehavior has its own behavior by which you can get respective results. The following are the behavior of the bottomsheet.

STATE_DRAGGING, STATE_SETTLING, STATE_EXPANDED, STATE_COLLAPSED, STATE_HIDDEN.

Don't use visibility of any layouts.

Use this behavior in your code like:

fab.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        int behaviorState = bottomSheetBehavior.getState();
        if (behaviorState == BottomSheetBehavior.STATE_EXPANDED) {
            bottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
        } else {
            bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
        }
    }
});

edited Dec 16 '19 at 13:00

Bruno Bieri

7,754
10
55
79

answered Jul 13 '16 at 06:04

Dhruv

1,794
3
19
37

i am not trying to change visibility of bottom sheet. I am trying to change what is visible inside that bottom sheet. – Tanrikut Jul 13 '16 at 06:07
This could also be written as: `behavior.setState(behavior.getState() == STATE_EXPANDED ? STATE_COLLAPSED : STATE_EXPANDED);` where as behavior is your bottomSheetBehavior. – Bruno Bieri Dec 16 '19 at 13:01

BottomSheet fly away with visibility change

6 Answers6

Linked