概述
ToolBar 是 Android 平台上一个重要的 UI 控件，它可以实现顶部的导航栏和菜单等功能。Material Design 是 Google 推荐的一种设计风格，在 Android 平台上广泛应用，为用户带来更加舒适、自然的使用体验。本文将介绍 Material Design 下 ToolBar 的使用方法，包括样式、布局、事件等方面的内容。
样式
在 Material Design 中，ToolBar 的样式需要遵循一些规范，比如必须有明确的阴影效果，颜色与 UI 设计要协调等。以下是一个基本的 ToolBar 样式，代码使用了 Material Design 组件库（Material Components）提供的风格：
-- -------------------- ---- ------- ------------------------------------------------ ----------------------------------- ------------------------------------ ---------------------------------------------------------------------- --------------------------------------------------- ------------------------- ----------------------------------- ------------------------------------------- ------------- -------- -------------------------------------- ------------------------ -- --------------------------------------------------展开代码
这里 AppBarLayout 作为 ToolBar 的容器，可以添加其他的子控件。MaterialToolbar 则是一个具体的 ToolBar 实现，它支持设置标题、导航图标和菜单等属性。app:menu 属性指定了一个菜单资源文件，我们会在后面的部分介绍它的用法。
布局
除了上面的样式设置之外，还需要注意 ToolBar 在布局过程中的一些细节。一种常见的方法是使用 CoordinatorLayout 和 FloatingActionButton 配合，实现 ToolBar 向上滚动时自动隐藏、向下滚动时自动显示的效果，示例代码如下：
-- -------------------- ---- ------- ---------------------------------------------------- ----------------------------------- ------------------------------------- ------------------------------------------ ------------------------------- ----------------------------------- ------------------------------------ ------------------------------------------------------------ -- ---------------------------------------------------------------------- --------------------- ----------------------------------- ------------------------------------ ---------------------------- ------------------------------ ------------------------------------ ------------------------------------- -- ------------------------------------------------ ------------------------------ ----------------------------------- ------------------------------------ ---------------------------------------------------------------------- --------------------------------------------------- ------------------------- ----------------------------------- ------------------------------------------- ------------- -------- -------------------------------------- ------------------------ -- -------------------------------------------------- ------------------------------------------------------展开代码
这里 AppBarLayout 和 ToolBar 的代码同样使用了前面的样式示例，需要注意的是，在 CoordinatorLayout 中，我们使用了一个 RecyclerView 和一个 FloatingActionButton。app:layout_behavior 属性指定了 RecyclerView 的滚动行为，使得 ToolBar 在 RecyclerView 滚动时呈现不同的状态。FloatingActionButton 的位置使用了 app:layout_anchor 和 app:layout_anchorGravity 属性进行设置，这样它就会跟随 AppBarLayout 的位置而变化。
事件
在 ToolBar 的使用中，用户可能会涉及到一些事件，比如菜单点击、标题点击等。在代码中，我们可以通过设置监听器来实现这些事件的处理。下面是一个简单的示例，在菜单项被选中时，弹出一个提示框：
-- -------------------- ---- ------- ------- ------- - --------------------------- -------------------------------------- --------------------------------- - --------- ------ ------- ------------------------ ----- - -- ----------------- -- --------------------- - --------------------------------- --------- --------- --------------------------- ------ ----- - ------ ------ - --- -------------------- ---------- ------------------------------ ---------------------- - --------- ------ ---- ------------ -- - --------------------------------- ------ --------- --------------------------- - ---展开代码
这里我们使用了 setOnMenuItemClickListener 和 setOnClickListener 方法，分别监听了菜单项和标题的点击事件。在菜单项点击时，我们进行了一个简单的判断，输出一个提示框。在标题点击时，我们同样输出一个提示框，告诉用户点了这个东西不会有啥用。
总结
本文介绍了 Material Design 下 ToolBar 的使用方法，包括样式、布局、事件等方面。在实际开发中，我们需要根据具体的需求进行设置，达到最佳的用户体验。同时，我们也需要注意代码的可读性和可维护性，使得我们的工作更加高效、快速、可靠。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/654d877f7d4982a6eb6eace5
