Jetpack (四) 之 Navigation

作者: zcwfeng | 来源:发表于2021-01-22 22:17 被阅读0次

    Navigation 的 基本使用

    1. gradle 库导入 根据Java 或者 Kotlin 需求导入
    dependencies {
      def nav_version = "2.3.2"
    
      // Java language implementation
      implementation "androidx.navigation:navigation-fragment:$nav_version"
      implementation "androidx.navigation:navigation-ui:$nav_version"
    
      // Kotlin
      implementation "androidx.navigation:navigation-fragment-ktx:$nav_version"
      implementation "androidx.navigation:navigation-ui-ktx:$nav_version"
    
      // Feature module Support
      implementation "androidx.navigation:navigation-dynamic-features-fragment:$nav_version"
    
      // Testing Navigation
      androidTestImplementation "androidx.navigation:navigation-testing:$nav_version"
    
      // Jetpack Compose Integration
      implementation "androidx.navigation:navigation-compose:1.0.0-alpha05"
    }
    
    1. 创建 navigation graph

    可以用AS界面,也可以手动创建

    res/navigation/nav_graph.xml

    <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/mainPage1Fragment">
    
        <fragment
            android:id="@+id/mainPage1Fragment"
            android:name="top.zcwfeng.jetpack.navigation.MainPage1Fragment"
            android:label="fragment_main_page1"
            tools:layout="@layout/fragment_main_page1" >
            <action
                android:id="@+id/fragment1_2"
                app:destination="@id/mainPage2Fragment" />
        </fragment>
        <fragment
            android:id="@+id/mainPage2Fragment"
            android:name="top.zcwfeng.jetpack.navigation.MainPage2Fragment"
            android:label="fragment_main_page2"
            tools:layout="@layout/fragment_main_page2" >
            <action
                android:id="@+id/fragment2_3"
                app:destination="@id/mainPage3Fragment" />
        </fragment>
        <fragment
            android:id="@+id/mainPage3Fragment"
            android:name="top.zcwfeng.jetpack.navigation.MainPage3Fragment"
            android:label="fragment_main_page3"
            tools:layout="@layout/fragment_main_page3" >
            <action
                android:id="@+id/fragment3_2"
                app:destination="@id/mainPage2Fragment" />
        </fragment>
    </navigation>
    

    重点看下这几个属性

    navigation ---->android:id 和 app:startDestination 声明
    fragment ------> id,name,label
    fragment 子标签 action----> id,app:destination

    1. 添加 NavHost 到 activity

    主要的NavigationActivity的activity_navigation.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"
        tools:context=".navigation.NavigationActivity">
        <fragment
            android:id="@+id/fragment"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="409dp"
            android:layout_height="729dp"
            app:defaultNavHost="true"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintRight_toRightOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:layout_constraintLeft_toLeftOf="parent"
            app:navGraph="@navigation/nav_graph" />
    </androidx.constraintlayout.widget.ConstraintLayout>
    

    指定navigation文件
    app:navGraph="@navigation/nav_graph"
    主容器fragment
    android:name="androidx.navigation.fragment.NavHostFragmen"
    app:defaultNavHost="true" 拦截系统back键

    官网API

    新版的官网可以用 FragmentContainerView,查看源码也是instantiate一个实例fragment,大同小异

    1. 添加 destinations 到 navigation graph

    2. 导航到目标

    底部导航切换的做法

    BottomNavigationView bottomNavigationView = findViewById(R.id.fragment1_2)...;
    
    NavController 创建两种方式
    
    1. NavController controller=Navigation.findNavController(this,R.id.fragment_nav_host);
    
    2.  NavHostFragment navHostFragment = (NavHostFragment) getSupportFragmentManager().findFragmentById(R.id.fragment_nav_host);
     NavController controller = navHostFragment.getNavController();
    
    controller 绑定到底部导航View(MaterialDesign中)
    NavigationUI.setupWithNavController(bottomNavigationView,controller);
    
    

    回退到上一步的api

    Navigation.findNavController(view).navigateUp();
    或者指定目标
    Navigation.findNavController(view).navigate(R.id.action_page2);
    

    相关文章

      网友评论

        本文标题:Jetpack (四) 之 Navigation

        本文链接:https://www.haomeiwen.com/subject/obwjzktx.html