Question

I have the following layout:

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="@drawable/aussie_bg_big" >

<ImageView
    android:id="@+id/titleImage"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_centerHorizontal="true"
    android:contentDescription="@null"
    android:src="@drawable/aussie_title_small" />

<ImageView
    android:id="@+id/clearButtonOutput"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/titleImage"
    android:layout_alignParentRight="true"
    android:contentDescription="@null"
    android:src="@drawable/aussie_clear" />

<EditText
    android:id="@+id/OutputText"
    android:layout_width="fill_parent"
    android:layout_height="100dp"
    android:layout_above="@+id/clearButtonOutput"
    android:layout_alignParentLeft="true"
    android:background="@drawable/textbox"
    android:ems="10"
    android:gravity="top"
    android:inputType="textMultiLine"
    android:textColor="#ffffff" />

<ImageView
    android:id="@+id/translateButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/OutputText"
    android:layout_centerHorizontal="true"
    android:clickable="true"
    android:contentDescription="@null"
    android:src="@drawable/translatebuttonselector" />

<ImageView
    android:id="@+id/ClearButton"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_above="@+id/translateButton"
    android:layout_alignParentRight="true"
    android:contentDescription="@null"
    android:src="@drawable/aussie_clear" />

<EditText
    android:id="@+id/InputText"
    android:layout_width="fill_parent"
    android:layout_height="100dp"
    android:layout_above="@+id/ClearButton"
    android:layout_alignParentLeft="true"
    android:background="@drawable/textbox"
    android:ems="10"
    android:gravity="top"
    android:inputType="textMultiLine"
    android:singleLine="false"
    android:textColor="#ffffff" />

What I’d like to do is:

-> Keep the “imageBottom” imageview on the BOTTOM of the activity at all times, centered horizontally.

-> Keep the “imageCenter” imageview on the center of the activity at all times, centered horizontally.

-> Keep “imageBelowInputText” imageview below the InputText edittext which is located ABOVE imageCenter, aligned to the right.

-> Keep “imageBelowOutputText” imageview below the OutputText edittext which is located BETWEEN imageCenter and imageBottom, aligned to the right.

It works fine so far but I’d also like for the edittext views to occupy ALL of the remaining space EQUALLY. Providing different versions of the layout for small, normal, large, x-large screens worked fine, considering I hardcoded each edittext’s size in dpi. However, on some layouts, it still looks a bit wrong and misplaced (misaligned). That’s why I’m looking for a solution to place the ImageViews accordingly first, and then let the two EditTexts take all the remaining space EQUALLY (important).

So far, I couldn’t think of a 100% correct solution. Can you help me out? Thanks!

Answer 1

Notice the two edittexts have their layout_height set to “0dp” and layout_weight set to “1”
XML

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:paddingTop="15dp"
    android:orientation="vertical" >

    <EditText
        android:id="@+id/editText1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

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

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:layout_gravity="center"
        android:text="Bear" />

    <EditText
        android:id="@+id/editText1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="right"
        android:text="Clear" />

    <Button
        android:id="@+id/button2"
        android:layout_width="wrap_content"
        android:layout_height="100dp"
        android:layout_gravity="center"
        android:text="Speaking Aussie" />

</LinearLayout>