Android Jetpack应用指南学习笔记6之Navigation(一)基本使用

最新推荐文章于 2024-06-13 22:37:33 发布

淡淡的香烟

最新推荐文章于 2024-06-13 22:37:33 发布

阅读量529

点赞数

分类专栏： Android Jetpack 文章标签： android ios java

本文链接：https://blog.csdn.net/u012556114/article/details/108422489

版权

Android Jetpack 专栏收录该内容

34 篇文章 20 订阅

订阅专栏

一. 在Android中单个Activity嵌套多个Fragment的UI架构方式，已被大多数Android工程师所接受和采用。但是，对Fragment的管理一直是一个比较麻烦的事情，工程师需要通过FragmentManager和FragmentTransaction来管理Fragment之间的切换。这其中还包括了对应用程序的App bar的管理，Fragment间的切换动画，Fragment间的参数传递;总之，使用起来不是特别友好。

为此，Android Jetpack提供的一个名为Navigation的UI架构组件。旨在方便我们管理Fragment页面。它具体有以下优势：

可视化的页面导航图，类似xcode中的StoryBoard，便于我们看清页面之间的关系
通过destination和action来完成页面间的导航
方便的页面切换动画
页面间类型安全的参数传递
通过NavigationUI类，对菜单，底部导航，抽屉菜单导航进行方便统一的管理
深层链接

二、首先，我们需要先对Navigation有一个大致的了解。

Navigation Graph

这是一种新型的XML资源文件，里面包含了应用程序所有的页面及页面之间的关系

NavHostFragment

这是一个特殊的布局文件，Navigation Graph中的页面通过该Fragment展示

NavController

这是一个Java/Kotlin对象，用于在代码中完成Navigation Graph中具体的页面切换

1.创建Navigation Gragh

新建一个项目，这里我选用的是Java作为项目语言

第一步，选中res文件夹 -> New -> Android Resource File

Resource type 选择：Navigation

2.点击OK按钮，Navigation Graph就创建完成了。

3.nav_graph.xml文件与普通的布局文件类似，都有Design和Text切换卡，Text就是XML布局文件。我们还能在Destinations面板中，看见No NavHostFragments found的提示。

注意：Navigation的使用需要依赖支持库，所以Android Studio可能会提示你，是否自动帮你添加支持库依赖，点击确定就可以

在App的build.gradle目录下手动添加依赖。

implementation 'android.arch.navigation:navigation-fragment:1.0.0'
implementation 'android.arch.navigation:navigation-ui:1.0.0'

4.添加NavHostFragment,我们将其添加到Activity的布局文件中，作为其他Fragment的容器.

<?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"
    tools:context=".MainActivity">

    <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_constraintBottom_toBottomOf="parent"
        app:layout_constraintLeft_toLeftOf="parent"
        app:layout_constraintRight_toRightOf="parent"
        app:layout_constraintTop_toTopOf="parent"
        app:navGraph="@navigation/nav_graph"/>

</androidx.constraintlayout.widget.ConstraintLayout>
android:name="androidx.navigation.fragment.NavHostFragment"

这句话是在告诉系统，这是一个特殊的Fragment 。

app:defaultNavHost="true"

将defaultNavHost属性设置为true，则该Fragment会自动处理系统返回键，即，当用户按下手机的返回按钮时，系统能自动将当前的Fragment推出。

app:navGraph="@navigation/nav_graph"

设置该Fragment对应的导航图。

5.接下来让我们回到导航图。此时，在Destinations面板中出现了我们刚才设置的NavHostFragment

接着，点击加号，以及Create new destination按钮，让我们创建一个destination。

注意：destination是目的地，即你想要去的地方。可以是Fragment或者Activity，但最常见的是Fragment，Navigation组件的目地就是方便开发者在一个Activity中管理多个Fragment。在此我们创建一个MainFragment。

可以看到系统自动为你生成了一个空白的Fragment。

Start表示这是起始Fragment，即NavHostFragment容器首先要展示的Fragment。让我们点击Text.

<?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/nav_graph"
    app:startDestination="@id/mainFragment">

    <fragment
        android:id="@+id/mainFragment"
        android:name="com.example.navigationbasicdemo.fragment.MainFragment"
        android:label="fragment_main"
        tools:layout="@layout/fragment_main">
</navigation>

我们可以看到navigation标签下的 startDestination属性，该属性指定起始destination为mainFragment

app:startDestination="@id/mainFragment"

