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


Archive