Open top menu

  How to implement BottomSheetDialog in android?

 
In this blog explain how to implement Bottom Sheet Dialog with the help of Android Design Support library.

First you can add Design Support Library in your app,

dependencies {
    compile fileTree(
dir: 'libs', include: ['*.jar'])
    testCompile
'junit:junit:4.12'
   
compile 'com.android.support:appcompat-v7:23.4.0'
  
// compile 'com.android.support:design:23.0.3'
   
compile 'com.android.support:design:23.4.0'
}

 then you have create bottomsheet_dialog.xml class.

bottomsheet_dialog.xml.

…………………………………………………………………………………………………
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   
android:orientation="vertical" android:layout_width="match_parent"
   
android:layout_height="match_parent">
    <
LinearLayout
       
android:layout_width="match_parent"
       
android:layout_height="300dp"
       
android:gravity="center"
       
android:orientation="vertical">

        <
TextView
           
android:layout_width="wrap_content"
           
android:layout_height="wrap_content"
           
android:layout_gravity="center_horizontal"
           
android:text="Bottom Sheet Dialog Example"
           
android:textSize="26dp"
           
android:textStyle="bold"/>
        <
ImageView
           
android:layout_width="wrap_content"
           
android:layout_height="wrap_content"
           
android:src="@mipmap/ic_launcher"/>

    </
LinearLayout>
</
LinearLayout>

………………………………………………………………………………………………………


Activity_main.xml.
…………………………………………………………………………………………………………

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
   
xmlns:tools="http://schemas.android.com/tools"
   
android:layout_width="match_parent"
   
android:layout_height="match_parent"
   
android:paddingBottom="@dimen/activity_vertical_margin"
   
android:paddingLeft="@dimen/activity_horizontal_margin"
   
android:paddingRight="@dimen/activity_horizontal_margin"
   
android:orientation="vertical"
   
android:paddingTop="@dimen/activity_vertical_margin"
    
>

    <
TextView
       
android:layout_width="wrap_content"
       
android:layout_height="wrap_content"
       
android:textSize="30dp"
       
android:textStyle="bold"
       
android:text="Android Beginner point" />
    <
LinearLayout
       
android:id="@+id/backgroundlayout"
       
android:layout_width="match_parent"
       
android:layout_height="wrap_content"
       
android:orientation="vertical"
       
android:gravity="center"
       
android:background="#bc67bc">

        <
TextView
           
android:id="@+id/textSDK"
           
android:layout_width="match_parent"
           
android:layout_height="wrap_content"
           
android:textColor="#ffffff"
           
android:textStyle="bold"/>
        <
TextView
           
android:id="@+id/prompt1"
           
android:textSize="28dp"
           
android:textColor="#ffffff"
           
android:textStyle="bold"
           
android:gravity="center"
           
android:layout_width="match_parent"
           
android:layout_height="wrap_content" />
        <
TextView
           
android:id="@+id/prompt2"
           
android:textSize="28dp"
           
android:layout_width="match_parent"
            
android:textColor="#ffffff"
           
android:textStyle="bold"
           
android:gravity="center"
           
android:layout_height="wrap_content" />
    </
LinearLayout>
</
LinearLayout>

………………………………………………………………………………………………………



MainActivity.java
……………………………………………………………………………………………………
import android.content.DialogInterface;
import android.os.Build;
import android.support.annotation.NonNull;
import android.support.design.widget.BottomSheetBehavior;
import android.support.design.widget.BottomSheetDialog;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.widget.LinearLayout;
import android.widget.TextView;

public class MainActivity extends AppCompatActivity {

    LinearLayout
backgroundLayout;
    View
bottomSheetView;
    TextView
textPrompt1, textPrompt2;
    TextView
textSDK;

    BottomSheetDialog
bottomSheetDialog;
    BottomSheetBehavior
bottomSheetBehavior;

   
int sdk_int = Build.VERSION.SDK_INT;

   
@Override
   
protected void onCreate(Bundle savedInstanceState) {
       
super.onCreate(savedInstanceState);
        setContentView(R.layout.
activity_main);

       
textSDK = (TextView)findViewById(R.id.textSDK);
      
// textSDK.setText("Running SDK_INT: " + sdk_int);

       
textPrompt1 = (TextView)findViewById(R.id.prompt1);
       
textPrompt2 = (TextView)findViewById(R.id.prompt2);
       
backgroundLayout = (LinearLayout)findViewById(R.id.backgroundlayout);

       
bottomSheetView = getLayoutInflater().inflate(R.layout.bottosheet_dialog, null);
       
bottomSheetDialog = new BottomSheetDialog(MainActivity.this);
        
bottomSheetDialog.setContentView(bottomSheetView);
       
bottomSheetBehavior = BottomSheetBehavior.from((View) bottomSheetView.getParent());
       
bottomSheetBehavior.setBottomSheetCallback(bottomSheetCallback);

       
bottomSheetDialog.setOnShowListener(new DialogInterface.OnShowListener() {
           
@Override
           
public void onShow(DialogInterface dialog) {
               
textPrompt1.setText("Show");
            }
        });

       
bottomSheetDialog.setOnDismissListener(new DialogInterface.OnDismissListener() {
           
@Override
           
public void onDismiss(DialogInterface dialog) {
               
bottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
               
textPrompt1.setText("Dismiss");
            }
        });

       
backgroundLayout.setOnClickListener(new View.OnClickListener() {
           
@Override
           
public void onClick(View v) {
               
bottomSheetBehavior.setState(BottomSheetBehavior.STATE_EXPANDED);
                
bottomSheetDialog.show();
            }
        });

    }

    BottomSheetBehavior.BottomSheetCallback
bottomSheetCallback =
           
new BottomSheetBehavior.BottomSheetCallback(){
               
@Override
               
public void onStateChanged(@NonNull View bottomSheet, int newState) {
                   
switch (newState){

                       
case BottomSheetBehavior.STATE_EXPANDED:
                           
textPrompt2.setText("EXPANDED");
                           
break;

                        
case BottomSheetBehavior.STATE_SETTLING:
                           
textPrompt2.setText("SETTLING");
                           
break;
                       
default:
                           
textPrompt2.setText("unknown...");
                    }
                }

               
@Override
               
public void onSlide(@NonNull View bottomSheet, float slideOffset) {

                }
            };
}

……………………………………………………………………………………


0 comments