6.运行程序，可以看到一个空白的Fragment，即destination所指定的mainFragment

7.接下来，我们来看Navigation是如何实现Fragment页面之间的切换。

新建一个SecondFragment，然后将其添加到导航图中.

8.然后选中mainFragment，鼠标选中其右侧的圆圈，拖拽至右边的secondFragment，松开鼠标。

点击Text查看其XML代码，可以看到其中出现了一个<action/>标签，里面的app:destination属性表示它的目的地是seconedfragment。

9.使用NavController完成导航

最后，我们还需要通过NavController对象来完成页面跳转工作。

首先我们在MainFragment的布局文件中添加一个按钮.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <TextView
        android:id="@+id/tvTitle"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true"
        android:textSize="18sp"
        android:text="MainFragment"/>

    <Button
        android:id="@+id/btnToSecondFragment"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/tvTitle"
        android:textAllCaps="false"
        android:text="to SecondFragment"/>

</RelativeLayout>

接着打开MainFragment，响应这个按钮的点击事件，完成页面切换.

package com.example.navigationbasicdemo.fragment;

import android.os.Bundle;
import android.view.LayoutInflater;
import android.view.View;
import android.view.ViewGroup;

import androidx.fragment.app.Fragment;
import androidx.navigation.Navigation;

import com.example.navigationbasicdemo.R;

/**
 * @author: njb
 * @date: 2020/9/5 0005 1:20
 * @desc:
 */
public class MainFragment extends Fragment {
    @Override
    public void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
    }

    @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_main, container, false);

        //方法一
        view.findViewById(R.id.btnToSecondFragment).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
                Navigation.findNavController(v).navigate(R.id.action_mainFragment_to_secondFragment);
            }
        });

        //方法二
        view.findViewById(R.id.btnToSecondFragment).setOnClickListener(Navigation.createNavigateOnClickListener(R.id.action_mainFragment_to_secondFragment));

        return view;
    }
}

注意：这里有两种方式可以完成跳转：

Navigation.findNavController(v).navigate(R.id.action_mainFragment_to_secondFragment);

(Navigation.createNavigateOnClickListener(R.id.action_mainFragment_to_secondFragment))

最后放一张效果图：

可以看到，这里的Fragment切换没有动画效果，显得很生硬。Navigation组件为我们提供了很方便的添加动画的方式。

10.添加页面切换动画效果

首先，在res/anim文件夹下加入常见的动画文件：

接着，打开导航文件的Design面板，选中箭头，在右边的Animations中为其设置我们刚才加入的动画文件。

<?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/nav_graph"
    app:startDestination="@id/mainFragment">

    <fragment
        android:id="@+id/mainFragment"
        android:name="com.example.navigationbasicdemo.fragment.MainFragment"
        android:label="fragment_main"
        tools:layout="@layout/fragment_main">

        <action
            android:id="@+id/action_mainFragment_to_secondFragment"
            app:destination="@id/secondFragment"
            app:popEnterAnim="@anim/slide_in_left"
            app:popExitAnim="@anim/slide_out_right"
            app:enterAnim="@anim/slide_in_right"
            app:exitAnim="@anim/slide_out_left"/>

    </fragment>

    <fragment
        android:id="@+id/secondFragment"
        android:name="com.example.navigationbasicdemo.fragment.SecondFragment"
        android:label="fragment_second"
        tools:layout="@layout/fragment_second"/>
    <fragment
        android:id="@+id/blankFragment"
        android:name="com.example.navigationbasicdemo.BlankFragment"
        android:label="fragment_blank"
        tools:layout="@layout/fragment_blank" />

</navigation>

11.以上就是Navigation的基本使用，包括布局创建，添加，动画效果等等，最后放一张加入动画效果的图片：

项目源码地址如下：NavigationDemo: Navigation(一)基础入门,包含布局创建添加和使用

淡淡的香烟

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
Android Jetpack应用指南学习笔记6之Navigation(一)基本使用

一.在Android中单个Activity嵌套多个Fragment的UI架构方式，已被大多数Android工程师所接受和采用。但是，对Fragment的管理一直是一个比较麻烦的事情，工程师需要通过FragmentManager和FragmentTransaction来管理Fragment之间的切换。这其中还包括了对应用程序的App bar的管理，Fragment间的切换动画，Fragment间的参数传递，总之，使用起来不是特别友好。为此，Android Jetpack提供的一个名为Navigatio..
复制链接

扫一扫

专栏目录