CODEWITHSUNDEEP
androidandroid-layoutandroid-viewpager
Sandy
Sandy

Reputation: 2692

Fill left over screen space using ViewPager

I'm trying to make a layout in which a ViewPager fills vertically the available space.

Basically what I have here are a bunch of views stacked vertically.

Checkbox
ViewPager
LinearLayout (which will contain the indicator)
Button

I want the checkbox on top, and the button on the bottom, the LinearLayout above the button, and whatever space is left over in the middle to be used by the ViewPager, however I can't seem to be able to make it work.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:background="@color/white"
    android:gravity="top|center_horizontal"
    android:padding="@dimen/activity_horizontal_margin"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <CheckBox
        android:background="@drawable/login_button"
        android:id="@+id/checkbox_friend_notify"
        android:visibility="invisible"
        android:checked="false"
        android:textColor="@color/black"
        android:text="@string/friend_notify"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <ViewPager
        android:id="@+id/pager"
        android:gravity="top"
        android:layout_below="@+id/checkbox_friend_notify"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" />

    <LinearLayout
        android:id="@+id/pager_indicator"
        android:layout_centerHorizontal="true"
        android:orientation="horizontal"
        android:layout_below="@+id/pager"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content" />

    <Button
        android:id="@+id/start_btn"
        android:visibility="invisible"
        android:text="@string/start"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:textColor="@color/white"
        android:background="@drawable/login_button"
        android:layout_below="@+id/pager_indicator"
        android:layout_alignParentBottom="true" />
</RelativeLayout>

Any pointers?

Upvotes: 0

Views: 943

Answers (1)

ekchang
ekchang

Reputation: 939

If you simply need a set of views stacked vertically, consider changing your RelativeLayout for a vertical LinearLayout. Then you can keep all your child views the same (getting rid of all the layout above/below attributes) except give the ViewPager android:layout_height="0dp" and android:layout_weight="1"

Explained: layout_weight tells LinearLayout how to distribute leftover white space, and by giving the ViewPager a weight (and not giving any of the other children any weight values) you're telling LinearLayout that ViewPager wants all of the remaining white space to itself. This only works if you don't define a height (hence why layout_height=0dp).

You can read more about it on the LinearLayout guide.

Upvotes: 3

Related Questions