How to set maximum expanded height in android support design bottom sheet?

Kirby Aster Abadilla picture Kirby Aster Abadilla · Apr 15, 2016 · Viewed 48.7k times · Source

I already showed my bottom sheet layout with its peek height set to 100dp. But how can I limit my bottom sheet to expand to 500dp only? This is my sample layout:

<android.support.design.widget.CoordinatorLayout
android:id="@+id/coordinator"
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">

<fragment xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/map"
    android:name="com.google.android.gms.maps.SupportMapFragment"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MapsActivity" />

<android.support.v4.widget.NestedScrollView
    android:id="@+id/design_bottom_sheet"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#000000"
    app:behavior_hideable="true"
    app:behavior_peekHeight="100dp"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior">

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

        <TextView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_marginBottom="5dp"
            android:background="#e444ff" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_marginBottom="5dp"
            android:background="#e444ff" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_marginBottom="5dp"
            android:background="#e444ff" />

    </LinearLayout>

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

<android.support.design.widget.FloatingActionButton
    android:id="@+id/fab"
    android:layout_margin="@dimen/activity_horizontal_margin"
    app:layout_anchor="@+id/design_bottom_sheet"
    app:layout_anchorGravity="top|right|end"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

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

In addition to my question, how can I disallow the user from dragging the bottom sheet up and down?

Answer

kandroidj picture kandroidj · Apr 15, 2016

to stop the bottom sheet from moving up the full screen is simple, just set a layout_height for your NestedScrollView to 500dp, also you probably want to set it's layout_gravity="bottom"

<android.support.v4.widget.NestedScrollView
    android:id="@+id/design_bottom_sheet"
    android:layout_width="match_parent"
    android:layout_height="500dp"
    android:background="#000000"
    android:layout_gravity="bottom"
    app:behavior_hideable="true"
    app:behavior_peekHeight="100dp"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior">

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

        <TextView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_marginBottom="5dp"
            android:background="#e444ff" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_marginBottom="5dp"
            android:background="#e444ff" />

        <TextView
            android:layout_width="match_parent"
            android:layout_height="100dp"
            android:layout_marginBottom="5dp"
            android:background="#e444ff" />

    </LinearLayout>

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

if you don't want the view to be draggable up then you need to set behavior_peekHeight and layout_height to the same values.

And to stop the view from being draggable down is the behavior_hideable flag just set this to false

Good Luck and Happy Coding!