Unable to initialize the button in fragment in kotlin

Question

I am doing a basic android project to implement the fragments inside a single activity using Navigation Controller and Navigation Host. Inside a fragment I have two buttons and I have already initialize those two buttons with the id's inside the onCreateView() method. But whenever I was going to run the application in avd, the application is getting crashed. Please help me to solve this issue. Down below, I am posting all the details regarding to this problem:

MainFragment.kt

class MainFragment : Fragment() {

    lateinit var view_balances_button : Button;
    lateinit var pay_someone_button : Button;
    
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)

    }

    override fun onCreateView(
        inflater: LayoutInflater, container: ViewGroup?,
        savedInstanceState: Bundle?
    ): View? {

        val view: View = inflater!!.inflate(R.layout.fragment_main, container, false)

        view_balances_button.findViewById<Button>(R.id.view_balances_button)
        pay_someone_button.findViewById<Button>(R.id.pay_someone_button)

        view_balances_button.setOnClickListener {
            findNavController().navigate(R.id.action_mainFragment_to_viewBalanceFragment2)
        }

        pay_someone_button.setOnClickListener {
            findNavController().navigate(R.id.action_mainFragment_to_viewPeopleFragment2)
        }

        // Inflate the layout for this fragment

        return view
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)



    }


}

fragment_main.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
    android:orientation="vertical"
    android:padding="@dimen/android_default_padding"
    tools:context=".MainFragment">

    <!-- TODO: Update blank fragment layout -->

    <Button
        android:id="@+id/view_balances_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:text="@string/button_view_balances" />

    <Button
        android:id="@+id/pay_someone_button"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="@dimen/android_default_padding"
        android:text="@string/button_pay_someone" />

</LinearLayout>

MainActivity.kt

package com.shankhadeep.navigationcomponentjetpack

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.navigation.findNavController
import androidx.navigation.ui.NavigationUI

class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)

        NavigationUI.setupActionBarWithNavController(this,findNavController(R.id.nav_host_fragment))
    }
}

activty_main.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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
        xmlns:app="http://schemas.android.com/apk/res-auto"
        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:navGraph="@navigation/my_navigation"/>

</FrameLayout>

Error message image

Error shown in the logcat

Answer 1

in fragment onCreateView View view assigned to view so u need to call view.findViewById(R.id.yourID)

changes

findNavController().navigate(R.id.action_mainFragment_to_viewBalanceFragment2)

to

val navController = Navigation.findNavController(requireActivity(), R.id.nav_host_fragment)

then use navigate

navController.navigate(R.id.yourNavigation)

modified code

override fun onCreateView(
                inflater: LayoutInflater, container: ViewGroup?,
                savedInstanceState: Bundle?
            ): View? {
        
                val view: View = inflater!!.inflate(R.layout.fragment_main, container, false)
        
                val navController = Navigation.findNavController(requireActivity(), R.id.nav_host_fragment)

                view_balances_button = view.findViewById(R.id.view_balances_button)
                pay_someone_button = view.findViewById(R.id.pay_someone_button)
        
                view_balances_button!!.setOnClickListener {
                    navController.navigate(R.id.action_mainFragment_to_viewBalanceFragment2)
                }
        
                pay_someone_button!!.setOnClickListener {
                    navController.navigate(R.id.action_mainFragment_to_viewPeopleFragment2)
                }
        
                // Inflate the layout for this fragment
        
                return view
            }