Android ScrollView fillViewport not working

Question

I have a simple layout with a name on the top, and a button which I want to be at the bottom of the screen, or beyond that in case I add more items.

So I am using a ScrollView with a LinearLayout as follows:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/white"
android:fillViewport="true"
android:focusableInTouchMode="true"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
tools:context=".ItemDetailActivity" >

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <!-- Name -->

    <RelativeLayout
        android:id="@+id/top_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top" >

        <TextView
            android:id="@+id/name_label"
            style="@style/Header_Label_TextView"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="@string/name" />

        <TextView
            android:id="@+id/name_value"
            style="@style/Value_Label_TextView"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/name_label" />
    </RelativeLayout>

    <!-- button -->

    <RelativeLayout
        android:id="@+id/ButtonLayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="bottom" >

        <Button
            android:id="@+id/add_button"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10sp"
            android:onClick="editItem"
            android:text="@string/button_edit" />
    </RelativeLayout>

    <requestFocus />
</LinearLayout>

This is what I get:

How do I make it so that the button appears at the bottom of the screen or beyond. Upon searching online, most answers were to set the `android:fillViewport="true", but that is not helping. What am I doing wrong?

Solution 1

Change your Button layout like this:

 <RelativeLayout
    android:id="@+id/ButtonLayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="bottom" >

    <Button
        android:id="@+id/add_button"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginTop="10sp"
        android:onClick="editItem"
        android:layout_alignParentBottom="true"
        android:text="@string/button_edit" />
</RelativeLayout>

Solution 2

This should work -

1. Use Relative layout as a child for the scroll view .
2. Set layout_alignParentBottom = true for the Button.

Sample XML

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@android:color/white"
android:fillViewport="true"
android:focusableInTouchMode="true"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
tools:context=".ItemDetailActivity" >

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <!-- Name -->

    <RelativeLayout
        android:id="@+id/top_content"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_gravity="top" >

        <TextView
            android:id="@+id/name_label"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="Name" />

        <TextView
            android:id="@+id/name_value"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/name_label" />
    </RelativeLayout>

    <!-- button -->

    <RelativeLayout
        android:id="@+id/ButtonLayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true" >

        <Button
            android:id="@+id/add_button"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_marginTop="10sp"
            android:onClick="editItem"
            android:text="Edit" />
    </RelativeLayout>
</RelativeLayout>

</ScrollView>

Solution 3

In scroll view, use RelativeLayout instead of LinearLayout and set your bottom view property

android:layout_alignParentBottom="true"