View Pager Issue in Android

Question

I m using a viewpager which is rendering fragments one after the other. The problem which I m facing is that once I touch the current fragment visible,it takes the touch event of the next fragment which is yet to be loaded. How should I make sure the current/visible fragment is touched & the touch event is handled accordingly.

This is my adapter which renders the fragments.

private class ScreenSlidePagerAdapter extends FragmentStatePagerAdapter {
    public ScreenSlidePagerAdapter(FragmentManager fm) {
        super(fm);
    }

    @Override
    public Fragment getItem(int position) {

        Log.d("zambob",position+":"+slideShowItems.get(position).name);
        Fragment fragment = new ScreenSlidePageFragment();
        Bundle bundle = new Bundle();
        bundle.putString("IMAGE_URL",slideShowItems.get(position).image);
        bundle.putString("CAPTION", slideShowItems.get(position).name);
        fragment.setArguments(bundle);
        return fragment;
    }

    @Override
    public int getCount() {
        return slideShowItems.size();
    }
}

This is the Fragment Class which handles the touch event as well.

public class ScreenSlidePageFragment extends Fragment {

String imageUrl,text;
UWSharedPreference preference;
@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container,
                         Bundle savedInstanceState) {
    ViewGroup rootView = (ViewGroup) inflater.inflate(
            R.layout.fragment_slide_show, container, false);

    rootView.getBackground().setAlpha(200);

    preference = new UWSharedPreference(getActivity());

    imageUrl = getArguments().getString("IMAGE_URL");
    text = getArguments().getString("CAPTION");

    TouchImageView iv_image = (TouchImageView) rootView.findViewById(R.id.jj_image);
    TextView tv_caption = (TextView) rootView.findViewById(R.id.caption_text);

    iv_image.setImageUrl(imageUrl, AppController.getInstance().getImageLoader());
    if (text != null && text.equals("custom")){
        tv_caption.setText("");
    }
    else {
        tv_caption.setText(text);
    }

    iv_image.setOnTouchListener(new OnTouchListener());

    return rootView;
}

class OnTouchListener implements View.OnTouchListener {
    public boolean onTouch(View v, MotionEvent event) {
        Log.d("zambob","On Touch Called for text" + text +" diner txn id" + preference.getDinerTxnID());

        if (text.equals("custom") && preference.getDinerTxnID()!=0 ){
            startActivity(new Intent(getActivity(), FBCheckInActivity.class));
            getActivity().finish();
        }
        else {
            getActivity().onBackPressed();
        }

        return true;
    }
}

}

Now the problem is that in view pager, 3 fragments are loaded initially. The one visible, one behind it & the one which will come next. When i touch the fragment which is required to start the intent process doesn't work. But when i touch the fragment before the above one, then the required process is going on .

How should i make sure that when i touch the visible fragment, then the required process starts?

Your question is difficult to understand. Perhaps a little more description or some code would help. — happydude

Jatin Jha Jatin Jha · Accepted Answer · 2016-09-06T04:24:48

Finally I found the solution myself & a little help from Google as well :P.

Actually i was using Depth Page Transformer to show the swipe movements between the fragments. So i just tweaked the page transformer by using this-:

mPager.setPageTransformer(true, new ViewPager.PageTransformer() {
        @Override
        public void transformPage(View page, float position) {
            float translationX;
            float scale;
            float alpha;

            if (position >= 1 || position <= -1) {
                // Fix for https://code.google.com/p/android/issues/detail?id=58918
                translationX = 0;
                scale = 1;
                alpha = 1;
            } else if (position >= 0) {
                translationX = -page.getWidth() * position;
                scale = -0.2f * position + 1;
                alpha = Math.max(1 - position, 0);
            } else {
                translationX = 0.5f * page.getWidth() * position;
                scale = 1.0f;
                alpha = Math.max(0.1f * position + 1, 0);
            }

            mPager.setTranslationX(translationX);
            mPager.setScaleX(scale);
            mPager.setScaleY(scale);
            mPager.setAlpha(alpha);
        }
    });

This simply makes sure the visible fragment is getting touched and not the one behind the visible fragment by setting the scale, alpha & translation of the View Pager. Also make the root layout of View Pager as clickable.

XML for the activity rendering the View Pager.

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:urbanwand="http://schemas.android.com/apk/res-auto" xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:clickable="true"
    tools:context="com.urbanwand.diner.SlideShowActivity">

    <com.urbanwand.MyViewPager
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:id="@+id/pager"
        urbanwand:scrollduration="500"
        android:layout_width="match_parent"
        android:layout_height="match_parent" />

</RelativeLayout>

Hope this answer helps !

View Pager Issue in Android

1 Answers