Android bottom sheet always sticks to top left

Question

I'm trying to create an swipeable bottom sheet and was trying to constraint the bottom sheet (a linear layout) to the bottom of the main view but was unable to do so. It just sticks to the top-left corner while maintaining its dimensions. Am I doing something wrong?

webview.xml (Main View)

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    xmlns:android="http://schemas.android.com/apk/res/android">

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent" />

    <include
        layout="@layout/bottom_sheet"
        app:layout_constraintBottom_toBottomOf="parent" />

</androidx.constraintlayout.widget.ConstraintLayout>

bottom_sheet.xml (Bottom Sheet)

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/bottom_sheet"
    android:background="@android:color/transparent"
    app:layout_behavior="@string/bottom_sheet_behavior"
    app:behavior_hideable="true"
    app:behavior_peekHeight="25dp">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardBackgroundColor="?android:attr/colorBackground"
        app:cardCornerRadius="1dp"
        app:cardElevation="20dp">

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

            <View
                android:layout_width="30dp"
                android:layout_height="5dp"
                android:layout_gravity="center"
                android:layout_marginBottom="10dp"
                android:layout_marginTop="10dp"
                android:background="#808080"/>

            <WebView
                android:id="@+id/bottom"
                android:layout_width="match_parent"
                android:layout_height="100dp" />

        </LinearLayout>

    </androidx.cardview.widget.CardView>

</LinearLayout>

Answer 1

BottomSheetBehavior can be only used inside of CoordinatorLayout like that:

<?xml version="1.0" encoding="utf-8"?>
<android.support.design.widget.CoordinatorLayout 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="match_parent">

    <WebView
        android:id="@+id/webview"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

    <include layout="@layout/bottom_sheet" />

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

In your bottom_sheet you have to set layout behavior properly, like that:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:orientation="vertical"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/bottom_sheet"
    android:background="@android:color/transparent"
    app:layout_behavior="android.support.design.widget.BottomSheetBehavior"
    app:behavior_hideable="true"
    app:behavior_peekHeight="25dp">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:cardBackgroundColor="?android:attr/colorBackground"
        app:cardCornerRadius="1dp"
        app:cardElevation="20dp">

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

            <View
                android:layout_width="30dp"
                android:layout_height="5dp"
                android:layout_gravity="center"
                android:layout_marginBottom="10dp"
                android:layout_marginTop="10dp"
                android:background="#808080"/>

            <WebView
                android:id="@+id/bottom"
                android:layout_width="match_parent"
                android:layout_height="100dp" />

        </LinearLayout>

    </androidx.cardview.widget.CardView>

</LinearLayout>