Error inflating class layout with fragments using navigation

Question

I am getting this error when trying to run this app. I have followed numerous guides to no avail. I am just trying to do the simplist exercise with navigation.

My app is supposed to have one activity (mainactivity) and two sub-fragments. The first one (TitleFragment) is the home fragment - and it has a button that calls findNavController().navigate to navigate to the second fragment (which is just a blank default fragment).

However the app will not run - getting the error below:

java.lang.RuntimeException: Unable to start activity ComponentInfo{com.lbaron.test1/com.lbaron.test1.MainActivity}: android.view.InflateException: Binary XML file line #2 in com.lbaron.test1:layout/activity_main: Binary XML file line #2 in com.lbaron.test1:layout/activity_main: Error inflating class layout

MainActivity.kt

package com.lbaron.test1

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle

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

activity_main.xml

<?xml version="1.0" encoding="utf-8"?>
<layout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">
    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="vertical">

        <androidx.fragment.app.FragmentContainerView
            android:id="@+id/myNavHostFragment"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:navGraph="@navigation/navigation"
            app:defaultNavHost="true"/>
    </LinearLayout>
</layout>

TitleFragment.kt

package com.lbaron.test1

import android.os.Bundle
import androidx.fragment.app.Fragment
import android.view.LayoutInflater
import android.view.View
import android.view.ViewGroup
import android.widget.Button
import androidx.navigation.fragment.findNavController

class TitleFragment : Fragment() {

    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
    }

    override fun onCreateView(inflater: LayoutInflater, container: ViewGroup?,
                              savedInstanceState: Bundle?): View? {
        // Inflate the layout for this fragment
        return inflater.inflate(R.layout.fragment_title, container, false)
    }

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        val btn: Button = view.findViewById(R.id.btn)
        btn.setOnClickListener(View.OnClickListener { view -> findNavController().navigate(R.id.action_titleFragment_to_mainContent) })
    }
}

fragment_title.xml

<?xml version="1.0" encoding="utf-8"?>
<FrameLayout 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"
    tools:context=".TitleFragment">
    <TextView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:text="title fragment" />
    <Button
        android:id="@+id/btn"
        android:layout_width="200dp"
        android:layout_gravity="center"
        android:layout_height="wrap_content"
        android:text="click"/>
</FrameLayout>

navigation.xml

<?xml version="1.0" encoding="utf-8"?>
<navigation xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    app:startDestination="@id/titleFragment">

    <fragment
        android:id="@+id/titleFragment"
        android:name="com.lbaron.test1.TitleFragment"
        android:label="TitleFragment" >
        <action
            android:id="@+id/action_titleFragment_to_mainContent"
            app:destination="@id/mainContent" />
    </fragment>
    <fragment
        android:id="@+id/mainContent"
        android:name="com.lbaron.test1.MainContent"
        android:label="fragment_main_content"
        tools:layout="@layout/fragment_main_content" />
</navigation>

My question is: why can I not inflate my class layout?

Thanks very much - all help appreciated.

Answer 1

As the compiler says, it can't inflate the <layout> parent view used in your activity_main.xml file, that's probably because it is not defined.

Try to edit your XML like this:

<?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"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical">
    
    <androidx.fragment.app.FragmentContainerView
            android:id="@+id/myNavHostFragment"
            android:name="androidx.navigation.fragment.NavHostFragment"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            app:navGraph="@navigation/navigation"
            app:defaultNavHost="true"/>

</LinearLayout>

Answer 2

Try to edit your XML like this: I worked this way too.

<fragment
        android:id="@+id/myNavHostFragment"
        android:name="androidx.navigation.fragment.NavHostFragment"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:navGraph="@navigation/navigation"
        app:defaultNavHost="true"/>