Android 修改BottomSheetDialog不滾動到頂部

前言

今天談一談MD風格的彈窗BottomSheetDialog，很多應用中都會使用，效果很好，交互性很好。比如：抖音的評論框和網音樂的音樂列表。不過系統自帶的BottomSheetDialog會在展開狀態的時候可以繼續上滑至屏幕頂部，這樣會使得屏幕完全被遮擋，但是有時候我們不想讓其彈至屏幕頂部，比如抖音的評論框和網易雲的音樂列表，該如何實現呢？BottomSheetDialog還有一個效果相同的BottomSheetDialogFragment，平時更傾向於使用BottomSheetDialogFragment，因爲自帶有生命週期。下面我們就來實現上述的效果。

滑動機制

雖然本文不會去剖析BottomSheetDialog的滑動機制，但是可以大致瞭解其內部滑動機制。BottomSheetDialog的滑動機制是通CoordinatorLayout設置BottomSheetBehavior來實現的滑動效果，我們設置的XML再作爲子View設置到CoordinatorLayout中，即可實現隨手指滑動效果。還有一些概念性的東西需要了解，如下：

• mPeekHeight ：爲彈出時候的高度
• mMaxHeight ：爲可滑動的最大高度
• peekHeightMin：爲彈窗最小的高度（默認64dp）

即彈窗默認彈出的高度取peekHeightMin和mPeekHeight 兩者中的大值。默認情況下mPeekHeight 爲屏幕高度的9/16，因此默認情況下，彈窗高度爲屏幕高度的9/16。

參數介紹

本文主要對BottomSheetDialog的幾個屬性做控制，以便達到我們想實現的效果，具體屬性四個如下：

• protected int mPeekHeight = -2 默認彈出高度，默認設置爲自適應（相當於wrap_content）
• protected int mMaxHeight = -2 彈出最大高度，默認爲自適應（同上）
• protected boolean mCanScrollTop = false 是否可以滑動到頂部，當mMaxHeight 大於mPeekHeight 有效，否則無效。
• protected boolean enableScroll = true 是否可滑動，默認可以滑動

BottomSheetDialog

/**
     * 通過設置window
     *
     * @param mWindow
     */
    private void performBeforeShow(Window mWindow) {
        if (mWindow == null) {
            return;
        }

        View view = mWindow.findViewById(android.support.design.R.id.design_bottom_sheet);
        if (view != null) {
            final BottomSheetBehavior mBottomSheetBehavior = BottomSheetBehavior.from(view);
            CoordinatorLayout parent = (CoordinatorLayout) view.getParent();
            int peekHeightMin = parent.getResources().getDimensionPixelSize(android.support.design.R.dimen.design_bottom_sheet_peek_height_min);

            int width = mWindow.getWindowManager().getDefaultDisplay().getWidth();
            int height = mWindow.getWindowManager().getDefaultDisplay().getHeight();
            int normalPeekHeight = Math.max(peekHeightMin, (height - width * 9 / 16));

            if (mBottomSheetBehavior != null) {
                if (!mCanScrollTop) {
                    int peekHeight = mPeekHeight > 0 ? mPeekHeight : normalPeekHeight;
                    int commonHeight = mMaxHeight < 0 ? peekHeight : mMaxHeight;
                    mBottomSheetBehavior.setPeekHeight(commonHeight);
                    mWindow.setLayout(width, commonHeight);
                } else {
                    if (mPeekHeight > 0) {
                        mBottomSheetBehavior.setPeekHeight(mPeekHeight);
                    }
                    if (mMaxHeight > 0) {
                        mWindow.setLayout(width, mMaxHeight);
                    }
                }

                mBottomSheetBehavior.setBottomSheetCallback(new BottomSheetBehavior.BottomSheetCallback() {
                    @Override
                    public void onStateChanged(@NonNull View bottomSheet, int newState) {
                        if (!enableScroll) {
                            mBottomSheetBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);
                        }
                        if (newState == BottomSheetBehavior.STATE_HIDDEN) {
                            dismiss();
                        }
                    }

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

                    }
                });
            }
        }

        mWindow.setGravity(Gravity.BOTTOM);

    }

說明：1、BottomSheetDialog通過BottomSheetBehavior來設置PeekHeight
2、BottomSheetBehavior的回調裏面控制是否可以滑動
3、最重要的一點就是此方法一定要在setContentView(contentView)方法之後調用才生效（可思考爲什麼）

BottomSheetDialogFragment

BottomSheetDialogFragment的實現方法一樣，只是調用時機在onstart方法裏

@Override
    public void onStart() {
        super.onStart();
        performBeforeShow(getDialog().getWindow());
    }

實現圓角

首先需要父類背景透明，然後再設置背景圓角即可

getDelegate().findViewById(android.support.design.R.id.design_bottom_sheet).setBackgroundColor(0x00000000);

<?xml version="1.0" encoding="utf-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <corners android:topLeftRadius="14dp" android:topRightRadius="14dp"></corners>
    <!--背景顏色-->
    <solid android:color="@color/white" />
</shape>

總結

本文主要是通過修改幾個常用屬性來達到默認情況下BottomSheetDialog實現不了的效果，外加實現圓角效果。如果項目中有多個彈窗，可通過集成的方式實現，只需通過修改父類中的屬性即可實現不同的效果，效果更佳。