Toolbar 作为 Material Design 中的重要组件之一，可用于显示应用的标题、菜单、操作按钮等，为用户提供更好的用户体验。本文将介绍如何使用 Toolbar，并提供示例代码及相关学习指导。
1. Toolbar 的基本使用
Toolbar 的基本使用方式很简单，只需在布局文件中添加一个 Toolbar 控件即可：
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/colorPrimary"
android:title="Toolbar Title" />为了实现 Toolbar 的常见功能，我们往往需要先在 Activity 中获取该控件，并设置相关属性：
val toolbar = findViewById<Toolbar>(R.id.toolbar) setSupportActionBar(toolbar)
其中，setSupportActionBar(toolbar) 方法是为了将该 Toolbar 对象绑定到 Activity/Fragment 中，并将该 Toolbar 作为应用的 ActionBar 显示出来。此时，我们还需要在布局文件中添加一个空白的 FrameLayout 作为内容视图容器：
<FrameLayout
android:id="@+id/content_frame"
android:layout_width="match_parent"
android:layout_height="match_parent" />如果我们需要在 Toolbar 中添加操作按钮，只需要在布局文件中添加 app:menu 属性即可：
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="@color/colorPrimary"
android:title="Toolbar Title"
app:menu="@menu/menu_toolbar" />此时，在 menu_toolbar.xml 文件中可以定义操作按钮的样式和动作：
-- -------------------- ---- -------
----- ----------------------------------------------------------
----------------------------------------------------
-----
-------------------------------
----------------------------------
-------------------------------------
------------------------- --
-----
---------------------------------
------------------------------------
---------------------------------------
------------------------ --
-------2. Toolbar 的高级使用
除了基本使用方式，Toolbar 还提供了许多高级功能，如自定义视图、折叠模式、搜索栏、滑动隐藏等。下面就简要介绍一下这些用法。
2.1 自定义视图
除了基本的标题和操作按钮，Toolbar 还可以显示自定义视图，如搜索框、用户头像等。实现方式也很简单，只需要在布局文件中添加一个自定义的 View，再调用 setSupportActionBar(toolbar) 方法即可：
-- -------------------- ---- -------
----------------------------------
-------------------------
-----------------------------------
-------------------------------------------
-----------------------------------------
---------
-----------------------------------
------------------------------------
-------------------------------
----------------------------------------
----------------------- --
------------------------------------val toolbar = findViewById<Toolbar>(R.id.toolbar) setSupportActionBar(toolbar)
2.2 折叠模式
Toolbar 的折叠模式可以将 Toolbar 收起，仅显示一个标题栏。虽然是隐藏了操作按钮，但是整个界面显得更加简洁明了。
实现方式为，在布局文件中设置 app:layout_scrollFlags="scroll|enterAlways|snap" 属性，将 Toolbar 的滚动标志设置为 “scroll|enterAlways|snap”：
-- -------------------- ---- -------
-----------------------------------------------------------
-----------------------------------
-----------------------------
------------------------------------------------
------------------ ------
----------------------------------
----------------------------------
-------------------------
-----------------------------------
-------------------------------------------
---------------------------------------
--------------------------------------------- --
-------------------------------------------------------------注意，CollapsingToolbarLayout 是需要和 Toolbar 一起使用的，而且该布局中必须包含一个可折叠的控件，如 ImageView 或 TextView。
2.3 搜索栏
Toolbar 还提供了搜索栏的功能，不仅美观实用，而且十分易于实现。具体方式是，将搜索框作为一个自定义视图，添加到 Toolbar 中。
-- -------------------- ---- -------
----------------------------------
-------------------------
-----------------------------------
-------------------------------------------
----------------------------------------
----------------------------------------------
----------
---------------------------
-----------------------------------
------------------------------------
----------------------------------------
--------------------------------- --
---------
---------------------------
-----------------------------------
------------------------------------
---------------------
------------------------
--------------------
----------------------- --
------------------------------------注意，此时还需要在 Activity 中设置搜索框相关的监听器。例如，当用户输入内容时，我们往往需要改变搜索框的图标来显示搜索进度：
-- -------------------- ---- -------
--- -------- - ---------------------------------------
--- -------- - --------------------------------------
---------------------------------- - -- --------- - --
-- --------- -- ----------------------------- -
------------------- - ---------
------- ------
----
- ---- -
-----
-
-2.4 滑动隐藏
最后，我们还可以为 Toolbar 添加滑动隐藏的功能，从而为用户提供更大屏幕空间。实现方式是，在布局文件中添加 app:layout_scrollFlags="scroll|enterAlways|snap" 属性，将 Toolbar 的滚动标志设置为 “scroll|enterAlways|snap”：
-- -------------------- ---- -------
------------------------------------------------
------------------------
-----------------------------------
------------------------------------
----------------------------------------------
-----------------------------------------------------------
---------------------
-----------------------------------
------------------------------------
-------------------------------------------------
----------------------------------
-------------------------
-----------------------------------
-------------------------------------------
----------------------------------------
--------------------------------------------- --
-------------------------------------------------------------
--------------------------------------------------
--- ------------ - ---------------------------------------
---------------------------------------------------------------------------- - ------------- -------------- --
-- -------------------- -- ------------------------------ -
------------------ - ---------
- ---- -
------------------ - ------------
-
--此时，当用户向下滑动时，Toolbar 会从屏幕上方消失，向上滑动时则会重新出现。不过需要注意的是，Toolbar 的滑动隐藏仅适用于 CoordinatorLayout 中的子视图。
3. 总结
以上就是本文介绍的关于 Material Design 中 Toolbar 的使用指南。除了基本的标题和操作按钮外，Toolbar 还可以实现自定义视图、折叠模式、搜索栏和滑动隐藏等高级功能，优化用户体验。读者可以通过本文提供的示例代码及相关学习指导，快速掌握这些功能，并在实际开发中灵活运用。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/659defd8add4f0e0ff71306d