在 Material Design 中，Toolbar 是一个重要的组件，它被广泛应用于 Android 和 Web 应用程序中。Toolbar 可以用于展示应用程序的标题、菜单、操作按钮等，同时还可以通过自定义样式来满足不同的需求。本文将介绍 Toolbar 的使用技巧及常见问题解决方法，帮助你更好地使用 Toolbar。
Toolbar 的基本用法
Toolbar 是一个可扩展的 View，它可以包含一个应用程序图标、一个标题、一个子标题以及操作按钮。以下是 Toolbar 的基本用法：
<androidx.appcompat.widget.Toolbar
android:id="@+id/toolbar"
android:layout_width="match_parent"
android:layout_height="?attr/actionBarSize"
android:background="?attr/colorPrimary"
android:elevation="4dp"
android:theme="@style/ThemeOverlay.AppCompat.ActionBar" />其中，android:layout_height="?attr/actionBarSize" 表示 Toolbar 的高度与系统 ActionBar 的高度相同。android:background="?attr/colorPrimary" 表示 Toolbar 的背景色与应用程序主题色相同。android:elevation="4dp" 表示 Toolbar 的阴影高度为 4dp。android:theme="@style/ThemeOverlay.AppCompat.ActionBar" 表示 Toolbar 的样式为系统 ActionBar 样式的覆盖样式。
在 Activity 的 onCreate() 方法中，需要将 Toolbar 设置为 ActionBar：
Toolbar toolbar = findViewById(R.id.toolbar); setSupportActionBar(toolbar);
自定义 Toolbar 样式
Toolbar 可以通过自定义样式来满足不同的需求。以下是一个自定义 Toolbar 样式的示例：
-- -------------------- ---- -------
------ ------------------------- -----------------------------------------
----- -----------------------------------------------------
----- -----------------------------------
----- -------------------------------------------------------------------
----- -------------------------------------------------------------------------
----- ---------------------------------------------------
----- ---------------------------------------
----- -------------------------------------
----- -------------------------------------------
----- -----------------------------------------
----- ---------------------------------------------
--------
------ --------------------------------- -------------------------------------------------------
----- --------------------------------------------
----- -----------------------------------
--------
------ ------------------------------------ ----------------------------------------------------------
----- -------------------------------------------
----- -----------------------------------
--------其中，parent="@style/Widget.AppCompat.Toolbar" 表示该样式继承自系统默认的 Toolbar 样式。<item name="android:background">@android:color/white</item> 表示 Toolbar 的背景色为白色。<item name="android:elevation">0dp</item> 表示 Toolbar 没有阴影。<item name="titleTextAppearance">@style/ToolbarTitleTextAppearance</item> 表示标题文本的样式为 ToolbarTitleTextAppearance，<item name="subtitleTextAppearance">@style/ToolbarSubtitleTextAppearance</item> 表示子标题文本的样式为 ToolbarSubtitleTextAppearance。<item name="android:minHeight">?attr/actionBarSize</item> 表示 Toolbar 的最小高度与系统 ActionBar 的高度相同。<item name="android:paddingStart">16dp</item> 和 <item name="android:paddingEnd">16dp</item> 表示 Toolbar 左右两侧的内边距为 16dp。<item name="android:contentInsetStart">0dp</item> 和 <item name="android:contentInsetEnd">0dp</item> 表示 Toolbar 左右两侧的内容区域与边缘的距离为 0dp。<item name="android:gravity">center_vertical</item> 表示 Toolbar 的内容垂直居中。
在 Activity 的 onCreate() 方法中，需要将自定义样式的 Toolbar 设置为 ActionBar：
Toolbar toolbar = findViewById(R.id.toolbar);
toolbar.setTitle("Custom Title");
toolbar.setSubtitle("Custom Subtitle");
setSupportActionBar(toolbar);常见问题解决方法
Toolbar 的宽度不正确
如果 Toolbar 的宽度不正确，可能是因为 Toolbar 包含了系统默认的 Navigation Icon，导致宽度计算错误。可以通过以下方式禁用 Navigation Icon：
Toolbar toolbar = findViewById(R.id.toolbar); setSupportActionBar(toolbar); toolbar.setNavigationIcon(null);
Toolbar 上的菜单项不显示
如果 Toolbar 上的菜单项不显示，可能是因为没有在 Activity 中重写 onCreateOptionsMenu() 方法，并使用 MenuInflater 加载菜单资源：
@Override
public boolean onCreateOptionsMenu(Menu menu) {
getMenuInflater().inflate(R.menu.toolbar_menu, menu);
return true;
}R.menu.toolbar_menu 表示菜单资源的 ID。
Toolbar 上的操作按钮点击事件不响应
如果 Toolbar 上的操作按钮点击事件不响应，可能是因为没有在 Activity 中重写 onOptionsItemSelected() 方法，并处理相应的菜单项点击事件：
-- -------------------- ---- -------
---------
------ ------- ------------------------------ ----- -
------ ------------------ -
---- ---------------------
-- -----------
------ -----
---- ------------------
-- -----------
------ -----
--------
------ ----------------------------------
-
-总结
本文介绍了 Material Design 中 Toolbar 的基本用法和自定义样式，以及常见问题解决方法。通过学习本文，你可以更好地使用 Toolbar，满足应用程序的不同需求。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/657a2d2fd2f5e1655d45fe94