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

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?

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

You can just set param "maxHeight" to the root viewgroup of your bottom sheet.

android:maxHeight=500dp

Works good with ConstraintLayout as root layout.

Above solutions didn't work for me so I solved it by

1. added app:layout_behavior="com.google.android.material.bottomsheet.BottomSheetBehavior" in the root view of bottom sheet layout.

2. custom style for bottom sheet:

<style name="AppBottomSheetDialogTheme" parent="Theme.MaterialComponents.BottomSheetDialog">
        <item name="bottomSheetStyle">@style/AppModalStyle</item>
    </style>

    <style name="AppModalStyle" parent="Widget.MaterialComponents.BottomSheet">
        <item name="behavior_peekHeight">600dp</item>
    </style>

3. And using this in Activity or Fragment by

    val mBottomSheetDialog = BottomSheetDialog(this, R.style.AppBottomSheetDialogTheme)
    val inflater = this.layoutInflater
    val sheetView = inflater.inflate(R.layout.bottom_sheet_layout, null)
    mBottomSheetDialog.setContentView(sheetView)
    mBottomSheetDialog.show()

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

Related

Recent Posts