Second fragment in ViewPager consumes scroll events

Issue

I have a SwipeRefreshLayout that hosts ViewPager in my Activity. I am adding two fragments to the ViewPager. The first fragment has RecyclerView and the second fragment has a ScrollView.

On the first fragment, SwipeRefreshLayout was consuming scroll event. I added OnScrollListener and I am disabling refreshing if the view is not on the top.

I have same the problem with ScrollView in the second fragment, and I added ViewTreeObserver.OnScrollChangedListener() to ScrollView.

However, when I am on the first page, the scroll event passes to second page.

I tried to set android:clickable="true" on parent view of the first fragment and it didn't work.

Any recommendation would be helpful.

my_activity.xml

<include android:id="@+id/toolbar" layout="@layout/include_toolbar" />

<FrameLayout
    android:id="@id/container"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_below="@id/toolbar">

    <RelativeLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <android.support.design.widget.TabLayout
            android:id="@+id/tab_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:background="?attr/colorPrimary"
            android:minHeight="?attr/actionBarSize"
            android:theme="@style/ThemeOverlay.AppCompat.Dark.ActionBar"/>

        <android.support.v4.widget.SwipeRefreshLayout
            android:id="@+id/swipe_container"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/login_background"
            android:fillViewport="true"
            android:fitsSystemWindows="true"
            android:layout_below="@id/tab_layout">

            <RelativeLayout
                android:layout_width="match_parent"
                android:layout_height="wrap_content">

                <TextView
                    android:id="@+id/last_update"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:paddingLeft="@dimen/normal_padding"
                    android:paddingTop="@dimen/small_padding"
                    android:textColor="@color/gray"
                    android:paddingBottom="@dimen/small_padding"
                    android:textSize="@dimen/caption"
                    android:textStyle="bold" />

                <android.support.v4.view.ViewPager
                    android:id="@+id/pager"
                    android:layout_below="@id/last_update"
                    android:layout_width="match_parent"
                    android:layout_height="fill_parent"/>

            </RelativeLayout>

        </android.support.v4.widget.SwipeRefreshLayout>
    </RelativeLayout>
</FrameLayout>

first_fragment.xml

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:elevation="16dp"
android:background="@android:color/transparent"
android:clickable="true">

<android.support.v7.widget.RecyclerView
    android:id="@+id/recycler_view"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:scrollbars="vertical" />
</LinearLayout>

second_fragment.xml

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/container"
android:background="@android:color/transparent"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:clickable="true">

There are some child views here. 

</ScrollView

SecondFragment

    onScrollChangedListener = new ViewTreeObserver.OnScrollChangedListener() {
        @Override
        public void onScrollChanged() {
            SwipeRefreshLayout swipeRefreshLayout = (SwipeRefreshLayout) getActivity().findViewById(R.id.swipe_container);

            int scrollY = scrollView.getScrollY();
            if (scrollY == 0) swipeRefreshLayout.setEnabled(true);
            else swipeRefreshLayout.setEnabled(false);

        }
    };

    scrollView.getViewTreeObserver().addOnScrollChangedListener(onScrollChangedListener);

Solution

This is because the second Fragment is created along with the first Fragment and it gains focus. I had this issue when I had used a Depth Page Transformer. The second Fragment was rendered under the first Fragment and was thus consuming touches.

Try using the following Page Transformer:

viewPager.setPageTransformer(false, new CustomViewPager.PageTransformer() {

    @Override
    public void transformPage(View view, float position) {
        // TODO Auto-generated method stub

        int pageWidth = view.getWidth();
        int pageHeight=view.getHeight();
        if (position < -1) { // [-Infinity,-1)
            // This page is way off-screen to the left.
            view.setAlpha(0);
        } 
        else if (position <= 1) { // [-1,1]

         float scaleFactor = Math.max(min_scale, 1 -Math.abs(position));
            float vertMargin = pageHeight * (1 - scaleFactor) / 2;
            float horzMargin = pageWidth * (1 - scaleFactor) / 2;
            if (position < 0) {
                view.setTranslationX(horzMargin - vertMargin / 2);
            } else {
                view.setTranslationX(-horzMargin + vertMargin / 2);
            }

            // Scale the page down (between MIN_SCALE and 1)
            view.setScaleX(scaleFactor);
            view.setScaleY(scaleFactor);

            // Fade the page relative to its size.
            view.setAlpha((float) (0.2 +
                    (scaleFactor - min_scale) /
                    (1 - min_scale) * (1 - 0.2)));

        }
        else { 
            // This page is way off-screen to the right.
            view.setAlpha(0);
        }
    }       
});

The second Fragment is now rendered way off to the right and thus the touch events are passed to the first Fragment.

Answered By - user3316561