Android Persistent and Modal Bottom Sheet Tutorial

Bottom Sheet is the new material design widget and it is a simple bottom window display in the bottom of the screen. There have two type of Bottom Sheet which are Persistent and Modal. The first type Persistent Bottom Sheet is structural part of a User Interface and it is permanent in the activity, user can expand and collapse the view. While the second type Modal Bottom Sheet is a temporary dialog that display in the screen, it is not a part of view hierarchy. In this tutorial, I will teach you on how to create the new android persistent and modal bottom sheet in your project.

Creating a New Project

1. Open Android Studio IDE in your computer.
2. Create a new project and Edit the Application name to “BottomSheetExample”.
(Optional) You can edit the company domain or select the suitable location for current project tutorial. Then click next button to proceed.
3. Select Minimum SDK (API 15:Android 4.0.3 (IceCreamSandwich). I choose the API 15 because many android devices currently are support more than API 15. Click Next button.
4. Choose “Empty Activity” and Click Next button
5. Lastly, press finish button.

Add new dependency

Open your build.gradle file and Add new library in your dependency section.

Create Custom Modal Bottom Sheet Layout

Right click the layout folder and create a new xml file “custom_bottom_sheet_dialog”.

Create Custom Persistent Bottom Sheet Layout

After create the modal bottom sheet layout, and create a new custom layout for persistent bottom sheet. The file name will be “content_bottom_sheet”.

Create layout for mainactivity content

Add a new xml file “content_main” for your activity content.

Edit activity_main.xml layout

This layout will include the content_main and content_bottom_sheet.

Create a new class for Custom Modal Bottom Sheet

Right click your package name and add a new class “CustomBottomSheetDialogFragment”. Aftert that follow the source code below.

Edit MainActivity.java class

Open your MainActivity.java class and edit it to the source code below.

Run Your Project

Finally you get it done ! You can run this project in your android device or emulator to test the persistent and modal bottom sheet.

(Android Persistent and Modal Bottom Sheet)

Source Code

(Visited 2,186 times, 1 visits today)
Advertisements

Yong Loon Ng

Ng Yong Loon, better known as Kristofer is a software engineer and computer scientist who doubles up as an entrepreneur.

You may also like...

1 Response

Leave a Reply

Your email address will not be published. Required fields are marked *