ViewPager in android is taking full screen?

Question

In my xml file I have a Linear layout that has a ViewPager for showing images and another Linear layout that contains previous and Next buttons for selecting images.My xml looks like this:

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

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

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:orientation="horizontal" >

            <Button
                android:id="@+id/goto_first"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="first" >
            </Button>

            <Button
                android:id="@+id/goto_last"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:text="last" >
            </Button>
        </LinearLayout>

    </LinearLayout>

My problem is that the ViewPager is taking full screen and the Linearlayout with previous next buttons is not showing up because there is no space left to draw this LinearLayout.

I am using Fragments to populate ViewPager with views.The xml file for the fragment view that goes into ViewPager is:

<ImageView
    android:id="@+id/ItemImage"
    android:layout_width="320dp"
    android:layout_height="180dp" />

<TextView
    android:id="@+id/ItemText"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_gravity="left|bottom"
    android:layout_marginBottom="5dp"
    android:textColor="#ffffffff"
    android:textStyle="bold" />
</FrameLayout>

The output i am getting after rendering is in this manner:
1.image ( covering 45% screen height)
2.blank space (covering 45% screen height)
3.Textview (covering rest of the 10% screen height)

The output i want is :
1.image ( covering 45% screen height)
2.Textview (covering 10% screen height)
3.LinearLayout for Buttons (covering rest of the 45% screen height)

I got my answer [link]http://stackoverflow.com/questions/8532307/android-viewpager-dimension?rq=1 — Ansh, Dec 20 '12 at 07:08
So what you have learned today ? Do some googling and search on this site before asking Question :) — Miral Dhokiya, Dec 20 '12 at 07:16
@Miral I did that but somehow it didn't appear in search results and suddenly after posting this question I found the link to the question.Anyways from next time I will spend more time on searching — Ansh, Dec 20 '12 at 07:21
I think you are having problem due to android:layout_gravity="left|bottom" — MysticMagicϡ, Dec 20 '12 at 07:21
@Sherya No that was not the problem becoz I removed it and still got the same result.I am gonna add answer to my question.Just wait for few seconds — Ansh, Dec 20 '12 at 07:24
@user818455 can you please add the solution?? I'm also facing the same problem, but not sure how to fix it? — Naveen, Mar 29 '13 at 16:01

score 11 · Answer 1 · edited Sep 18 '17 at 09:55

11

Use RelativeLayout. Add your buttons to the bottom with alignParentBottom="true". Then add the ViewPager with layout_above="@id/buttons"

edited Sep 18 '17 at 09:55

yanchenko

56,576
33
147
165

answered Jul 21 '15 at 19:16

Shawn Lauzon

6,234
4
35
46

score 9 · Answer 2 · answered Oct 02 '13 at 20:52

9

Just give those to viewpager:

 android:layout_height="0dp"
 android:layout_weight="1"

answered Oct 02 '13 at 20:52

zhumingvictor

109
2
6

6

`android:layout_weight="1"` doesn't work for `ViewPager` – Faizan Mubasher Apr 15 '15 at 11:18
@FaizanMubasher Although it is an old answer, I want to note that it has worked for me, with "androidx.viewpager.widget.ViewPager" and the other elements within a "LinearLayout" – cesargastonec Mar 29 '21 at 22:34

score 5 · Answer 3 · answered May 02 '13 at 19:50

5

The problem with viewpagers are they don't know the size since each fragment could possibly be a different size. You have to manually set the viewpager's, not wrap_content. I recommend setting a weight to all the items in the outer linear layout.

answered May 02 '13 at 19:50

jbenowitz

1,795
6
26
39

An example of this solution is @zhumingvictor answer. It works to me – cesargastonec Mar 29 '21 at 22:54

score 4 · Answer 4 · answered Jul 16 '14 at 08:26

4

Just use a RelativeLayout and use the attributes like `

android:layout_below

until you achieve the position you desire. Relative Layout is your friend in these cases.

answered Jul 16 '14 at 08:26

Otieno Rowland

2,182
1
26
34

score 0 · Answer 5 · edited May 16 '18 at 04:08

0

Just Do The Following to make room for other views, below or above:

< android.support.v4.view.ViewPager **android:layout_width**="match_parent" **android:layout_height**="match_parent" **android:layout_weight**="1"/>

This answer was taken from a comment made by Jave from the answers given on the below link.

Link: "Android ViewPager dimension"

edited May 16 '18 at 04:08

sampathsris

21,564
12
71
98

answered May 15 '18 at 12:27

Ofentse

1
1

score 0 · Answer 6 · edited Sep 25 '19 at 12:48

public class WrapViewPager extends ViewPager {

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

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

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

        int height = 0;
        for (int i = 0; i < getChildCount(); i++) {
            View child = getChildAt(i);
            child.measure(widthMeasureSpec, View.MeasureSpec.makeMeasureSpec(0, View.MeasureSpec.UNSPECIFIED));
            int h = child.getMeasuredHeight();
            if (h > height) height = h;
        }

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

        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
    }

}

score 0 · Answer 7 · answered Oct 04 '19 at 21:52

0

In my case, this code works:

<androidx.viewpager.widget.ViewPager
    android:id="@+id/myviewpager"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_weight="1" />

answered Oct 04 '19 at 21:52

Hector Hugo Alonzo

1
2

score 0 · Answer 8 · answered Mar 12 '20 at 16:05

I have this issue while implementing an ap. For Populating Images into ViewPager use RelativeLayout instead of FrameLayout.

In my case FrameLayout Occupied more than 30% of empty space.When I used RelativeLayout the space has disappeared.

Like this

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout 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”>
<ImageView
        android:id="@+id/itemImagePager"
        android:layout_width="match_parent"
        android:layout_height=“match_parent"
        android:scaleType="fitCenter" />
<ProgressBar
        android:id="@+id/loading"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerInParent="true”/>
</RelativeLayout>

Hope it works for you.

ViewPager in android is taking full screen?

8 Answers8

Linked