Android : ScrollView + ViewPager doesn't work properly

Question

In my android application, I want to implement PagerSlidingTab and ViewPager inside ScrollView. The layout file is shown below. I am facing a weird problem in that. It shows only tab strip on top and no content is displayed for ViewPager Fragment content on screen. I don't know what is the problem with that. If I remove ScreollView from layout then it works perfectly but I want everything inside ScrollView. Please help me to solve this issue.

Layout :

<?xml version="1.0" encoding="utf-8"?> 
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <RelativeLayout
        xmlns:app="http://schemas.android.com/apk/res-auto"
        xmlns:tools="http://schemas.android.com/tools"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <com.danzim.diamond.classes.KenBurnsView
            android:id="@+id/newsHeaderKenburn"
            android:layout_width="match_parent"
            android:layout_height="180dp"
            android:layout_alignParentTop="true"
            android:background="@color/black" />

        <com.astuetz.PagerSlidingTabStrip
            android:id="@+id/newsTabs"
            android:layout_width="match_parent"
            android:layout_height="48dp"
            android:layout_below="@+id/newsHeaderKenburn"
            android:background="@drawable/background_news_tab"
            app:pstsDividerColor="@color/transparent"
            app:pstsIndicatorColor="@android:color/white"
            app:pstsTextAllCaps="true" />

        <android.support.v4.view.ViewPager
            android:id="@+id/newsPager"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_below="@+id/newsTabs" />
    </RelativeLayout>

</ScrollView>

Answer 1

There was a minor mistake in my code. I changed the ScrollView code and its working properly.

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true">

Just need to add android:fillViewport="true" to the ScrollView element. I got the answer from this link: Is it possible to have a ViewPager inside of a ScrollView?

Answer 2

The simple solution would be to add android:fillViewport="true" to your scroll view but there is a deeper problem in using this layout to consider.

The problem you are having is that the ScrollView wraps its content and takes "ownership" of the resizing of the elements inside of it. So it resizes the Relative layout to only fit in the headers of the PagerSlidingTabStrip cause that is all the information it has when it does the layout for the screen. The contents of the ViewPager has not been added yet so it doesn't take that into consideration when resizing the relative layout.

Suggested solution is to have the scrollview inside of each of the elements that will be inside the viewPager Control. So you are going to be adding fragments to the ViewPage i assume? just make sure that the ScrollView is the topMost control in each of those layouts. It makes for less unexpected behaviour later on when you want to put for example a listview inside the ViewPager, ListViews and ScrollViews dont like each other and you can only have one or the other you cant have anything else that scrolls inside the ScrollView.

Hope this has helped you out at least. Please ping me if you need more information about this.