Wear 导航和操作

本课介绍如何在应用中实现操作抽屉和抽屉式导航栏。

作为 Wear OS by Google 谷歌设计的一部分，我们提供了两种交互抽屉式导航栏：

抽屉式导航栏。您可以支持用户在应用中的视图之间切换。
- 多页抽屉式导航栏。您可以在单个页面或多个页面中显示抽屉式导航栏的内容。如需在多个页面中显示抽屉式导航栏内容，请使用 app:navigationStyle 属性，并将值设为 multiPage。
操作抽屉。操作抽屉可让用户轻松地访问您应用中的常用操作。操作抽屉显示在屏幕底部，并且包含特定于上下文的用户操作，与手机上的操作栏类似。当用户到达滚动内容的顶部或底部时，操作抽屉就会滑出。
- 设置标题：您可以使用 setTitle() 方法（属于 WearableActionDrawerView）或 app:drawerTitle 属性来设置操作抽屉的标题。

图 1. 抽屉式导航栏和操作抽屉。

有关本页介绍的类的详细信息，请参阅 androidx.wear.widget.drawer 软件包的 API 参考文档。这些类位于 Wear 界面库中。如需了解 Wear 界面库以及由该库取代的弃用类（包括以前用于操作抽屉和抽屉式导航栏的类），请参阅使用 Wear 界面库。

请参阅以下相关资源：

抽屉式导航栏设计

Wear 抽屉式导航栏示例

针对抽屉式导航栏和操作抽屉式导航栏的 Codelab

创建抽屉式导航栏布局

要在应用中添加操作抽屉或抽屉式导航栏，请将包含 WearableDrawerLayout 对象的界面声明为布局的根视图。在 WearableDrawerLayout 中，如果内容滚动，则必须支持嵌套滚动。

例如，以下布局使用了 WearableDrawerLayout，该对象包含三个子视图：一个包含主要内容的 LinearLayout、一个抽屉式导航栏和一个操作抽屉。

    <androidx.wear.widget.drawer.WearableDrawerLayout
        xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:id="@+id/drawer_layout"
        android:layout_width="match_parent"
        android:layout_height="match_parent">
        <ScrollView
            android:id="@+id/content"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:nestedScrollingEnabled="true">
            <LinearLayout
                android:id="@+id/linear_layout"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:orientation="vertical" />
        </ScrollView>
        <android.support.wear.widget.drawer.WearableNavigationDrawerView
            android:id="@+id/top_navigation_drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent"/>
        <android.support.wear.widget.drawer.WearableActionDrawerView
            android:id="@+id/bottom_action_drawer"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:actionMenu="@menu/action_drawer_menu"/>
    </androidx.wear.widget.drawer.WearableDrawerLayout>

注意：在穿戴式设备支持库中，WearableDrawerLayout 类取代了一个与其相似的已弃用类。

默认情况下，抽屉式导航栏是单页的。不过，单页抽屉式导航栏可能不适合您的应用，特别是在您的应用拥有超过 7 个视图，或具有不易用图标表示的视图时。要创建多页抽屉式导航栏，请将属性 navigationStyle="multiPage" 应用到抽屉式导航栏。例如：

    <androidx.wear.widget.drawer.WearableNavigationDrawerView
        android:id="@+id/top_drawer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/holo_red_light"
        app:navigationStyle="multiPage">

初始化抽屉式导航栏内容

作为创建 Activity 的主要步骤之一，您需要初始化抽屉式导航栏的项目列表。您必须扩展 WearableNavigationDrawerAdapter 来填充抽屉式导航栏的内容。您可以使用 app:actionMenu 属性在布局 XML 文件中填充操作抽屉的内容：

    app:actionMenu="@menu/action_drawer_menu"

以下代码展示了如何初始化抽屉式导航栏的内容：

Kotlin

    class MainActivity : Activity(), MenuItem.OnMenuItemClickListener {

        private lateinit var wearableDrawerLayout: WearableDrawerLayout
        private lateinit var wearableNavigationDrawer: WearableNavigationDrawerView
        private lateinit var wearableActionDrawer: WearableActionDrawerView
        ...
        override fun onCreate(savedInstanceState: Bundle?) {
            super.onCreate(savedInstanceState)
            setContentView(R.layout.activity_main)
            ...
            // Top navigation drawer
            wearableNavigationDrawer = findViewById(R.id.top_navigation_drawer)
            wearableNavigationDrawer.setAdapter(YourImplementationNavigationAdapter(this))
            // Peeks navigation drawer on the top.
            wearableNavigationDrawer.controller.peekDrawer()
            // Bottom action drawer
            wearableActionDrawer =
                    findViewById<WearableActionDrawerView>(R.id.bottom_action_drawer).apply {
                        // Peeks action drawer on the bottom.
                        controller.peekDrawer()
                        setOnMenuItemClickListener(this@MainActivity)
                    }
        }
    }

