Android Linear/Relative Layout - how to "auto size" object in the middle (3 objects)

Question

I have two cases with Linear (also tried Relative) layout in android. The one happens for horizontal and the other for vertical. Lets start with the horizontal:

it is something like:

<LinearLayout ... >   
    <Button ...  layout:gravity = "left" layout:width = "wrap_content"/>
    <TextView ... layout:width = ??????? />
    <Image  .... layout:gravity = "right" layout:width = "wrap_content"/>
</LinearLayout>

Well , I want the button to stay at the left, the image to stay at the right(stick to the end , not just right of the text view) and the textview to (probably with an autowidth or whatever) to stay in the middle. If I put in textview width = "fill/match_parent it sends the image out of the screen. If I put wrap_content, then the image does not stay at the right of the screen. I have also tried relative layout without success.

Same case in vertical , where I have something like:

<LinearLayout ...>
    <LinearLayout .... layout:height = "wrap_content" layout:gravity= "top" />
    <ListView layout:height = ???????>
    <LinearLayout ... layout:height = "wrap_content" layout:gravity = "bottom" />
</LinearLayout>

Same requirement here. I want the first L.layout to stay on top, List view auto size between them and the 2nd Linear layout to stay at the bottom. (Imagine I'm trying to create a view that looks like a UITableView in iPhone that has a NavigationBar, the list of items and a ToolBar at the bottom. Fist LinearLayout is the NavigationBar, the LIst view are the cells and the second LinearLayout is the ToolBar).

Any suggestions? Would prefer the xml solutions.

Solution 1

It can simply done by using RelativeLayout here we go.

Horizontal alignment

<RelativeLayout 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">  

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

  <TextView
    android:id="@+id/text"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_toLeftOf="@+id/image"
    android:layout_toRightOf="@+id/button" />

  <ImageView
    android:id="@+id/image"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:background="@drawable/icon" />
</RelativeLayout>

Vertical alignment

  <LinearLayout
    android:id="@+id/linear_top"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content" />

  <ListView
    android:id="@+id/text"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_below="@+id/linear_top"
    android:layout_above="@+id/linear_bottom" />

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

Solution 2

For your second requirement use layout_weight for list view

<RelativeLayout ...>
   <LinearLayout 
        android:layout_height="wrap_content" 
        android:layout_width="fill_parent"
        android:layout_alignParentTop="true" />
   <ListView 
        android:layout_height ="0dp"
        android:layout_width="fill_parent" 
        android:layout_weight="1"
        android:layout_below="@+id/top_layout"
        android:layout_above="@+id/bottm_layout" />
   <LinearLayout 
        android:layout_height="wrap_content" 
        android:layout_width="fill_parent"   
        android:layout_alignParentBottom="true" />
</RelativeLayout>