简介
Material Design 是谷歌为 Android 平台提供的一种设计规范。BottomSheet 在这个规范中经常被用来显示一些操作菜单。BottomSheet 可以是显示在屏幕底部的卡片，也可以是隐藏在屏幕底部的，通过向上拖拽的方式展现出来的浮动视图。
在本文中，我们将学习如何使用 BottomSheet，实现 Material Design 中的交互效果。
创建 BottomSheet
要创建一个 BottomSheet，首先需要在 XML 布局文件中添加 BottomSheet 视图。可以在一个 Activity 或 Dialog 中添加一个 BottomSheet，例如：
-- -------------------- ---- -------
------------------------------------------------
----------------------------------------------------------
---------------------------------------------------
-----------------------------------
-------------------------------------
-------
------------------------------
-----------------------------------
------------------------------------
-------------------------------
------------------ ------ ------
--
------------------------------------------------
------------------------------
-----------------------------------
------------------------------------
----------------------------
------------------------------
-------------
-----------------------------------
------------------------------------
-------------------------------
---------
-----------------------------------
------------------------------------
-------------------- ----- --------
-----------------------
------------------------------
--
-------
-----------------------------------
------------------------------------
--------------------
----------------------------
--
---------------
--------------------------------------------------
--------------------------------------------------注意：上面的代码使用了 Android Support 库中的 BottomSheetDialog。
一旦 BottomSheet 视图被添加到 XML 布局文件中，可以使用以下代码打开 BottomSheet：
-- -------------------- ---- -------
------ ----------- - -------- --------------------------------
---------------------------------- ---------------------- -
---------
------ ---- ------------ -- -
----------------- ----------------- - --- -------------------------------------
---------------------------------------------------------------
-------------------------
-
---在上面的代码中，通过 findViewById 获取 Button，并在点击事件中显示 BottomSheet。BottomSheet 使用 setContentView 设置视图资源，并使用 show() 方法显示 BottomSheet。
自定义 BottomSheet
可以通过自定义 BottomSheet 视图的外观和行为，实现更多定制化的效果。下面是一个自定义的 BottomSheet 内容布局：
-- -------------------- ---- -------
-------------
----------------------------------------------------------
-------------------------------------
-----------------------------------
------------------------------------
----------------------
------------------------------
-----------------------------------------
-----------------------
-------------------------------------
----------------------------------
---------
-----------------------------------
------------------------------------
-------------------- ----- --------
----------------------------------------
------------------------------
-----------------------
-------------------------
---------------------------- --
-------
---------------------------
-----------------------------------
------------------------------------
----------------------------
-------------------- --
---------------注意：在自定义的 BottomSheet 布局中，使用了 Android 系统自带的属性实现了卡片样式，提高了视图的层次感。
为了让 Close 按钮起到关闭 BottomSheet 的作用，需要在 Activity 中添加如下代码：
Button buttonClose = (Button) findViewById(R.id.btn_close);
buttonClose.setOnClickListener(new View.OnClickListener() {
@Override
public void onClick(View v) {
bottomSheetDialog.dismiss();
}
});注意：上面的代码中，使用 bottomSheetDialog.dismiss() 方法关闭 BottomSheet。
总结
在本文中，我们学习了如何在 Material Design 中使用 BottomSheet，并通过示例代码详细讲解了如何创建和自定义 BottomSheet。BottomSheet 提供了一种简单、快速的交互方式，可以方便地实现 Material Design 中的设计效果。希望本文对大家学习 Material Design 有所帮助。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/64e575bbf6b2d6eab30e730a