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?

Foxtrot

Answer 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>

Henderson

Yes, this works. I was applying this attribute to the relative layout, and it was not working. I think I understand what's happening now! – Foxtrot

Answer 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>

Henig

If the virtual keyboard comes up on EditView focus, this layout in the bottom will also go up since you instructed it to align in bottom. So just put an EditView in your layout and test on a device that is of a small resolution. onConfigChange that re-sizes your screen for keyboard, will also not work. You can add spacer view below the second last item relative to this view. – Dessertspoon

Answer 3

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

android:layout_alignParentBottom="true"

Object

Answer 4

If you're using LinearLayout (which is more performant than RelativeLayout), you should set android:gravity="bottom" & android:layout_height="match_parent" like this:

<LinearLayout
    android:id="@+id/ButtonLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical"
    android:gravity="bottom" >

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

Reference: https://demonuts.com/android-fillviewport/

Charil