How to keep only first added Fragment in back stack (fragment overlapping)?

Question

Scenario what i'm trying to achieve:

1. Loading activity with two frame containers (for list of items and for details).
2. At the app launch time add listFragment in listFrame and some initial infoFragment in detailsFrame containers.
3. Navigating through list items without adding each detail transaction to back stack (want to keep only infoFragment in stack).
4. As soon as user hit back button (navigate back) he falls back to intial infoFragment what was added in launch time.
5. If sequential back navigation fallows then apps exit.

My code:

        protected override void OnCreate(Bundle savedInstanceState)
        {
...
            var listFrag = new ListFragment();
            var infoFrag = new InfoFragment();
            var trans = FragmentManager.BeginTransaction();
            trans.Add(Resource.Id.listFrame, listFrag);
            trans.Add(Resource.Id.detailsFrame, infoFrag);
            trans.Commit();
...
        }

        public void OnItemSelected(int id)
        {
            var detailsFrag = DetailFragment.NewInstance(id);
            var trans = FragmentManager.BeginTransaction();
            trans.Replace(Resource.Id.detailsFrame, detailsFrag);
            if (FragmentManager.BackStackEntryCount == 0)
                {
                    trans.AddToBackStack(null);
                }
            trans.Commit();
        }

My problem:

After back button has been hit, infoFrag is overlapped with previous detailFrag! Why?

Answer 1

You can do this:

if (getSupportFragmentManager().getBackStackEntryCount() > 0) {
   getSupportFragmentManager().popBackStack(getSupportFragmentManager().getBackStackEntryAt(0).getId(), getSupportFragmentManager().POP_BACK_STACK_INCLUSIVE);
} else {
   super.onBackPressed();}

In your activity, so you to keep first fragment.

You shouldn't have, in your first fragment, the addToBackStack. But, in the rest, yes.

Answer 2

Very nice explanation by Budius. I read his advice and implemented similar navigation, which I would like to share with others.

Instead of replacing fragments like this:

Transaction.remove(detail1).add(detail2)
Transaction.remove(detail2).add(detail3)
Transaction.remove(detail3).add(detail4)

I added a fragment container layout in the activity layout file. It can be either LinearLayout, RelativeLayot or FrameLayout etc.. So in the activity on create I had this:

transaction.replace(R.id.HomeInputFragment, mainHomeFragment).commit();

mainHomeFragment is the fragment I want to get back to when pressing the back button, like infoFrag. Then, before EVERY NEXT transaction I put:

fragmentManager.popBackStackImmediate();
transaction.replace(R.id.HomeInputFragment, frag2).addToBackStack(null).commit();

or

fragmentManager.popBackStackImmediate();
transaction.replace(R.id.HomeInputFragment, frag3).addToBackStack(null).commit();

That way you don't have to keep track of which fragment is currenty showing.

Answer 3

The problem is that the transaction that you're backing from have two steps:

• remove infoFrag
• add detailsFrag (that is the first1 detail container that was added)

(we know that because the documentation This is essentially the same as calling remove(Fragment) for all currently added fragments that were added with the same containerViewId and then add(int, Fragment, String) with the same arguments given here. )

So whenever the system is reverting that one transaction is reverting exactly those 2 steps, and it say nothing about the last detailFrag that was added to it, so it doesn't do anything with it.

There're two possible work arounds I can think on your case:

1. Keep a reference on your activity to the last detailsFrag used and use the BackStackChange listener to whenever the value change from 1 to 0 (you'll have to keep track of previous values) you also remove that one remaining fragment

2. on every click listener you'll have to popBackStackImmediatly() (to remove the previous transaction) and addToBackStack() on all transactions. On this workaround you can also use some setCustomAnimation magic to make sure it all looks nice on the screen (e.g. use a alpha animation from 0 to 0 duration 1 to avoid previous fragment appearing and disappearing again.

ps. I agree that the fragment manager/transaction should be a bit more clever to the way it handles back stack on .replace() actions, but that's the way it does it.

edit:

what is happening is like this (I'm adding numbers to the details to make it more clear). Remember that .replace() = .remove().add()

Transaction.remove(info).add(detail1).addToBackStack(null) // 1st time
Transaction.remove(detail1).add(detail2) // 2nd time
Transaction.remove(detail2).add(detail3) // 3rd time
Transaction.remove(detail3).add(detail4) // 4th time

so now we have detail4 on the layout:

< Press back button >
     System pops the back stack and find the following back entry to be reversed
         remove(info).add(detail1);
     so the system makes that transaction backward.
     tries to remove detail1 (is not there, so it ignores)
     re-add(info) // OVERLAP !!!

so the problem is that the system doesn't realise that there's a detail4 and that the transaction was .replace() that it was supposed to replace whatever is in there.

Answer 4

You could just override onBackPressed and commit a transaction to the initial fragment.

Answer 5

I'm guessing but:

You've added the transaction to replace infoFrag with 1st detailsFrag into the backstack.

But then you replace 1st detailsFrag with 2nd detailsFrag.

At this point when you click back, the fragment manager cannot cleanly replace 1st detailsFrag with infoFrag as 1st detailsFrag has already been removed and replaced.

Whether the overlapping behaviour is expected or not I don't know.

I would suggest debugging the Android core code to see what it is doing.

I'm not sure whether you can achieve without say overriding Activity::onBackPressed() and doing the pops yourself having added all transactions to the backstack.