How to save fragment state while navigating with navigation component

I will answer your questions one by one.

But this does not work, all the textfields reset when navigating back to A. What am I doing wrong?

From FragmentB, when users finish their work and the app call the below method to return FragmentA.

findNavController().navigate(R.id.action_from_B_to_A, dataBundle)

You expected that the app will bring users back to FragmentA, but the actual result is a new FragmentA is created and put on the top of the back stack. Now the back stack will be like this.

FragmentA (new instance)
FragmentB
FragmentA (old instance)

That why you see all textfields reset, because it is a totally new instance of FragmentA.

What is proper way of handling cases like this?

You want to start a fragment, then receive result form that fragment, it seems like startActivityForResult method of Activity.

In Android Dev Summit 2019 - Architecture Components, at 2:43, there is a question for Android developers.

Can we have something like startFragmentForResult for the Navigation Controller?

The answer is they are working on it, and this feature will be available in future.

Back to your problem, here is my solution.

Step 1: Create a class called SharedViewModel

class SharedViewModel : ViewModel() {

    // This is the data bundle from fragment B to A
    val bundleFromFragmentBToFragmentA = MutableLiveData<Bundle>()
}

Step 2: Add these lines of code to FragmentA

private lateinit var viewModel: SharedViewModel

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

    viewModel = ViewModelProviders.of(requireActivity()).get(SharedViewModel::class.java)
    viewModel.bundleFromFragmentBToFragmentA.observe(viewLifecycleOwner, Observer {
        // This will execute when fragment B set data for `bundleFromFragmentBToFragmentA`
        // TODO: Write your logic here to handle data sent from FragmentB
        val message = it.getString("ARGUMENT_MESSAGE", "")
        Toast.makeText(requireActivity(), message, Toast.LENGTH_SHORT).show()
    })
}

Step 3: Add these lines of code to FragmentB

// 1. Declare this as class's variable
private lateinit var viewModel: SharedViewModel

// 2. Use the following code when you want to return FragmentA           
// findNavController().navigate(R.id.action_from_B_to_A) // Do not use this one

// Set data for `bundleFromFragmentBToFragmentA`
val data = Bundle().apply { putString("ARGUMENT_MESSAGE", "Hello from FragmentB") }
viewModel.bundleFromFragmentBToFragmentA.value = data

// Pop itself from back stack to return FragmentA
requireActivity().onBackPressed()

If you want to keep scroll view's position after popping back, make sure you put ID to views such as NestedScrollView even if it's not needed on the code level:

android:id="@+id/some_id"

This way when the Fragment returned from the backstack, scroll positions are maintained.

Just a little thing, if your views don't have id, state will not be kept!

A view needs an ID to retain its state. This ID must be unique within the fragment and its view hierarchy. Views without an ID cannot retain their state.

Have a look at google official docs View state

In frag A, I create two global variables

private var mRootView: ViewGroup? = null
private var mIsFirstLoad = false

In onCreateView() of frag A, I write

_binding = FragmentDashBoardBinding.inflate(inflater, container, false)

    if (mRootView == null) {
        mRootView = _binding?.root
        mIsFirstLoad = true
    } else {
        mIsFirstLoad = false
    }
    return mRootView

In onViewCreated() of frag A, I check the value of "mIsFirstLoad"

if(mIsFirstLoad) {
    initAdapter()
    getMovies()
} else {
    //Continue with previously initialised variables. e.g. adapter   
}

You can use base fragment, but it's just workaround. Actually, navigation component is still buggy. Here is an issue on GitHub. Example:

class SearchFragment : BaseBottomTabFragment() {

    private var _binding: FragmentSearchBinding? = null
    private val binding get() = _binding!!

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

    override fun onViewCreated(view: View, savedInstanceState: Bundle?) {
        super.onViewCreated(view, savedInstanceState)
        binding.buttonDynamicTitleNavigate.setOnClickListener {
            navigateWithAction(
                SearchFragmentDirections.actionSearchFragmentToDynamicTitleFragment(
                    binding.editTextTitle.text.toString()
                )
            )
        }
    }

    override fun onDestroyView() {
        super.onDestroyView()
        _binding = null
    }
}

Code snipped from: This project

Check this link of Google document.

If your action is fragmentA -> fragmentB -> fragmentC. then from fragmentC back to fragmentA, you want to remove fragmentC, fragmentB and keep fragmentA's state.

So you should:

1. add an action from fragmentC to fragmentA
2. set the action that "popUpTo" be fragmentA and popUpToInclusive be true.

Update

The latest version of Navigation Component now support back stack state handling by default but you need to save your views in fragment parameters to avoid page reload. See full answer here.

You need create ViewModels scoped to a Navigation Graph.

Check this nice guide and you can keep your navigation component. Its very easy to implement and works for me!! https://medium.com/sprinthub/a-step-by-step-guide-on-how-to-use-nav-graph-scoped-viewmodels-cf82de4545ed