Java

    public class MainActivity extends Activity implements
            OnMenuItemClickListener {
        private WearableDrawerLayout wearableDrawerLayout;
        private WearableNavigationDrawerView wearableNavigationDrawer;
        private WearableActionDrawerView wearableActionDrawer;
        ...
        @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            setContentView(R.layout.activity_main);
            ...
            // Top navigation drawer
            wearableNavigationDrawer = (WearableNavigationDrawerView) findViewById(R.id.top_navigation_drawer);
            wearableNavigationDrawer.setAdapter(new YourImplementationNavigationAdapter(this));
            // Peeks navigation drawer on the top.
            wearableNavigationDrawer.getController().peekDrawer();
            // Bottom action drawer
            wearableActionDrawer = (WearableActionDrawerView) findViewById(R.id.bottom_action_drawer);
            // Peeks action drawer on the bottom.
            wearableActionDrawer.getController().peekDrawer();
            wearableActionDrawer.setOnMenuItemClickListener(this);
        }
    }

创建自定义抽屉式导航栏视图

要在抽屉式导航栏中使用自定义视图，请将 WearableDrawerView 添加到 WearableDrawerLayout 中。要设置滑出视图和抽屉式导航栏内容，请将它们添加为 WearableDrawerView 的子视图，并分别在 peekView 和 drawerContent 属性中指定它们的 ID。另外，还可将 android:layout_gravity 属性的值设为 top 或 bottom（仅支持 top 和 bottom）来指定抽屉式导航栏的位置。

自定义滑出视图必须指定其自己的上下内边距。

以下示例指定了一个具有滑出视图和抽屉式导航栏内容的顶部抽屉式导航栏：

    <androidx.wear.widget.drawer.WearableDrawerView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="top"
        android:background="@color/red"
        app:drawerContent="@+id/drawer_content"
        app:peekView="@+id/peek_view">
        <FrameLayout
            android:id="@id/drawer_content"
            android:layout_width="match_parent"
            android:layout_height="match_parent">
            <!-- Drawer content goes here.  -->
        </FrameLayout>
        <LinearLayout
            android:id="@id/peek_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:paddingTop="8dp"
            android:paddingBottom="8dp"
            android:orientation="horizontal">
            <!-- Peek view content goes here.  -->
        </LinearLayout>
    </androidx.wear.widget.drawer.WearableDrawerView>

监听抽屉式导航栏事件

要监听抽屉式导航栏事件，请在 WearableDrawerLayout 上调用 setDrawerStateCallback() 并传入 WearableDrawerLayout.DrawerStateCallback 的实现。此抽象类提供抽屉式导航栏事件（例如 onDrawerOpened()、onDrawerClosed() 和 onDrawerStatechanged()）的回调。

滑出抽屉式导航栏

要使抽屉式导航栏滑出，请调用 getController() 以访问 peekDrawer()、closeDrawer() 和 openDrawer()。

例如：

Kotlin

    wearableActionDrawer.controller.peekDrawer()

Java

    wearableActionDrawer.getController().peekDrawer();

默认情况下，当有多项操作时，操作抽屉会显示第一项操作和一个 V 形图标。如果您希望只显示溢出图标（三个垂直的点）而不显示第一项操作，可通过将 showOverflowInPeek 标志设为 true 来替换默认行为。例如：

    <androidx.wear.widget.drawer.WearableActionDrawerView
        android:id="@+id/bottom_drawer"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:background="@android:color/holo_blue_dark"
        app:showOverflowInPeek="true"/>

默认情况下，当用户到达主要滚动内容（即实现 NestedScrollingChild 的视图）的顶部或底部时（不论是通过正常滚动还是滑屏到达），操作抽屉都会滑出。如果您愿意，您还可以将 actionDrawer.setPeekOnScrollDownEnabled() 方法设为 true，使抽屉式导航栏在用户每次向下滚动内容时都滑出。

默认情况下，当用户到达内容的顶部时（不论是通过正常滚动还是滑屏到达），抽屉式导航栏都会滑出。