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
来源:简书
著作权归作者所有。商业转载请联系作者获得授权,非商业转载请注明出处。


免责声明!

本站转载的文章为个人学习借鉴使用,本站对版权不负任何法律责任。如果侵犯了您的隐私权益,请联系本站邮箱yoyou2525@163.com删除。



 
粤ICP备18138465号  © 2018-2025 CODEPRJ.COM