Wear OS手表应用开发教程之-自定义顶部或底部导航-WearableDrawerView（动态控制）

Wear OS手表应用开发系列教程 点击直达

Wear OS手表应用开发教程之-创建应用
Wear OS手表应用开发教程之-创建环形滚动列表-WearableRecyclerView
Wear OS手表应用开发教程之-禁止全屏滑动返回Activity
Wear OS手表应用开发教程之-侧滑隐藏-SwipeDismissFrameLayout
Wear OS手表应用开发教程之-Activity使用微光模式-AmbientModeSupport
Wear OS手表应用开发教程之-顶部导航-WearableNavigationDrawerView
Wear OS手表应用开发教程之-底部导航-WearableActionDrawerView
Wear OS手表应用开发教程之-自定义顶部或底部导航-WearableDrawerView（动态控制）

本文标签

Android Studio	Wear OS	WearableActionDrawerView	底部导航

路过的年轻人啊，你是要用左手点个赞呢，还是要右手点个关注呢

前言：

正如Android一样，Wear OS也是谷歌创建的智能操作系统，属于Android的一个分支。假设你有过Android
Application开发经验，那给Wear OS 做应用适配将是一件非常简单的事情

之前的文章我们介绍了顶部导航和底部导航，其实除了Google推出的WearableNavigationDrawerView（顶部导航）和WearableActionDrawerView（底部导航）外，还给我们提供了自定义导航的功能，在这里我们可以自由实现任何界面。依照往期文章流程，我们先看效果图

效果展示：

顶部导航

底部导航

使用方法：

修改布局XML文件,如果说需要在ListView或RecyclerView滑动显示导航栏的话，需要在RecyclerView加入android:nestedScrollingEnabled="true"，至于自定义导航出现在顶部或底部修改WearableDrawerView中android:layout_gravity的值为top或bottom，具体使用方法请看xml中的注释

<?xml version="1.0" encoding="utf-8"?>
<!--顶级布局必须是这个-->
<androidx.wear.widget.drawer.WearableDrawerLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@color/dark_grey"
    android:padding="@dimen/box_inset_layout_padding"
    tools:context=".MainActivity"
    tools:deviceIds="wear">
	<!--如果说需要在ListView或RecyclerView滑动到底部自动显示的话需要在`RecyclerView`加入android:nestedScrollingEnabled="true"-->
    <androidx.wear.widget.WearableRecyclerView
        android:id="@+id/recycler_view"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:focusable="true"
        android:focusableInTouchMode="true"
        android:scrollbars="vertical" />
        
    <!-- layout_gravity支持选择top或bottom，即顶部导航和底部导航 -->
    <!-- 内容布局请在WearableDrawerView添加app:drawerContent -->
    <!-- 微微露出的界面请在WearableDrawerView添加app:peek_view -->
    <androidx.wear.widget.drawer.WearableDrawerView
        android:id="@+id/wearableDrawerView"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_gravity="bottom"
        android:background="@color/grey"
        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">
            <LinearLayout
                android:layout_width="match_parent"
                android:layout_height="match_parent"
                android:gravity="center">

                <TextView
                    android:id="@+id/textView1"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:drawableTop="@drawable/ic_done_black_24dp"
                    android:text="第一个" />

                <TextView
                    android:id="@+id/textView2"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_marginStart="16dp"
                    android:drawableTop="@drawable/ic_done_black_24dp"
                    android:text="第二个" />
            </LinearLayout>
        </FrameLayout>

        <!--微微露出的界面-->
        <LinearLayout
            android:id="@id/peek_view"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_gravity="center_horizontal"
            android:orientation="horizontal"
            android:paddingTop="8dp"
            android:paddingBottom="8dp">
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="底部导航栏" />
        </LinearLayout>
    </androidx.wear.widget.drawer.WearableDrawerView>

</androidx.wear.widget.drawer.WearableDrawerLayout>

到这里我们的自定义导航栏基本完成，如果需要高级的动态操控，请参考以下代码

class MainActivity : WearableActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
        // Enables Always-on
        setAmbientEnabled()

		/**以下是WearableActionDrawerView动态操控的代码**/
        //稍微漏出抽屉（即显示第一个item的图标）
        wearableDrawerView.controller.peekDrawer()
        //打开抽屉
        wearableDrawerView.controller.openDrawer()
        //关闭抽屉
        wearableDrawerView.controller.closeDrawer()
        //设置抽屉菜单的点击事件
        textView1.setOnClickListener {
            Toast.makeText(this,"测试1",Toast.LENGTH_SHORT).show()
        }
        textView2.setOnClickListener {
            Toast.makeText(this,"测试2",Toast.LENGTH_SHORT).show()
        }
    }
}

结语：

手表开发和Android开发相似度非常之高，所以强烈推荐Android开发者尝试一下这个新领域，虽然WearOS推出至今已有六个年头，但是国内厂商近两年才开始适配并开始生产，未来发展空间可期。

最后我还有一句话要说：

山有木兮木有枝，心悦君兮君不知。

佚名《越人歌》