Simple use of navigation in jetpack

To configure

introduce Navigation（ other Kotlin You need to introduce yourself , Then there are Kotlin The presentation of ）

def nav_version = "2.3.2"
implementation "androidx.navigation:navigation-fragment-ktx:$nav_version"
implementation "androidx.navigation:navigation-ui-ktx:$nav_version"

The following is the project structure diagram , It's more clear to list , Although it is only a brief introduction to the use of . What is unfolded is where it can be used

Navigation

Next is the step-by-step operation , Direct column code will make people bigger , To be added later .

First, in the res Create files under folders


Fill in your name , choice Navigation, If you haven't created such a file , This folder will be automatically generated to store .
Next, write the generated file , I am here nav_main.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_main"
    // The initial... Defined here Fragment
    app:startDestination="@id/homeFragment">

    <fragment
        android:id="@+id/homeFragment"
        android:name="com.kxqin.myapplication.fragment.HomeFragment"
        android:label="fragment_home"
        tools:layout="@layout/fragment_home">
        // Jump is defined here , Using small arrows directly in the view will automatically generate 
        <action
            android:id="@+id/action_homeFragment_to_secondFragment"
            app:destination="@id/secondFragment"
            // You can add your own animation 
            app:enterAnim="@anim/fragment_fade_enter"
            app:exitAnim="@anim/fragment_fade_exit" />
    </fragment>

    <fragment
        android:id="@+id/secondFragment"
        android:name="com.kxqin.myapplication.fragment.SecondFragment"
        android:label="fragment_second"
        tools:layout="@layout/fragment_second" />
</navigation>

Use this button to quickly add components , Here is the visual operation platform , Well, don't feel low ah , In fact, it's very useful .

Using this arrow to pull it is a quick action Jump operation , But this action You need to define the specified operation in the subsequent code to take effect .（ This is bullshit , This article does not do this operation .）

Next is the main page code

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

    <com.google.android.material.bottomnavigation.BottomNavigationView
        android:id="@+id/navView"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        app:menu="@menu/nav_menu" />

    <!-- here name Fixed to this class ！-->
    <androidx.fragment.app.FragmentContainerView
        android:id="@+id/nav_host_fragment_container"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:name="androidx.navigation.fragment.NavHostFragment"
        app:navGraph="@navigation/nav_main"
        app:defaultNavHost="true" />

</LinearLayout>

We need to put a container FragmentContainerView To hold our Fragment,id There must be a definition of , Otherwise, an error will be reported when compiling .app:navGraph="@navigation/nav_main" It was just built Navigation The files under the .

I used BottomNavigationView, It's the bottom bar , I just put it on it .
Also generate a Menu Files of type , Here I define as nav_menu.xml.

<?xml version="1.0" encoding="utf-8"?>
<menu xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <item
        android:id="@+id/homeFragment"
        android:title=" Home page " />
    <item
        android:id="@+id/secondFragment"
        android:title=" The pie chart " />
</menu>

Be careful ！ here item Of id And just now nav_main.xml Medium Fragment Of id Agreement , Otherwise, there will be no effect when clicking later ！

Let's have a look MainActivity Code for

class MainActivity : AppCompatActivity() {
    

    private val binding: ActivityMainBinding by viewbind()

    override fun onCreate(savedInstanceState: Bundle?) {
    
        super.onCreate(savedInstanceState)
        setContentView(binding.root)
        val appBarConfig = AppBarConfiguration.Builder(R.id.homeFragment, R.id.secondFragment).build()
        // use fragment Container build navigation controller 
        val navController = (supportFragmentManager.findFragmentById(R.id.nav_host_fragment_container) as NavHostFragment).navController
        // Set the configuration for the navigation controller 
        NavigationUI.setupActionBarWithNavController(this, navController, appBarConfig)
        // relation NavigationView And navigation controller 
        NavigationUI.setupWithNavController(binding.navView, navController)
    }
}

Here we use ViewBinding, If you don't know, you can have a look Last article Oh , There is a simple introduction to use .

Click on tab You can switch Fragment La , Go and have a try ！