Android edittext auto grow with text and pushing things down

Question

Yes, this is yet another edittext grow question on SO. And yes I've already gone through all those edittext grow questions. But this ones a bit specific.

UI:

A simple android layout with edittext and button below it. When text is less, the edittext view is still covering whole screen leaving space for button below.

Once user starts entering text, edittext grows vertically to accommodate text. At the same time, the button should also kept pushing downwards to let edittext grow.

User can vertically scroll through screen to view full text.

UI after entering significant text:

Here's the layout with edittext and button below:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:background="@color/background"
    android:clipToPadding="false"
    android:fadingEdge="none"
    android:fillViewport="true"
    android:padding="13dp"
    android:scrollbarStyle="outsideOverlay" >

    <RelativeLayout
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_weight="1">

        <!-- some fixed width image  -->
        <ImageView
            android:id="@+id/someimage"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="4dp"
            android:src="@drawable/page_white_text" />

        <EditText
            android:id="@+id/some"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:layout_below="@id/someimage"
            android:background="@null"
            android:gravity="top"
            android:minLines="10"
            android:minHeight="50dp"
            android:textColor="#222222"
            android:textSize="15dp"
            android:typeface="serif" >
            <requestFocus />
        </EditText>

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_alignParentBottom="true"
            android:baselineAligned="true"
            android:layout_marginTop="5dp"
            android:padding="10dp"
            android:orientation="vertical" >

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

        </LinearLayout>
    </RelativeLayout>

</ScrollView>

This works more or less. But when I enter to much text, instead of pushing button downwards. It goes behind it like:

Any help here is much appreciated. Thanks :)

Answer 1

Here's my recommendation: inside the ScrollView, put a RelativeLayout in which you can place every element in a certain order using android:layout_below. For the auto-growing of your EditText, use this solution.

Let's see an example:

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android" 
android:layout_width="fill_parent" 
android:layout_height="fill_parent"
android:layout_gravity="center">
<RelativeLayout
    android:id="@+id/general2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical"
    android:layout_margin="20sp" >

    <TextView
        android:id="@+id/textFirstOpinion"
        android:layout_height="wrap_content"  
        android:layout_width="wrap_content"
        android:text="@string/titleFirstOpinion"
        android:textStyle="bold"
        android:textSize="23sp"
        android:textColor="#FFFFFF"
        android:layout_marginTop="10dp" />

    <EditText
        android:id="@+id/fieldFirstOpinion"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/textFirstOpinion" 
        android:minHeight="80sp"
        android:isScrollContainer="true"
        android:inputType="textMultiLine"
        android:textSize="20sp"
        android:gravity="top|left" />

    <Button
        android:id="@+id/button"
        android:layout_width="110dp"
        android:layout_height="wrap_content"
        android:layout_below="@id/fieldFirstOpinion"
        android:layout_centerHorizontal="true"
        android:layout_marginTop="37sp"
        android:textSize="23sp"
        android:text="@string/textSendButton"
        android:gravity="center_horizontal"
        android:padding="10dp" />

</RelativeLayout>
</ScrollView>