Настройки вложенных настроек Android не работают должным образом

Question

Я пытаюсь реализовать экран настроек в моем приложении, который содержит 2 вложенных экрана настроек, а именно «Резервное копирование» и «О программе». Я пытался следовать инструкциям по этой ссылке: Организуйте свои настройки

Пожалуйста, смотрите мой код ниже:

activity_settings.xml

<layout
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    xmlns:app="http://schemas.android.com/apk/res-auto">

<androidx.constraintlayout.widget.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        tools:context=".ui.settings.SettingsActivity">

    <ImageButton
            android:id="@+id/back_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="?attr/selectableItemBackgroundBorderless"
            android:contentDescription="@string/ContentDescription_Icon_Back"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="parent"
            app:srcCompat="@drawable/ic_back_dark" android:layout_marginStart="16dp"
            android:layout_marginTop="16dp"/>

    <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginEnd="8dp"
            android:layout_marginStart="8dp"
            android:text="Settings"
            app:layout_constraintEnd_toEndOf="parent"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintTop_toTopOf="@+id/back_button"
            style="@style/Screen_Title_Default" android:id="@+id/textView"
            app:layout_constraintBottom_toBottomOf="@+id/back_button"/>


    <fragment
            android:id="@+id/fragment_cont"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="32dp"
            android:layout_marginStart="8dp"
            android:layout_marginEnd="8dp"
            android:name="com.th3pl4gu3.lifestyle.ui.settings.SettingsMainFragment"
            app:layout_constraintTop_toBottomOf="@+id/textView"
            app:layout_constraintStart_toStartOf="parent"
            app:layout_constraintEnd_toEndOf="parent"/>

</androidx.constraintlayout.widget.ConstraintLayout>

</layout>

SettingsActivity.kt

import androidx.appcompat.app.AppCompatActivity
import android.os.Bundle
import androidx.databinding.DataBindingUtil
import androidx.preference.Preference
import androidx.preference.PreferenceFragmentCompat
import com.th3pl4gu3.lifestyle.R
import com.th3pl4gu3.lifestyle.databinding.ActivitySettingsBinding

class SettingsActivity : AppCompatActivity(), PreferenceFragmentCompat.OnPreferenceStartFragmentCallback {

override fun onPreferenceStartFragment(caller: PreferenceFragmentCompat?, pref: Preference): Boolean {
    // Instantiate the new Fragment
    val args = pref.extras
    val fragment = supportFragmentManager.fragmentFactory.instantiate(
        classLoader,
        pref.fragment
    )
    fragment.arguments = args
    fragment.setTargetFragment(caller, 0)
    // Replace the existing Fragment with the new Fragment
    supportFragmentManager.beginTransaction()
        .replace(R.id.fragment_cont, fragment)
        .addToBackStack(null)
        .commit()
    return true
}


private lateinit var _binding: ActivitySettingsBinding

override fun onCreate(savedInstanceState: Bundle?) {
    super.onCreate(savedInstanceState)
    _binding = DataBindingUtil.setContentView(this, R.layout.activity_settings)
}

override fun onStart() {
    super.onStart()

    _binding.backButton.setOnClickListener {
        onBackPressed()
    }
}
}

preferences_settings_main.xml

<PreferenceScreen
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

<Preference
        app:key="backup_local"
        app:title="Backup"
        app:summary="Create and restore backups"
        app:fragment="com.th3pl4gu3.lifestyle.ui.settings.SettingsBackupFragment"
        android:icon="@drawable/ic_backup_dark"/>

<Preference
        app:key="about"
        app:title="About"
        app:summary="About this application"
        android:icon="@drawable/ic_info_dark"/>

</PreferenceScreen>

SettingsMainFragment.kt

import android.os.Bundle
import androidx.preference.PreferenceFragmentCompat
import com.th3pl4gu3.lifestyle.R

class SettingsMainFragment : PreferenceFragmentCompat() {
    override fun onCreatePreferences(savedInstanceState: Bundle?, rootKey: String?) {
        setPreferencesFromResource(R.xml.preferences_settings_main, rootKey)
    }
}

preferences_settings_backup.xml

<PreferenceScreen
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto">

<PreferenceCategory app:title="Backup">

    <EditTextPreference
            android:defaultValue="internal/Android"
            android:key="path"
            android:summary="The path to create local backup"
            android:title="Backup Path"/>

    <Preference
            app:title="Create Backup Locally"
            app:summary="Creates a backup locally and saves to specified path."/>

    <Preference
            app:title="Create Backup in Cloud"
            app:summary="Creates a backup and saves to Google Drive"/>

</PreferenceCategory>

<PreferenceCategory app:title="Restore">

    <Preference
            app:title="Restore Locally"
            app:summary="Restore a Backup Locally"/>

    <Preference
            app:title="Restore from Cloud"
            app:summary="Restore a Backup from Google Drive"/>

</PreferenceCategory>

Что я хотел, так это когда я нажимал «Резервное копирование» на главном экране настроек, он заменял весь фрагмент и отображал только фрагмент настроек резервного копирования. Вместо этого у меня есть такой вывод:

Он показывает фрагмент на том же экране, который я не хочу. Может кто-нибудь помочь мне, пожалуйста?