Android BottomSheet Example in Kotlin

The Bottom Sheet is utilised by the majority of applications, including Google Drive and Maps, to display data within the programme. This post will look at utilising Kotlin in Android Studio to implement a Bottom Sheet in an Android app.

In this article, you will learn how to create your Bottom Sheet  Example of Bottom Sheet​ in Android. So let’s take example of Bottom Sheet  activity codes  in Android of Mobile application.  

Example of Bottom Sheet 

                                                                                              

Step-by-Step Im​plementation
​Step 1: Create a New Project in Android ​studio (File >new  project). 


Step 2: Create an activity_main.xml file in your layout folder . path (res>layout)

Implement the same in​voke the following code inside activity_main.xml file.

 <?xml version="1.0" encoding="utf-8"?>
 <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:padding="10dp">

    <androidx.cardview.widget.CardView
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <RelativeLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_margin="2dp">

            <ImageView
                android:id="@+id/idIVCourse"
                android:layout_width="match_parent"
                android:layout_height="200dp"
                android:layout_margin="10dp"
                android:src="@drawable/download" />

            <Button
                android:id="@+id/idBtnDismiss"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_below="@id/idIVCourse"
                android:layout_margin="10dp"
                android:text="Dismiss dialog"
                android:textAllCaps="false" />

        </RelativeLayout>

    </androidx.cardview.widget.CardView>

 </RelativeLayout>
Step 3: Create an MainActivity.kt file in your package folder .

Implement the same invoke the fol​low​ing code inside MainActivity.kt file.

 import android.annotation.SuppressLint
 import android.os.Bundle
 import android.view.View
 import android.widget.Button
 import androidx.appcompat.app.AppCompatActivity
 import androidx.appcompat.widget.AppCompatButton
 import com.google.android.material.bottomsheet.BottomSheetDialog

 class MainActivity : AppCompatActivity() {
    @SuppressLint("MissingInflatedId")
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        val btnopen = findViewById<View>(R.id.btnopen) as AppCompatButton
        btnopen.setOnClickListener {
            val dialog = BottomSheetDialog(this)
            val view = layoutInflater.inflate(R.layout.dialog_layout, null)
            val btnClose = view.findViewById<Button>(R.id.idBtnDismiss)
            btnClose.setOnClickListener {
                dialog.dismiss()
            }
            dialog.setContentView(view)
            dialog.show()
        }

    }
 }

Step 4 : Output of above example.

                                            

Happy coding!

365Bloggy July 22, 2024
Share this post
Tags
SUBSCRIBE THIS FORM

Subscribe Thanks

Recent Posts
How to add a Snackbar in Android
0 1756
Zoom In and Out to TextView in Android
0 543
How to underline text in textview
0 440
Shine Effect in Android
0 411
How to Create Marquee Text in Android?
0 359
Our blogs
Archive