BottomSheetDialog控件使用 （底部，可拖動彈窗）

 

效果圖.gif

1、添加design依賴

  implementation 'com.google.android.material:material:1.0.0'  

2、創建彈窗布局（dialog_bottomsheet.xml）
布局有個recycleView 和頭部布局

<?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="match_parent" android:layout_height="wrap_content" android:background="@drawable/sh" android:orientation="vertical"> <RelativeLayout android:layout_width="match_parent" android:layout_height="40dp"> <TextView android:layout_width="wrap_content" android:layout_height="wrap_content" android:layout_centerInParent="true" android:text="100首歌" android:textStyle="bold" /> <ImageView android:layout_width="24dp" android:layout_height="24dp" android:layout_alignParentRight="true" android:layout_centerVertical="true" android:layout_marginRight="10dp" android:src="@drawable/error" /> </RelativeLayout> <androidx.recyclerview.widget.RecyclerView android:id="@+id/dialog_recycleView" android:layout_width="match_parent" android:layout_height="match_parent" /> </LinearLayout> 

3、recycleView 適配器就不寫了

4、要dialog頂部有弧度的話，創建 drawable 的xml文件

<shape xmlns:android="http://schemas.android.com/apk/res/android"> <corners android:topLeftRadius="10dp" android:topRightRadius="10dp" /> <solid android:color="#fff" /> </shape> 

5、到MainActivity中顯示

顯示dialog
private void showSheetDialog() { recyclerView = view.findViewById(R.id.dialog_recycleView); recyclerView.setLayoutManager(new LinearLayoutManager(this)); mainAdapter = new MainAdapter(R.layout.item_main, titleList); recyclerView.setAdapter(mainAdapter); bottomSheetDialog = new BottomSheetDialog(MainActivity.this, R.style.DialogTheme); bottomSheetDialog.setContentView(view); mDialogBehavior = BottomSheetBehavior.from((View) view.getParent()); mDialogBehavior.setPeekHeight(getWindowHeight());//dialog的高度 mDialogBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() { @Override public void onStateChanged(@NonNull View view, int i) { if (i == BottomSheetBehavior.STATE_HIDDEN) { bottomSheetDialog.dismiss(); mDialogBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED); } } @Override public void onSlide(@NonNull View view, float v) { } }); } private int getWindowHeight() { Resources res = MainActivity.this.getResources(); DisplayMetrics displayMetrics = res.getDisplayMetrics(); return displayMetrics.heightPixels; } 

最后：MainActivity.class (有刪減)

package com.example.bottomsheetdialog; import androidx.annotation.NonNull; import androidx.appcompat.app.AppCompatActivity; import androidx.recyclerview.widget.LinearLayoutManager; import androidx.recyclerview.widget.RecyclerView; import android.content.res.Resources; import android.os.Bundle; import android.util.DisplayMetrics; import android.util.Log; import android.view.View; import android.widget.Button; import com.google.android.material.bottomsheet.BottomSheetBehavior; import com.google.android.material.bottomsheet.BottomSheetDialog; import java.util.ArrayList; import java.util.List; public class MainActivity extends AppCompatActivity { private BottomSheetDialog bottomSheetDialog; private BottomSheetBehavior mDialogBehavior; private RecyclerView recyclerView; private MainAdapter mainAdapter; private List<String> titleList = new ArrayList<>(); @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); findViewById(R.id.main_btn1).setOnClickListener(new View.OnClickListener() { @Override public void onClick(View view) { initData(); showSheetDialog1(); bottomSheetDialog.show(); } }); } private void showSheetDialog1() { View view = View.inflate(MainActivity.this, R.layout.dialog_bottomsheet, null); recyclerView = view.findViewById(R.id.dialog_recycleView); recyclerView.setLayoutManager(new LinearLayoutManager(this)); mainAdapter = new MainAdapter(R.layout.item_main, titleList); recyclerView.setAdapter(mainAdapter); bottomSheetDialog = new BottomSheetDialog(MainActivity.this, R.style.DialogTheme); bottomSheetDialog.setContentView(view); mDialogBehavior = BottomSheetBehavior.from((View) view.getParent()); mDialogBehavior.setPeekHeight(getPeekHeight()); } /** * 彈窗高度，默認為屏幕高度的四分之三 * 子類可重寫該方法返回peekHeight * * @return height */ protected int getPeekHeight() { int peekHeight = getResources().getDisplayMetrics().heightPixels; //設置彈窗高度為屏幕高度的3/4 return peekHeight - peekHeight / 3; } private void initData() { for (int i = 0; i < 110; i++) { titleList.add("item" + i); } } } 

如果要實現 網易雲音樂 之占一半的效果 ，那dialog的xml文件就要限定高度
如果要實現全屏高度的話,設置高度方法改為這個

  private int getWindowHeight() { Resources res = MainActivity.this.getResources(); DisplayMetrics displayMetrics = res.getDisplayMetrics(); return displayMetrics.heightPixels; } 

參考文章：https://blog.csdn.net/lhy349/article/details/80833840#commentBox

 

作者：郭昌鑫
鏈接：https://www.jianshu.com/p/859943121b05
來源：簡書
著作權歸作者所有。商業轉載請聯系作者獲得授權，非商業轉載請注明出處。