Fragments not visible when switch tabs using ViewPager and TabLayout

Question

I have a HostActivity that uses ViewPager and TabLayout to switch between multiple Fragments. When I switch between the tabs, the Fragments instance does get the updated data. I also see the updated data in onCreateView of the Fragment instance, but the TextView.setText does not get updated. When I check the visibility of Fragment, it always shows Invisible. How do I make the fragment visible when I switch tabs so that the view gets updated with new data? Is there something missing in the Fragment/Activity Lifecycle? I am implementing ViewPager for the first time so it will be helpful to know if I am missing something.

Fragment Class:

public class StepFragment extends Fragment { @Override
    public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) {
        if (getArguments() != null) {
            step = getArguments().getParcelable(SELECTED_STEP);
            mDescription = step.getDescription();
        }

        View view = inflater.inflate(R.layout.step_fragment, container, false);
        ButterKnife.bind(this,view);
        Log.e(TAG, "onCreateView: "+mDescription); **// THIS GETS UPDATED DATA**
        tvStepDescription.setText(mDescription);
        }
        return view;
    }
 }

Here is my Host Activity:

public class StepActivity extends AppCompatActivity {
...
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_step);
        fragmentSelectAdapter = new StepFragmentSelectAdapter(getSupportFragmentManager(),this,steps,recipe);
        mViewPager.setAdapter(fragmentSelectAdapter);
        mTabLayout.setupWithViewPager(mViewPager);
        stepFragment = (StepFragment) getSupportFragmentManager().findFragmentById(R.id.step_container);
        if(stepFragment == null) {
            stepFragment = StepFragment.newInstance(step, recipe);
            stepFragment.setArguments(bundle);
            getSupportFragmentManager().beginTransaction()
                    .add(R.id.step_container, stepFragment)
                    .commit();
        } else {
            stepFragment = StepFragment.newInstance(step, recipe);
            stepFragment.setArguments(bundle);
            getSupportFragmentManager().beginTransaction()
                    .replace(R.id.step_container, stepFragment)
                    .commit();
        }
    }
}

Here is my FragmentPagerAdapter, which seems to be getting the correct data as per the tab position in getItem method:

public class StepFragmentSelectAdapter extends FragmentPagerAdapter {
...
   @Override
    public Fragment getItem(int position) {
        **// THIS GETS UPDATED DATA**
        Log.e(TAG, "getItem: \nDecr: "+steps.get(position).getDescription()+"\nVideo: "+steps.get(position).getVideoURL()+"\nImage: "+steps.get(position).getThumbnailURL());
        return StepFragment.newInstance(steps.get(position),recipe);
    }

    @Override
    public int getCount() {
        if (steps == null){
            return 0;
        }
        return steps.size();
    }
...
}

i think this link would help https://stackoverflow.com/questions/7951730/viewpager-and-fragments-whats-the-right-way-to-store-fragments-state?rq=1 — Kopi Bryant, May 25 '18 at 18:55

score 0 · Answer 1 · answered May 25 '18 at 19:02

As far as I could understand about the problem that you are having there, I think you should implement an onResume function in your StepFragment which will get the updated data from some source and will display this in the TextView. However, I can think of a potential problem in your StepFragmentSelectAdapter. You are creating a new instance each time you are switching the tabs.

You should have the Fragment instances created before and if you are about to pass the data among fragments, you might consider having a BroadcasReceiver or listener function by implementing an interface.

So the PagerAdapter should look something like this.

public class StepFragmentSelectAdapter extends FragmentPagerAdapter {

   public ArrayList<StepFragment> stepFragments;

   public StepFragmentSelectAdapter(ArrayList<Step> steps) {
       stepFragments = new ArrayList<>(); 

       for(int i = 0; i < steps.size(); i++) {
           stepFragments.add(StepFragment.newInstance(steps.get(position),recipe));
       }
   }
...
   @Override
    public Fragment getItem(int position) {
        **// THIS GETS UPDATED DATA**
        Log.e(TAG, "getItem: \nDecr: "+steps.get(position).getDescription()+"\nVideo: "+steps.get(position).getVideoURL()+"\nImage: "+steps.get(position).getThumbnailURL());
        return stepFragments.get(position);
    }

    @Override
    public int getCount() {
        if (steps == null){
            return 0;
        }
        return steps.size();
    }
...
}

score 0 · Answer 2 · answered May 27 '18 at 17:57

Thanks for the hint. I got around this problem by replacing ActionBar with a custom ToolBar with back ImageButton and using click listener to get back to the calling activity.

backButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                getActivity().onBackPressed();
            }
        });

Fragments not visible when switch tabs using ViewPager and TabLayout

2 Answers2