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

  • 相关阅读:
    【洛谷】P1156 垃圾陷阱【DP】
    【洛谷】P1063 能量项链【区间DP】
    Android
    Android
    Android中使用ViewPager制作广告栏效果
    Android UI 设计之 TextView EditText 组件属性方法最详细解析
    GitHub 优秀的 Android 开源项目
    下载 编译 Android源代码 和 Android kernel源代码
    UML建模语言入门 -- 静态图详解 类图 对象图 包图 静态图建模实战
    Android开发技巧--Application, ListView排列,格式化浮点数,string.xml占位符,动态引用图片
  • 原文地址:https://www.cnblogs.com/javalinux/p/14585599.html
Copyright © 2011-2022 走看看