Use Android Studio BottomSheet with kotlin.

Hi friends

I am going to implement bottomsheet dialog.

First of all we have create a new project. We will be a select Empty Activity after click on next botton.

Click on after that select your project name,select a language and minimum API lavel. after click on finish botton.

activity_main.xml:

<RelativeLayout
    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"
    android:background="@color/colourPicker"
    tools:context=".activities.AppointmentListActivity">

    <RelativeLayout
        android:id="@+id/background_layout"
        android:layout_width="match_parent"
        android:layout_height="141dp"
        android:background="@drawable/background_top_profile">

        <ImageView
            android:layout_marginTop="27dp"
            android:id="@+id/appointmentList_backArrow"
            android:layout_width="wrap_content"
            android:layout_height="24dp"
            android:layout_centerVertical="true"
            android:layout_marginLeft="24dp"
            android:src="@drawable/arrow_back"
            android:layout_marginStart="24dp"/>

        <TextView
            android:layout_marginTop="24dp"
            android:id="@+id/myProfile_personal_details"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Appointment Details"
            android:layout_centerVertical="true"
            android:textStyle="bold"
            android:textSize="24sp"
            android:layout_centerHorizontal="true"
            android:textColor="@color/colorWhite"/>

        <ImageView
            android:layout_marginTop="27dp"
            android:id="@+id/myProfile_setting_icon"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:src="@drawable/setting_icon"
            android:layout_centerVertical="true"
            android:layout_alignParentEnd="true"
            android:layout_alignParentRight="true"
            android:layout_marginRight="23dp"
            android:layout_marginEnd="23dp"/>

    </RelativeLayout>



    <RelativeLayout
            android:layout_below="@+id/background_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginRight="17dp"
            android:layout_marginLeft="18dp">


            <androidx.cardview.widget.CardView
                android:layout_below="@+id/descriptionAppointmentDetails"
                android:id="@+id/appointmentList_cardView"
                android:layout_marginTop="10dp"
                android:layout_width="match_parent"
                android:layout_height="151dp"
                app:cardCornerRadius="10dp"
                app:cardBackgroundColor="@color/colorPrimary">

                <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent">

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

                        <TextView
                            android:id="@+id/appointmentNotify_textView"
                            android:layout_width="wrap_content"
                            android:layout_height="wrap_content"
                            android:text="Appointments Date And Time"
                            android:textColor="#021E73"
                            android:layout_marginTop="15dp"
                            android:textSize="16sp"
                            android:layout_marginLeft="14dp"
                            android:layout_marginStart="14dp" />

                        <ImageView
                            android:id="@+id/icon_calenderTime"
                            android:layout_width="35dp"
                            android:layout_height="wrap_content"
                            android:layout_alignParentEnd="true"
                            android:layout_alignParentRight="true"
                            android:layout_marginTop="16dp"
                            android:layout_marginEnd="25dp"
                            android:layout_marginRight="25dp"
                            android:src="@drawable/calender_time" />

                    </RelativeLayout>

                    <TextView
                        android:id="@+id/upcomingAppointmentDate_textView"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text=" No Date"
                        android:textColor="@color/colorWhite"
                        android:textSize="24sp"
                        android:textStyle="bold"
                        android:layout_marginTop="41dp"
                        android:layout_marginLeft="14dp"
                        android:layout_marginStart="14dp" />

                    <TextView
                        android:id="@+id/upcominAappointmentTime_textView"
                        android:layout_width="wrap_content"
                        android:layout_height="wrap_content"
                        android:text=" No Time"
                        android:textColor="@color/colorWhite"
                        android:textSize="24sp"
                        android:textStyle="bold"
                        android:layout_marginTop="70dp"
                        android:layout_marginLeft="14dp"/>


                    <LinearLayout
                        android:layout_width="match_parent"
                        android:layout_height="28dp"
                        android:layout_marginTop="5dp"
                        android:orientation="horizontal"
                        android:layout_below="@id/upcominAappointmentTime_textView"
                        android:layout_marginLeft="16dp">


                        <Button
                            android:id="@+id/doctorAppointCancel_button"
                            android:layout_width="wrap_content"
                            android:layout_height="25dp"
                            android:text="Cancel"
                            android:textAllCaps="false"
                            android:textColor="@color/colorWhite"
                            android:textSize="10sp"
                            android:background="@drawable/button_emergency"
                            android:textStyle="normal"/>

                        <Button
                            android:layout_width="wrap_content"
                            android:layout_height="25dp"
                            android:text="reschedule"
                            android:textColor="@color/colorWhite"
                            android:textSize="10sp"
                            android:textAllCaps="false"
                            android:layout_marginRight="10dp"
                            android:layout_marginLeft="10dp"
                            android:background="@drawable/button_reschedule"
                            android:textStyle="bold"/>

                        <Button
                            android:id="@+id/appointmentDoctorSpeciality_textView"
                            android:layout_width="wrap_content"
                            android:layout_height="25dp"
                            android:text="Start Video Coll"
                            android:textAllCaps="false"
                            android:textColor="@color/colorWhite"
                            android:textSize="10sp"
                            android:layout_marginLeft="20dp"
                            android:background="@drawable/button_style"
                            android:textStyle="normal"/>

                    </LinearLayout>

                </RelativeLayout>

            </androidx.cardview.widget.CardView>

I have select one button id (cancel),When it will click on the cancel button than it will open layout. I am using a BottomSheetDialog for it will open layout type (popUp). After According to our needed.

Activity_Main:

doctorAppointmentCancel.setOnClickListener {
    val dialog = BottomSheetDialog(this)
    val cancelLayout = layoutInflater.inflate(R.layout.appointment_cancel_layout,null)
dialog.setContentView(cancelLayout)
    dialog.show()


    val view = cancelLayout.findViewById(R.id.cancelNo_button) as Button
    view.setOnClickListener {
        dialog.dismiss()
    }
    val yesCancel = cancelLayout.findViewById<Button>(R.id.cancelYes_button)
    yesCancel.setOnClickListener {
        val intent = Intent(this,AppointmentConfirmCancelnationActivity::class.java)
        intent.putExtra("bookedDocumentId", bookedDocumentId)
        startActivity(intent)
    }
}

Thanks for read…