Open Bottom dialog from mid to top in Android

Question

I want my bottom dialog open by default at mid-height and when slide, it should open to the top. Google map will be shown in the top half part and another half part will be Bottomsheet and when the user slides up the bottom it should open to the top.

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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:orientation="vertical"
             android:layout_height="match_parent"
             tools:context=".home.MainActivity">

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

    <fragment
            android:layout_width="match_parent"
            android:layout_height="0dp"
            android:id="@+id/map"
            android:layout_weight="1"
            tools:context=".module.ride.activity.MapsActivity"
            android:name="com.google.android.gms.maps.SupportMapFragment"/>

    <LinearLayout android:layout_width="match_parent"
                  android:orientation="vertical"
                  android:layout_weight="1"
                  android:layout_height="0dp">

    </LinearLayout>

</LinearLayout>


<android.support.design.widget.CoordinatorLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

    <LinearLayout
            android:id="@+id/bottom_sheet"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="#fff"
            android:orientation="vertical"
            app:layout_behavior="android.support.design.widget.BottomSheetBehavior">

        <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:layout_gravity="center_vertical"
                android:weightSum="3">

            <ImageView android:layout_width="match_parent"
                       app:srcCompat="@drawable/ic_openclose"
                       android:id="@+id/imgExpand"
                       android:layout_height="@dimen/_40sdp"/>

        </LinearLayout>

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Chicken Fried Rice 1x1"/>

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Paneer Tikka 1x2"/>

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Delivery Address"
                android:textColor="#444"
                android:textStyle="bold"/>

        <TextView
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="Flat No 404, Skyline Apartments, Vizag - 500576"/>

        <Button
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_marginTop="30dp"
                android:background="#000"
                android:foreground="?attr/selectableItemBackground"
                android:text="PROCEED PAYMENT"
                android:textColor="#fff"/>

    </LinearLayout>

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

My Kotlin Code

 var sheetBehavior: BottomSheetBehavior<*>? = null
 sheetBehavior = BottomSheetBehavior.from(bottom_sheet);
        (sheetBehavior as BottomSheetBehavior<*>?)!!.setBottomSheetCallback(object :
            BottomSheetBehavior.BottomSheetCallback() {
            override fun onSlide(p0: View, p1: Float) {

        }
        override fun onStateChanged(p0: View, p1: Int) {
            when (p0.id) {

                BottomSheetBehavior.STATE_HIDDEN -> {
                    System.out.println("----------STATE_HIDDEN")
                }
                BottomSheetBehavior.STATE_EXPANDED -> {
                    System.out.println("-------------STATE_EXPANDED")
                }
                BottomSheetBehavior.STATE_COLLAPSED -> {
                    System.out.println("-----------STATE_COLLAPSED")
                }
            }
        }
    })
    imgExpand.setOnClickListener() {
        if ((sheetBehavior as BottomSheetBehavior<*>?)!!.state != BottomSheetBehavior.STATE_EXPANDED) {
            (sheetBehavior as BottomSheetBehavior<*>?)!!.setState(BottomSheetBehavior.STATE_EXPANDED);
        } else {
            (sheetBehavior as BottomSheetBehavior<*>?)!!.setState(BottomSheetBehavior.STATE_COLLAPSED);
        }
    }
}

I tried something but it shows something like this

But I want to do something like this

Answer 1

Move the attribute app:layout_behavior="android.support.design.widget.BottomSheetBehavior"> from LinearLayout to the root view of your sheet which is CoordinatorLayout

<android.support.design.widget.CoordinatorLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior">

<LinearLayout
        android:id="@+id/bottom_sheet"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="#fff"
        android:orientation="vertical">

Answer 2

Setting peekHeight for your bottomsheet should help you to get your desired behaviour. This is the definition of the peekHeight.

STATE_COLLAPSED : The bottom sheet is visible but only showing its peek height. This state is usually the 'resting position' of a Bottom Sheet. The peek height is chosen by the developer and should be enough to indicate there is extra content, allow the user to trigger an action or expand the bottom sheet.