androidandroid-gesture

How to make sliding bottom and top panel with gestures in Android java


I would like to do something like this

I would like to make the top panel slide up when I slide my finger up from the white bar at the bottom of it and the other panel slide up when I slide up from the white bar as well.

What would you recommend doing? I mean, what would be the best solution from your POV?


Solution

  • make a layout name bottom_sheet_dialog_layout.xml

        <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="wrap_content"
                android:orientation="horizontal"
                android:id="@+id/download"
                android:background="?android:attr/selectableItemBackground"
                android:padding="8dp">
        
                <ImageView
                    android:layout_width="24dp"
                    android:layout_height="24dp"
                    android:src="@drawable/ic_baseline_cloud_download_24"
                    android:layout_margin="8dp"/>
        
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Download File"
                    android:layout_gravity="center_vertical"
                    android:padding="8dp"/>
            </LinearLayout>
        
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:id="@+id/shareLinearLayout"
                android:background="?android:attr/selectableItemBackground"
                android:padding="8dp">
        
                <ImageView
                    android:layout_width="24dp"
                    android:layout_height="24dp"
                    android:src="@drawable/ic_baseline_share_24"
                    android:layout_margin="8dp"/>
        
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Share"
                    android:layout_gravity="center_vertical"
                    android:padding="8dp"/>
        
            </LinearLayout>
        
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:id="@+id/uploadLinearLaySout"
                android:background="?android:attr/selectableItemBackground"
                android:padding="8dp">
        
                <ImageView
                    android:layout_width="24dp"
                    android:layout_height="24dp"
                    android:src="@drawable/ic_baseline_add_to_drive_24"
                    android:layout_margin="8dp"/>
        
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Upload To Google Drive"
                    android:layout_gravity="center_vertical"
                    android:padding="8dp"/>
        
            </LinearLayout>
        
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:id="@+id/copyLinearLayout"
                android:background="?android:attr/selectableItemBackground"
                android:padding="8dp">
        
                <ImageView
                    android:layout_width="24dp"
                    android:layout_height="24dp"
                    android:src="@drawable/ic_baseline_file_copy_24"
                    android:layout_margin="8dp"/>
        
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Copy Link"
                    android:layout_gravity="center_vertical"
                    android:padding="8dp"/>
            </LinearLayout>
        
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="horizontal"
                android:id="@+id/delete"
                android:background="?android:attr/selectableItemBackground"
                android:padding="8dp">
        
                <ImageView
                    android:layout_width="24dp"
                    android:layout_height="24dp"
                    android:src="@drawable/ic_baseline_delete_24"
                    android:layout_margin="8dp"/>
        
                <TextView
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:text="Delete File Selection"
                    android:layout_gravity="center_vertical"
                    android:padding="8dp"/>
            </LinearLayout>
        </LinearLayout>
        
    

    then create a method

           private void showBottomSheetDialog() {
        
            final BottomSheetDialog bottomSheetDialog = new BottomSheetDialog(this);
      LayoutInflater layoutInflater = LayoutInflater.from(context)
            View dialogView = layoutInflater.inflate(R.layout.bottom_sheet_dialog_layout, null)
            bottomSheetDialog.setContentView(dialogView)
           
            bottomSheetDialog.show();
        }
    

    go to activity onCreate method in you button action listener call the method.

        Button mBottton = findViewById(R.id.button);
            mBottton.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    showBottomSheetDialog()
            }
        });