Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Is it possible to have a ViewPager inside of a ScrollView?

People also ask

Can we use scroll view inside scroll view?

In order to place multiple views in the scroll view, one needs to make a view group(like LinearLayout) as a direct child and then we can define many views inside it. A ScrollView supports Vertical scrolling only, so in order to create a horizontally scrollable view, HorizontalScrollView is used.

How many views can you use within a ScrollView?

Only one view can be included in a ScrollView .

How many children can a ScrollView have?

Scroll view may have only one direct child placed within it.


I've figured it out;

I needed to add android:fillViewport="true" to the ScrollView element.


Yes it is possible to have viewpager inside scrollview.

Use below code and you will achieve your goal, i have done the same in my code as well.

 public class WrapContentHeightViewPager extends ViewPager {

    public WrapContentHeightViewPager(Context context) {
        super(context);
    }

    public WrapContentHeightViewPager(Context context, AttributeSet attrs) {
        super(context, attrs);
    }

    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);

        int height = 0;

        for (int i = 0; i < getChildCount(); i++) {
            View child = getChildAt(i);

            child.measure(widthMeasureSpec, View.MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED));

            int h = child.getMeasuredHeight();

            if (h > height) height = h;
        }

        heightMeasureSpec = MeasureSpec.makeMeasureSpec(height, MeasureSpec.EXACTLY);

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }
 }

 @Override
 public boolean onTouch(View v, MotionEvent event) {
    int dragthreshold = 30;

    int downX = 0;

    int downY = 0;

    switch (event.getAction()) {
        case MotionEvent.ACTION_DOWN:
            downX = (int) event.getRawX();

            downY = (int) event.getRawY();

            break;

        case MotionEvent.ACTION_MOVE:
            int distanceX = Math.abs((int) event.getRawX() - downX);

            int distanceY = Math.abs((int) event.getRawY() - downY);

            if (distanceY > distanceX && distanceY > dragthreshold) {
                mViewPager.getParent().requestDisallowInterceptTouchEvent(false);

                mScrollView.getParent().requestDisallowInterceptTouchEvent(true);
            } else if (distanceX > distanceY && distanceX > dragthreshold) {
                mViewPager.getParent().requestDisallowInterceptTouchEvent(true);

                mScrollView.getParent().requestDisallowInterceptTouchEvent(false);
            }

            break;
        case MotionEvent.ACTION_UP:
            mScrollView.getParent().requestDisallowInterceptTouchEvent(false);

            mViewPager.getParent().requestDisallowInterceptTouchEvent(false);

            break;
    }

    return false;
 }

Hope this aids someone in resolving scroll issues with nested ViewPager within a ScrollView.


This solution worked for me, with dynamic content.

http://www.henning.ms/2013/09/09/viewpager-that-simply-dont-measure-up/

In the xml ScrollView put android:fillViewport=true and android:layout_height=wrap_content

And in custom ViewPager too put android:layout_height=wrap_content


In case someone is having the same problem, when I use the class below it works fine.

class CustomWrapContentViewPager(cont: Context, attr: AttributeSet?) : ViewPager(cont,attr) {

override fun onMeasure(widthMeasureSpec: Int, heightMeasureSpec: Int) {
    super.onMeasure(widthMeasureSpec, heightMeasureSpec)
    var height = 0
    for (i in 0 until childCount) {
        val child: View = getChildAt(i)
        child.measure(
            widthMeasureSpec,
            MeasureSpec.makeMeasureSpec(0, MeasureSpec.UNSPECIFIED)
        )
        val h: Int = child.measuredHeight
        if (h > height) height = h
    }
    val heightMeasure = MeasureSpec.makeMeasureSpec(
        height,
        MeasureSpec.EXACTLY
    )
    super.onMeasure(widthMeasureSpec, heightMeasure)
    }
}