Add vertical scrolling to a section of android viewPager

Question

I have a viewPager that I populate using a FragmentStatePagerAdapter. It works fine, can go through populated pages horizontally.

However the middle section of each page on the viewPager is made up of a listView. This listview will sometimes not fit into the designated area, I need to be able to scoll vertically. But I cannot scroll vertically on this section of the viewPager at the moment.

It looks like the viewPager is consuming all the scroll events (both horizontal and vertical).

I do not want a vertical viewPager; I have seen a few answers to that on StackOverflow.

I want only the section in the middle of the viewPager to scroll vertical, and this section is a listView

This is the mainlayout for the tab with a viewPager:

           <LinearLayout 
            android:id="@+id/history"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:orientation="vertical"
            android:background="@color/fdi_gray">
            <android.support.v4.view.ViewPager
                 android:id="@+id/historyFragment_container"
                 android:layout_weight="0.85"
                 android:layout_width="fill_parent"
                 android:layout_height="0dip"/> 
             <include layout="@layout/page_indicator_history"
                android:layout_height="0dip"
                android:layout_width="fill_parent"
                android:layout_weight="0.05"
                android:background="@color/darker_gray"                 
                android:layout_marginTop="2dp"/>
       </LinearLayout>

And the layout out that is used by the ViewPager adapter to populate above viewPager is this:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools" 
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="@+id/spaceHolderLocations"> 
<TextView
    android:id="@+id/locationName"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:layout_marginTop="10dp"
    android:layout_centerHorizontal="true"
    android:textStyle="bold"
    android:textSize="17sp"/>
 <TextView
    android:id="@+id/latlon"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:layout_below="@+id/locationName"
    android:layout_marginTop="2dp"
    android:layout_marginBottom="3dp"
    android:layout_centerHorizontal="true"/>

 <View
     android:id="@+id/listViewStart"
     android:layout_width="match_parent"
     android:layout_height="0.5dip"
     android:layout_marginLeft="3dp"
     android:layout_marginRight="3dp"
     android:layout_below="@+id/latlon"          
     android:background="@color/white" />

<ListView
    android:id="@android:id/list"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:background="@color/fdi_gray"
    android:layout_below="@+id/listViewStart"
    android:layout_marginLeft="3dp"
    android:layout_marginRight="3dp"
    android:divider="@color/white"
    android:dividerHeight="0.5dip"
    android:padding="1dp">       
</ListView>  
<View
     android:id="@+id/listViewEnd"
     android:layout_width="match_parent"
     android:layout_height="0.5dip"
     android:layout_marginLeft="3dp"
     android:layout_marginRight="3dp"
     android:layout_below="@android:id/list"         
     android:background="@color/white" /> 
<TextView
    android:id="@+id/curingLabel"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/listViewEnd"
    android:gravity="center"
    android:text="@string/curingLabel"
    android:layout_marginTop="10dp"
    android:layout_marginLeft="30dp"        
    android:textSize="17sp"/>
 <TextView
    android:id="@+id/curingValue"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toRightOf="@+id/curingLabel"
    android:layout_marginLeft="30dp"
    android:layout_alignBottom="@+id/curingLabel"
    android:textStyle="bold"        
    android:textSize="17sp"/>

Please note the listview in the above layout.

That's the section of the ViewPager that I want to be able to scroll on; but cannot, I can only scroll horizontally through the pages not vertically through the listView content if it doesn’t fit the page.

This question came close but it's not what I'm looking for: link

Thanks.

It's should work out of the box, please put some code here... — shem, Sep 11 '13 at 16:25
Try to remove all text view from the single page view and leave only the list view with `android:layout_height="match_parent"` and see if this works — shem, Sep 12 '13 at 08:02
I have removed all the textViews in the xml file that contains the listView, but the vertical scrolling on the listView items still does not work. Do you think the include layout which is inside the ViewPager is contributing to my problems...but I need it there it contains a page number Indicator shape. Only the 0.85 section of the linear layout should scroll vertically. — ngwane, Sep 12 '13 at 08:20

score 3 · Answer 1 · answered Oct 19 '13 at 05:29

Implement the following functionality. I hope it helps you.

    mList = (ListView) findViewById(R.id.list);
    mList.setOnTouchListener(new View.OnTouchListener () {

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

When a touch event occurs, parent always get to intercept the event. Here the parent is View Pager. What you are trying to do here is, when a touch on list view appears, request the parent not to intercept the touch event. This way, the touch event will be received by the Child, which here is ListView, and thus scrolls accordingly.

I have image view and I needed the same way in landscape mode. I just want to scroll the child(imageview) to view the content but in landscape mode it actually scrolls the whole page, any idea ? — Ravi Yadav, Jun 05 '19 at 13:11

score 0 · Answer 2 · answered Oct 19 '13 at 06:03

Basically you cannot set the height of your list view to be "wrap content". give a fixed height, or choose a different layout like linearlayout and set its weight to 1 will be another solution. if you set it to wrap content, it will just take all the space and go beyond the screen.

Add vertical scrolling to a section of android viewPager

2 Answers2