Android 应用开发中 Material Design 设计风格的 Toolbar 使用

介绍

在 Android 应用开发中，Material Design 是一种流行的设计风格。而 Toolbar 是在 Material Design 中经常使用的 UI 控件，可以为应用程序提供顶部导航和可定制的操作按钮。它是 Android 系统中替代 Action Bar 的一个更为灵活和自定义的解决方案。Toolbar 为 Android 应用程序提供了一种完全可定制的界面元素，可以为设计师和开发人员提供最大的自由度。

安装

在 Android Studio 中，使用以下代码将 Toolbar 添加到应用程序的布局文件中:

// javascriptcn.com 代码示例
<android.support.v7.widget.Toolbar
    android:id="@+id/my_toolbar"
    android:layout_width="match_parent"
    android:layout_height="?attr/actionBarSize"
    android:background="?attr/colorPrimary"
    android:titleTextColor="#fff"
    android:subtitleTextColor="#fff"
    app:popupTheme="@style/ThemeOverlay.AppCompat.Light"
    app:layout_scrollFlags="scroll|enterAlways"
    app:layout_collapseMode="pin" />

其中，app:popupTheme="@style/ThemeOverlay.AppCompat.Light" 是为了在 Toolbar 上弹出菜单时使用正确的主题样式。

app:layout_scrollFlags="scroll|enterAlways" 和 app:layout_collapseMode="pin" 是为了使 Toolbar 能够随着应用程序内容的滚动而隐藏或显示。

使用

在 Activity 中需要调用以下代码以将 Toolbar 作为 ActionBar：

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

这个方法将启用 Toolbar 作为应用程序的顶级导航并提供与 Action Bar 相同的功能。

如果您需要为 Toolbar 添加菜单项，请先在其布局文件中定义菜单项：

// javascriptcn.com 代码示例
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item android:id="@+id/action_item1"
        android:title="Item 1"
        android:icon="@drawable/ic_menu_item1"
        app:showAsAction="ifRoom" />
    <item android:id="@+id/action_item2"
        android:title="Item 2"
        android:icon="@drawable/ic_menu_item2"
        app:showAsAction="ifRoom" />
</menu>

然后，在您的 Activity 或 Fragment 中，使用以下代码来处理菜单项的点击事件：

// javascriptcn.com 代码示例
public boolean onCreateOptionsMenu(Menu menu) {
    getMenuInflater().inflate(R.menu.menu_main, menu);
    return true;
}
 
@Override
public boolean onOptionsItemSelected(MenuItem item) {
    switch (item.getItemId()) {
        case R.id.action_item1:
            // 在此处添加 Item 1 的点击事件处理代码
            return true;
        case R.id.action_item2:
            // 在此处添加 Item 2 的点击事件处理代码
            return true;
        default:
            return super.onOptionsItemSelected(item);
    }
}

在这里，我们使用 onCreateOptionsMenu() 方法加载菜单项，并使用 onOptionsItemSelected() 方法处理在点击每个菜单项时触发的事件。

总结

通过这篇文章，我们了解了 Android 应用程序中 Material Design 设计风格的 Toolbar 的使用方法和代码示例。了解了如何将 Toolbar 添加到应用程序中并将其作为 ActionBar，并可以为 Toolbar 添加菜单项和处理点击事件。这些知识可以帮助开发人员创建更富有表现力和自定义的应用程序，并帮助设计师实现他们的设计理念。

来源：JavaScript中文网 ，转载请注明来源 本文地址：https://www.javascriptcn.com/post/652cb1587d4982a6ebe5045a