美文网首页Android收藏集
JetPack学习笔记之Navigation(一)

JetPack学习笔记之Navigation(一)

作者: 秀儿2020 | 来源:发表于2020-08-05 21:12 被阅读0次

    JetPack学习笔记之Navigation(一)

    谷歌提供的Navigation组件,旨在管理页面和APP Bar。其中页面包含Activity和Fragment,但是主要是指Fragment,因为开发Navigation的主要目的就是方便在一个Activity中对多个Fragment进行管理。它具有以下的优点。

    • 可视化的页面导航图,类似于Xcode中的Story Board。
    • 通过destination和action完成页面间的导航。
    • 方便添加页面切换动画。
    • 页面间类型安全的参数传递。
    • 通过Navigation UI类,对菜单、底部导航、抽屉菜单导航进行统一的管理。
    • 支持深层链接DeepLink。
    1、Navigation的主要元素
    • Navigation Graph。包含程序中所有的页面以及页面间的跳转关系。
    • NavHostFragment。可以认为它是一个特殊的Fragment,是其他Fragment的容器。Navigation Graph中展示的页面和页面关系就是NavHostFragment中的内容,可以认为Navigation Graph是可视化展示,但是NavHostFragment是对应的代码逻辑。
    • NavController。这是一个Java/Kotlin对象,用于完成在Navigation Graph中具体的页面切换工作。
    当想切换Fragment时,使用NavController对象,告诉它你想去Navigation Graph中的哪个Fragment,NavController会将你想去的Fragment展示在NavHostFragment中。
    2、使用Navigation
    2.1创建Navigation Graph。

    右键点击res,然后在弹出菜单中选择“new” ---> "Android Resource File",填写文件名称,并将Resource Type修改为Navigation,文件夹名称使用默认的navigation,然后点击“OK”创建。

    image.png

    创建完成后可以看到,在build.gradle文件中添加了对应的依赖。

        implementation 'androidx.navigation:navigation-fragment:2.0.0'
        implementation 'androidx.navigation:navigation-ui:2.0.0'
    
    2.2 创建NavHostFragment。

    在Activity中添加一个Fragment,Activity布局如下所示:

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout 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:orientation="vertical"
        tools:context=".navigation.NavigationActivity">
    
        <fragment
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:id="@+id/nav_host_fragment"
            app:defaultNavHost="true"
            app:navGraph="@navigation/nav_graph"></fragment>
    
    </LinearLayout>
    

    其中有三点需要注意:

    • android:name="androidx.navigation.fragment.NavHostFragment"
      

      这行代码表示这个一个特殊的Fragment,即NavHostFragment。

    • app:defaultNavHost="true"
      

      为true表示Fragment会自动处理系统的返回键,即当用户按下返回键时,会自动的将当前展示的Fragment退出。

    • app:navGraph="@navigation/nav_graph"
      

      用于设置该Fragment对应的导航图。

    2.3 在NavHostFragment中添加destination即Fragment。
    image.png

    打开nav_graph.xml文件,切换到视图,依次点击加号按钮和Create new destination按钮,就可以创建Fragment。下图是创建两个Fragment之后的结果。

    image.png
    2.4 完成Fragment切换并添加动画。

    选中mainFragment2之后,右侧会出现一个蓝色的圆圈。拖动圆圈到第二个Fragment,然后会出现一个从mainFragment2指向secondFragment的箭头,右键点击该箭头,在弹出菜单中选择edit,可设置Fragment切换动画。如下图所示:

    image.png

    到目前为止nav_graph.xml代码如下所示:

    <?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/mainFragment2">
        <fragment
            android:id="@+id/mainFragment2"
            android:name="com.example.jetpackpro.navigation.MainFragment"
            android:label="fragment_main"
            tools:layout="@layout/fragment_main" >
            <action
                android:id="@+id/action_mainFragment2_to_secondFragment"
                app:destination="@id/secondFragment"
                app:enterAnim="@anim/fragment_open_enter"
                app:exitAnim="@anim/fragment_open_exit"
                app:popEnterAnim="@anim/fragment_close_enter"
                app:popExitAnim="@anim/fragment_close_exit" />
        </fragment>
        <fragment
            android:id="@+id/secondFragment"
            android:name="com.example.jetpackpro.navigation.SecondFragment"
            android:label="fragment_second"
            tools:layout="@layout/fragment_second" >
    
        </fragment>
    </navigation>
    
    2.5 使用NavController完成导航,即Fragment页面的跳转。

    在MainFragment中添加按钮,并为其添加点击事件,如下所示,即可完成跳转。

    jumpBtn.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View v) {
                    Navigation.findNavController(v).navigate(R.id.action_mainFragment2_to_secondFragment);
                }
            });
    
    3、使用safe args传递参数。

    在使用Navigation导航时,依然可以使用之前的Bundle的方式进行参数传递。

    比如在MainFragment中进行跳转时,可采用如下方式:

                    Bundle bundle = new Bundle();
                    bundle.putString("name","水怪");
                    bundle.putInt("age",20);
                    Navigation.findNavController(v).navigate(R.id.action_mainFragment2_to_secondFragment,bundle);
    

    在SecondFragment中可采用如下方式接收参数:

            Bundle bundle = getArguments();
            if(bundle != null){
                String name = bundle.getString("name");
                int age = bundle.getInt("age");
                Log.d(TAG,"name = " + name + "   age = " + age);
            }
    

    跳转到运行结果如下:

    2020-08-05 20:43:58.009 9428-9428/com.example.jetpackpro D/SecondFragment: name = 水怪   age = 20
    

    如果要使用safe args的方式传递参数,需要先引入依赖。

    • 在project的build.gradle文件中添加插件

      classpath 'androidx.navigation:navigation-safe-args-gradle-plugin:2.3.0-alpha01'
      
    • 在app的build.gradle文件中应用该插件。

      apply plugin: 'androidx.navigation.safeargs'
      

    在导航图中添加<argument>标签。如下所示:

    <fragment
            android:id="@+id/mainFragment2"
            android:name="com.example.jetpackpro.navigation.MainFragment"
            android:label="fragment_main"
            tools:layout="@layout/fragment_main" >
            <action
                android:id="@+id/action_mainFragment2_to_secondFragment"
                app:destination="@id/secondFragment"
                app:enterAnim="@anim/fragment_open_enter"
                app:exitAnim="@anim/fragment_open_exit"
                app:popEnterAnim="@anim/fragment_close_enter"
                app:popExitAnim="@anim/fragment_close_exit" />
    
            <!-- 添加参数 -->
            <argument
                android:name="name"
                app:argType="string"
                android:defaultValue='"none"'/>
            <argument
                android:name="age"
                app:argType="integer"
                android:defaultValue="0"/>
    
        </fragment>
    

    编译项目后,可以看到在generated中生成了MainFragmentArgs文件。

    image.png

    传递参数逻辑修改为:

    Bundle bundle = new MainFragmentArgs.Builder().setName("水怪").setAge(20).build().toBundle();
    Navigation.findNavController(v).navigate(R.id.action_mainFragment2_to_secondFragment,bundle);
    

    接收参数逻辑修改为:

    Bundle bundle = getArguments();
            if(bundle != null){
                String name = MainFragmentArgs.fromBundle(getArguments()).getName();
                int age = MainFragmentArgs.fromBundle(getArguments()).getAge();
                Log.d(TAG,"name = " + name + "   age = " + age);
            }
    

    运行结果为:

    2020-08-05 21:11:17.933 9775-9775/com.example.jetpackpro D/SecondFragment: name = 水怪   age = 20
    

    相关文章

      网友评论

        本文标题:JetPack学习笔记之Navigation(一)

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