Question

I’m getting a little frustrated with the Layout support in ADT and Eclipse. It’s Swing all over again. Basically I’m trying to implement a simple layout like so:
RelativeLayout

+----------------+
|                |
| FrameLayout    |
|    ImageView   |
|                |
|                |
|                |
+----------------+
| LinearLayout   |
|    TextView    |
|    Buttons     |
+----------------+

The RelativeLayout and FrameLayout are used with the ImageView for some pan/zoom listener support I wrote.

The problem I’m having is the LinearLayout (bottom controls) won’t say at the bottom of the window no matter what I try. I’ll simply paste what I’ve got below. Note that the FieldView is an extension of an ImageView. The image displays fine, its the LinearLayout that wants to be displayed on top of the FrameLayout that’s in the way.

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/fieldcontainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:baselineAligned="false"
    android:orientation="vertical" >

    <FrameLayout
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <com.test.FieldView
            android:id="@+id/field"
            android:layout_width="match_parent"
            android:layout_height="match_parent" />

    </FrameLayout>

    <LinearLayout
        android:id="@+id/controls"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:orientation="horizontal" >

        <Button
            android:id="@+id/buttonAddNode"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="Add node" />

        <TextView
            android:id="@+id/textViewNodeInfo"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:text="TextView" />
    </LinearLayout>

</RelativeLayout>

Thanks in advance for any advice. Maybe I misused a RelativeLayout parameter in my previous tries.

UPDATE
Thanks for the fast response! I couldn’t comment with code below, so here’s an update I’ve tried:

<FrameLayout
    ...
    android:layout_above="@+id/controls">

;previously and I get the following exception at runtime:

Unable to start activity ComponentInfo{com.test.MainActivity}:
    java.lang.ClassCastException: android.widget.LinearLayout

The line throwing the exception is in my MainActivity.OnCreate():

view = (FieldView) findViewById(R.id.field);

It looks like adding layout_below caused an ID mismatch? Finding R.id.field is returning the ID for the wrong LinearLayout, which I naturally can’t cast.

Note that without the layout_above, this works without any problem, just a broken layout. Again, FieldView is just an extension of an ImageView. I store my touch listeners and some other stuff in there.

Answer 1

You simply wrap it all in a relative layout and anchor the linear layout to the bottom using. android:layout_alignParentBottom="true"

To keep the controls from being over-run by the stuff above it, lay them out above using android:layout_above="@id/controls".

LIke so:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/fieldcontainer"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:baselineAligned="false" >
    <!-- Your other stuff -->

    <LinearLayout
        android:id="@+id/controls"
        android:layout_width="match_parent"
        android:layout_height="wrap_contgnt"
        android:orientation="horizontal"
        android:layout_alignParentBottom="true">
    <!-- Your control stuff -->
    </linearlayout>
</relativelayout>

Note that you must define an id (@+) before you can simply reference (@) it. So you can either move the controls view to occur in the XML file before anything else, or use “@+” in the location reference that comes first and then just use @ in the view defineintion.

So you would have android:layout_above="@+id/controls" and then the other line would be android:id="@id/controls".

And changing your layout would have no effect on the id’s present within it unless you changed them.