Konrad Morawski
Konrad Morawski

Reputation: 8394

How to anchor buttons at the bottom of the layout?

I'd like the OK / Cancel buttons to be anchored at the bottom (even when there's more items on the list that can be shown on the screen). Here's what it currently looks like:

enter image description here

The buttons are on the top, not on the bottom.

The layout that contains the buttons:

<TableLayout xmlns:android="http://schemas.android.com/apk/res/android"
             android:orientation="horizontal"
             android:layout_width="fill_parent"
             android:layout_height="fill_parent"
             android:stretchColumns="true"
             android:id="@+id/buttons_layout">    
    <TableRow>    
        <Button
            android:id="@+id/btnOK"
            android:background="@color/pomegranate"
            android:text="OK"
            android:layout_gravity="fill_horizontal"
            android:layout_weight="1"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"/>        
        <Button
            android:id="@+id/btnCancel"
            android:background="@color/wet_asphalt"
            android:text="Cancel"
            android:layout_weight="1"
            android:layout_gravity="fill_horizontal"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"/>
    </TableRow>
</TableLayout>

The composite layout:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:orientation="vertical"
              android:layout_width="fill_parent"
              android:layout_height="fill_parent">
    <ListView android:id="@+id/options_list"
              android:layout_width="fill_parent"
              android:layout_height="match_parent">
    </ListView>
    <include layout="@id/buttons_layout"
             android:layout_alignParentBottom="true"
             android:layout_height="match_parent"
             android:layout_below="@id/options_list"/>
</RelativeLayout>

I followed the guidelines I read on http://developer.android.com/guide/topics/ui/layout/relative.html

I tried this answer - https://stackoverflow.com/a/6285438/168719 - it hasn't helped me.

I suspected that it might not work because the list view doesn't "know" how tall it is, so the button layout doesn't know where to place itself, either. But I ruled it out by setting the ListView height to an arbitrary value like 100dp. The buttons are still superimposed over it.

I fiddled with all the layout attributes, but I can't get it to work.

Apart from the solution, I would also like to know why mine doesn't work...

Upvotes: 0

Views: 5966

Answers (5)

Amit Gupta
Amit Gupta

Reputation: 8939

Try like this

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
                  android:layout_width="match_parent"
                  android:layout_height="match_parent">
        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:layout_above="@+id/layout_buttons"
            android:orientation="vertical" >
        <ListView android:id="@+id/options_list"
                  android:layout_width="match_parent"
                  android:layout_height="match_parent">
        </ListView>
       </LinearLayout>
        <include android:id="@+id/layout_buttons"
                 layout="@id/buttons_layout"
                 android:layout_alignParentBottom="true"
                 android:layout_height="wrap_parent"
                 android:layout_width="wrap_content"/>
    </RelativeLayout>

Upvotes: 0

vgarzom
vgarzom

Reputation: 153

try this. Put the include tag inside another RelativeLayout, then be sure ListView is above the new RelativeLayout

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/parentLayout"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:orientation="vertical" >

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

        <include
            android:id="@+id/buttons"
            android:layout_width="wrap_content"
            layout="@layout/buttons_layout" />
    </RelativeLayout>

    <ListView
        android:id="@+id/options_list"
        android:layout_width="fill_parent"
        android:layout_height="match_parent"
        android:layout_above="@id/buttonsContent" >
    </ListView>

</RelativeLayout>

Upvotes: 0

Maulik Sheth
Maulik Sheth

Reputation: 574

you could try using it this way

<relativelayout1>

<relativelayout2 specify layout below listview with id="list">
    <button1>
    <button2>
</relativelayout2>


<listview id="list">
</listview>

</relativelayout1>

so this will ensure no matter how long your list is you always get the buttons below your list. so you can have a scrolling list and a static buttons below the list

Upvotes: 0

alsadqy
alsadqy

Reputation: 109

you can use tab to do it

you can see this tutorial

Android Tab Layout Tutorial

Upvotes: 0

Houcine
Houcine

Reputation: 24181

the layout should be something like this :

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
              android:layout_width="match_parent"
              android:layout_height="match_parent">
    <ListView android:id="@+id/options_list"
              android:layout_width="match_parent"
              android:layout_height="match_parent"
              android:layout_above="@+id/layout_buttons" >
    </ListView>
    <include android:id="@+id/layout_buttons"
             layout="@id/buttons_layout"
             android:layout_alignParentBottom="true"
             android:layout_height="wrap_parent"
             android:layout_width="wrap_content"/>
</RelativeLayout>

Upvotes: 1

Related Questions