简介

在我们的开发中经常会遇到从底部弹出对话框的需求。在design包中，官方为我们提供了一种实现，就是BottomSheetDialog。它的使用和dialog一样，看下它的继承关系就知道了。

• 本文design包使用的版本为27.0.2

下面我们看下简单的使用代码。

        BottomSheetDialog dialog = new BottomSheetDialog(this);        dialog.setContentView(R.layout.bottom_dialog_view);        dialog.show();

是的。你没有看错，这些代码就够了。

BottomSheetDialog的兄弟还有个BottomSheetDialgFragment，来看下BottomSheetDialogFragment的代码。

public class BottomSheetDialogFragment extends AppCompatDialogFragment {    @Override    public Dialog onCreateDialog(Bundle savedInstanceState) {        return new BottomSheetDialog(getContext(), getTheme());    }}

是的。你还是没有看错，这就是全部的BottomSheetDialogFragment的代码。内部就是个BottomSheetDialog，就不做过多说明了。

代码实现

我们打开`BottomSheetDialog的代码查看的话会发现，实现也很简单。只有二百行代码。来看一下。
我们在使用的时候会调用。setContentView()方法，这里有三个重载的方法：

    @Override    public void setContentView(@LayoutRes int layoutResId) {        super.setContentView(wrapInBottomSheet(layoutResId, null, null));    }    @Override    public void setContentView(View view) {        super.setContentView(wrapInBottomSheet(0, view, null));    }    @Override    public void setContentView(View view, ViewGroup.LayoutParams params) {        super.setContentView(wrapInBottomSheet(0, view, params));    }

我们可以看到最后都调用了wrapInBottomSheet()方法。

private View wrapInBottomSheet(int layoutResId, View view, ViewGroup.LayoutParams params) {        // #1        final FrameLayout container = (FrameLayout) View.inflate(getContext(),                R.layout.design_bottom_sheet_dialog, null);        final CoordinatorLayout coordinator =                (CoordinatorLayout) container.findViewById(R.id.coordinator);        //#2        if (layoutResId != 0 && view == null) {            view = getLayoutInflater().inflate(layoutResId, coordinator, false);        }        //#3        FrameLayout bottomSheet = (FrameLayout) coordinator.findViewById(R.id.design_bottom_sheet);        mBehavior = BottomSheetBehavior.from(bottomSheet);        mBehavior.setBottomSheetCallback(mBottomSheetCallback);        mBehavior.setHideable(mCancelable);        if (params == null) {            bottomSheet.addView(view);        } else {            bottomSheet.addView(view, params);        }            //...省略部分代码        return container;    }

我们可以分两部分开，#2部分就是获取到设置的View这没什么好说的。 #1获取了个design_bottom_sheet_dialog的FrameLayout。代码如下：

mBehavior = BottomSheetBehavior.from(bottomSheet);

    @Override    protected void onStart() {        super.onStart();        if (mBehavior != null) {            mBehavior.setState(BottomSheetBehavior.STATE_COLLAPSED);        }    }

/** * An interaction behavior plugin for a child view of {@link CoordinatorLayout} to make it work as * a bottom sheet. */public class BottomSheetBehavior extends CoordinatorLayout.Behavior {...}

     app:behavior_hideable="true"     app:behavior_peekHeight="50dp"

mBehavior = BottomSheetBehavior.from(view);