View with ViewPager not vertically scrollable in ScrollView

Question

This feels like a no brainer but somehow I'm stuck. The view won't allow me to scroll it. It's as if the height of the fragment inflated in the ViewPager doesn't get calculated. Searching SO suggest I need to write my own ViewPager and override onMeasure(), but I can't believe I would have to go that far for something as simple as this.

Here is my layout, somewhat simplified for convenience. The ViewPager is populated with fragments taking up space way beyond the screen (vertically). Still, nothing on the screen is scrollable. Why is that?

<ScrollView
    android:id="@+id/scroll_view"
    xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true">

    <android.support.constraint.ConstraintLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent">

        <ImageView
            android:id="@+id/header_image_view"
            android:layout_width="0dp"
            android:layout_height="170dp"
            app:layout_constraintTop_toTopOf="parent"/>

        <TextView
            android:id="@+id/title_text_view"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            app:layout_constraintTop_toBottomOf="@id/header_image_view"/>

        <Button
            android:id="@+id/resume_training_button"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            app:layout_constraintTop_toBottomOf="@id/title_text_view"/>

        <android.support.design.widget.TabLayout
            android:id="@+id/lesson_table_layout"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:minHeight="?attr/actionBarSize"          
            app:layout_constraintTop_toBottomOf="@id/resume_training_button">
        </android.support.design.widget.TabLayout>

        <android.support.v4.view.ViewPager
            android:id="@+id/view_pager"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            app:layout_constraintTop_toBottomOf="@id/lesson_table_layout">
        </android.support.v4.view.ViewPager>
    </android.support.constraint.ConstraintLayout>
</ScrollView>

Here's an example view. The Lorem ipsum text continues for long, and I'm expecting the whole screen to be scrollable, but it isn't.

Thanks in advance!

just for clarification did you try any other layout ?? like linear or relative inside the scrolV?? — Santanu Sur, Feb 28 '18 at 20:26
@SantanuSur yes, I've tried them both. Same result. But thanks for the thought. I've also updated the question with an image to clarify my issue. — Algar, Mar 01 '18 at 08:11
but what are you doing white blank space at the top of the viewpager.. you can utilize it.. — Santanu Sur, Mar 01 '18 at 08:41
do one thing..replace the scrollView with nestedScrollView..and put a linear layout around it.. i am writing the solution.. — Santanu Sur, Mar 01 '18 at 08:48

score 2 · Answer 1 · edited Jul 19 '22 at 01:37

2

There is such problem , sometimes the ScrollView and the ViewPager switch focus.

If you have a ViewPager in a ScrollView and you want it always to stay in focus when you touch it and the ScrollView never getting a focus, setting the requestDisallowInterceptTouchEvent does that.
 mViewPager= (ViewPager) findViewById(R.id.pager);
    mViewPager.setAdapter(adapter);
    mViewPager.setOnTouchListener(new View.OnTouchListener() {

        @Override
        public boolean onTouch(View v, MotionEvent event) {
            mViewPager.getParent().requestDisallowInterceptTouchEvent(true);
            return false;
        }
    });

Look up more answers in this thread

EDIT:

Another way I see that may work is setting scrolling to your tablayout like this programmatically

tabLayout.setTabMode(TabLayout.MODE_SCROLLABLE);

edited Jul 19 '22 at 01:37

General Grievance

4,555
31
31
45

answered Feb 28 '18 at 20:44

Rainmaker

10,294
9
54
89

Thanks for your answer, but that does not help. Nothing is scrolling vertically (though the ViewPager is working horizontally). I've updated the question with an image as well to clarify the view. – Algar Mar 01 '18 at 08:10
Editted my answer, I should you try this one out. If it doesn;t work try making your textview inside the fragment (where you have text on the pic) scrollable and this will be a workaround for you – Rainmaker Mar 01 '18 at 09:53

score 2 · Accepted Answer · answered Mar 01 '18 at 14:29

I ended up rewriting it quite a bit. It didn't make sense to scroll above the TabLayout so I ended up using a CoordinatorLayout, according to

<CoordinatorLayout>        <-- width/height = match_parent
    <AppBarLayout>         <-- width = match_parent, height = wrap_content
        <ImageView/>
        <TextView/>
        <Button/>
        <TabLayout/>
    <AppBarLayout/>
    <ViewPager/>           <-- width/height = match_parent, app:layout_behavior="@string/appbar_scrolling_view_behavior"
<CoordinatorLayout/>

And each fragment inserted in the ViewPager is now wrapped in a NestedScrollView.

Thanks for the other answers. It'll probably help someone else!

Brilliant solution! BTW, to make the whole content scrollable(like a `ScrollView`), add a `CollapsingToolbarLayout` and set its `app:layout_scrollFlags="scroll"`. — Dewey Reed, Jul 26 '19 at 03:04

score 0 · Answer 3 · answered Mar 01 '18 at 08:50

Try nestedScrollView instead of scrollView.. try the following snippet..

<android.support.v4.widget.NestedScrollView xmlns:android="http://schemas.android.com/apk/res/android"
        xmlns:app="http://schemas.android.com/apk/res-auto"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        app:layout_behavior="@string/appbar_scrolling_view_behavior">
        <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
            android:id="@id/fragment_detail"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_gravity="fill_vertical"
            android:orientation="vertical">
    ...Content...
     
     <android.support.v4.view.ViewPager
        android:id="@+id/view_pager"
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:layout_constraintTop_toBottomOf="@id/lesson_table_layout">
    </android.support.v4.view.ViewPager>
   
     </LinearLayout>
</android.support.v4.widget.NestedScrollView>

Thanks, but no luck. And I've tried all variants of this before. I'm keen to think that it's the `onMeasure`'s fault, not the actual view hierarchy. — Algar, Mar 01 '18 at 08:56

View with ViewPager not vertically scrollable in ScrollView

3 Answers3