Material Design 中的 Toolbar 使用方法详解

Toolbar 是 Material Design 中常用的 UI 控件之一，它通常用于显示应用程序的标题和操作按钮。在本文中，我们将深入探讨 Toolbar 的使用方法，包括如何自定义样式、添加菜单和操作按钮等。

基本用法

使用 Toolbar 非常简单，只需在布局文件中添加一个 Toolbar 控件即可：

<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:title="My Toolbar" />

在 Activity 中，我们需要通过 setSupportActionBar 方法将 Toolbar 设置为 ActionBar：

Toolbar toolbar = findViewById(R.id.toolbar);
setSupportActionBar(toolbar);

这样就可以在 Toolbar 中显示应用程序的标题了。

自定义样式

Toolbar 支持自定义样式，包括背景色、文字颜色、图标等。我们可以在布局文件中添加一些属性来实现自定义样式：

<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="#2196F3"
    android:titleTextColor="#FFFFFF"
    app:title="My Toolbar" />

在这个例子中，我们将 Toolbar 的背景色设置为蓝色，文字颜色设置为白色。

添加菜单

Toolbar 还支持添加菜单，我们可以在布局文件中添加一个 Menu 控件来实现：

<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:title="My Toolbar"
    app:menu="@menu/toolbar_menu" />

在这个例子中，我们将 Toolbar 的菜单设置为 toolbar_menu.xml 文件中定义的菜单。

在 Activity 中，我们需要重写 onCreateOptionsMenu 方法来加载菜单：

@Override
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.toolbar_menu, menu);
    return true;
}

这样就可以在 Toolbar 中显示菜单了。

添加操作按钮

Toolbar 还支持添加操作按钮，我们可以在布局文件中添加一个 ImageButton 控件来实现：

// javascriptcn.com 代码示例
<androidx.appcompat.widget.Toolbar
    android:id="@+id/toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:title="My Toolbar">
    <ImageButton
        android:id="@+id/toolbar_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_action_search"
        android:background="?attr/selectableItemBackgroundBorderless" />
</androidx.appcompat.widget.Toolbar>

在这个例子中，我们添加了一个搜索按钮。注意，我们需要将 ImageButton 的背景设置为 selectableItemBackgroundBorderless，这样才能正确显示点击效果。

在 Activity 中，我们可以通过 findViewById 方法获取 ImageButton 并为其添加点击监听器：

ImageButton button = findViewById(R.id.toolbar_button);
button.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        // 处理点击事件
    }
});

这样就可以在 Toolbar 中添加操作按钮了。

总结

本文介绍了 Material Design 中 Toolbar 的基本使用方法，包括自定义样式、添加菜单和操作按钮等。Toolbar 是一个非常实用的 UI 控件，它可以帮助我们快速构建美观且功能丰富的应用程序。希望本文对您有所帮助。

来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/65114c5b95b1f8cacd9bd3e0