Android material design introduces two types of BottomSheet: Modal Bottom Sheets and Persistent Bottom Sheets.
BottomSheetDialogFragment – are alternative to inline dialogs on mobile and provide room for descriptions, and iconography. Which open from the bottom on user interaction. If you want to share somethings, option will pop up from bottom something like that.BottomSheetBehavior and CoordinatorLayout – provides a collapsed surface that can be expanded by user interaction (dragging, click on some button) access a key feature. In simple words, you say, Persistent Bottom Sheet can slide up and down any time. In your build.gradle file, add the following:
dependencies {
implementation 'com.google.android.material:material:1.2.0-alpha02'
}
You can find last version here.
First, create a layout file for the bottom sheet. Go to res/layout folder and create file named is bottom_sheet.xml
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="8dp">
<TextView
android:id="@+id/tv1"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_marginTop="8dp"
android:drawableLeft="@android:drawable/ic_menu_call"
android:drawableStart="@android:drawable/ic_menu_call"
android:text="Text 1"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent"/>
<TextView
android:id="@+id/tv2"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:drawableLeft="@android:drawable/ic_menu_add"
android:drawableStart="@android:drawable/ic_menu_add"
android:text="Text 2"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toBottomOf="@+id/tv1"/>
</androidx.constraintlayout.widget.ConstraintLayout>
Create BottomSheetDialogFragment.
class MyBottomSheet : BottomSheetDialogFragment() {
companion object {
fun newInstance(): MyBottomSheet =
MyBottomSheet().apply {
/*
arguments = Bundle().apply {
putInt("VALUE", someValue)
}
*/
}
}
override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
savedInstanceState: Bundle?): View? {
return inflater.inflate(R.layout.bottom_sheet, container, false)
}
override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
super.onViewCreated(view, savedInstanceState)
tv2.setOnClickListener { dismiss() }
}
}
Create activity_main.xml.
<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout
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">
<Button
android:id="@+id/button"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:background="@color/colorAccent"
android:padding="8dp"
android:text="Show BottomSheet"
android:textColor="#fff"
app:layout_constraintBottom_toBottomOf="parent"
app:layout_constraintEnd_toEndOf="parent"
app:layout_constraintStart_toStartOf="parent"
app:layout_constraintTop_toTopOf="parent" />
</androidx.constraintlayout.widget.ConstraintLayout>
Show bottom sheet dialog fragment.
val fragment = MyBottomSheet.newInstance() fragment.show(supportFragmentManager, "my_bs")