Android入门之Navigation使用

在使用Fragment的时候，打算使用最新的Navigation，采用大家推荐的单Activity来完成应用的构建。

要想使用Navigation，首先需要在res/navigation/下创建一个xml来设置自己的fragment页面，下面是代码示例。

<?xml version="1.0" encoding="utf-8"?>
<navigation 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:id="@+id/mobile_navigation"
    app:startDestination="@+id/nav_home">
    <!--启动页面为nav_home-->
    <fragment
        android:id="@+id/nav_home"
        android:name="com.example.bilibili01.ui.home.HomeFragment"
        android:label=""
        tools:layout="@layout/fragment_home" >
        <action
            android:id="@+id/action_nav_home_to_nav_tv"
            app:destination="@id/nav_tv" />
        <action
            android:id="@+id/action_nav_home_to_nav_news"
            app:destination="@id/nav_news" />
        <action
            android:id="@+id/action_nav_home_to_nav_shopping"
            app:destination="@id/nav_shopping" />
    </fragment>

    <fragment
        android:id="@+id/nav_gallery"
        android:name="com.example.bilibili01.ui.gallery.GalleryFragment"
        android:label="@string/menu_gallery"
        tools:layout="@layout/fragment_gallery" >
        <action
            android:id="@+id/action_nav_gallery_to_nav_shopping"
            app:destination="@id/nav_shopping" />
    </fragment>

    <fragment
        android:id="@+id/nav_slideshow"
        android:name="com.example.bilibili01.ui.slideshow.SlideshowFragment"
        android:label="@string/menu_slideshow"
        tools:layout="@layout/fragment_slideshow" />
    <fragment
        android:id="@+id/nav_tv"
        android:name="com.example.bilibili01.ui.tv.TVFragment"
        android:label="tv"
        tools:layout="@layout/fragment_tv" >
        <action
            android:id="@+id/action_nav_tv_to_nav_home"
            app:destination="@id/nav_home" />
        <action
            android:id="@+id/action_nav_tv_to_nav_news"
            app:destination="@id/nav_news" />
        <action
            android:id="@+id/action_nav_tv_to_nav_shopping"
            app:destination="@id/nav_shopping" />
    </fragment>
    <fragment
        android:id="@+id/nav_news"
        android:name="com.example.bilibili01.ui.news.NewsFragment"
        android:label="news"
        tools:layout="@layout/fragment_news" >
        <action
            android:id="@+id/action_nav_news_to_nav_home"
            app:destination="@id/nav_home" />
        <action
            android:id="@+id/action_nav_news_to_nav_tv"
            app:destination="@id/nav_tv" />
        <action
            android:id="@+id/action_nav_news_to_nav_shopping"
            app:destination="@id/nav_shopping" />
    </fragment>
    <fragment
        android:id="@+id/nav_shopping"
        android:name="com.example.bilibili01.ui.shopping.ShoppingFragment"
        android:label="shopping"
        tools:layout="@layout/fragment_shopping" >
        <action
            android:id="@+id/action_nav_shopping_to_nav_news"
            app:destination="@id/nav_news" />
        <action
            android:id="@+id/action_nav_shopping_to_nav_tv"
            app:destination="@id/nav_tv" />
        <action
            android:id="@+id/action_nav_shopping_to_nav_gallery"
            app:destination="@id/nav_gallery" />
        <action
            android:id="@+id/action_nav_shopping_to_nav_home"
            app:destination="@id/nav_home" />
    </fragment>
</navigation>

这是直观的设计图。

之后，还需要在res/layout/目录下建立这些Fragment的父容器。也就是一个容器xml。

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout 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"
    app:layout_behavior="@string/appbar_scrolling_view_behavior"
    tools:showIn="@layout/app_bar_main">
        <fragment
            android:id="@+id/nav_host_fragment"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:defaultNavHost="true"
            app:layout_constraintLeft_toLeftOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:navGraph="@navigation/mobile_navigation"/>
            <!--navGraph说明自己的容器内的组件-->
</androidx.constraintlayout.widget.ConstraintLayout>

最后，再为各个Fragment建立action就可以了。

//       页面跳转设置
        ImageView imageView =(ImageView) root.findViewById(R.id.fragment1);
        imageView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                toolbar.setVisibility(View.VISIBLE);
                Navigation.findNavController(root).navigate(R.id.action_nav_tv_to_nav_home);
            }
        });
        ImageView imageView1 =(ImageView) root.findViewById(R.id.fragment3);
        imageView1.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Navigation.findNavController(root).navigate(R.id.action_nav_tv_to_nav_news);
            }
        });
        ImageView imageView2 =(ImageView) root.findViewById(R.id.fragment4);
        imageView2.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Navigation.findNavController(root).navigate(R.id.action_nav_tv_to_nav_shopping);
            }
        });

B站客户端小实践地址(GitHub)