We Keep Coding

Trying to place buttons below a list view

So I'm creating a list view that grows and shrinks based off of the user input and I need four buttons but I don't know how to have buttons that are aligned with the bottom of the list view and are in a 2x2 grid fashion. I've already tried relative layout and it didn't seem to work. Thank you

I've created the XML according to what I believed you wanted to see.
Please check the following screen shot:
The following is the XML file:
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context=".MainActivity">
<LinearLayout
android:id="#+id/linearLayout1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_alignParentBottom="true">
<Button
android:id="#+id/button3"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="BUTTON3"/>
<Button
android:id="#+id/button4"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="BUTTON4"/>
</LinearLayout>
<LinearLayout
android:id="#+id/linearLayout2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:layout_above="#id/linearLayout1">
<Button
android:id="#+id/button1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="BUTTON1"/>
<Button
android:id="#+id/button2"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="BUTTON2" />
</LinearLayout>
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#id/linearLayout2">
</ListView>
</RelativeLayout>
As you can see that I am using the RelativeLayout as the base wrapper and within the RelativeLayout, I have 2 linearlayouts for the buttons (2 each) and finally the list view. The purpose for the LinearLayout is simply to add weight to the buttons so they would share the equal amount of horizontal space. If that does not fit your criteria, feel free to remove them. The main thing to learn is that relative layout allows you to use attributes such as alignParenBottom, layout_above, layout_below and so on. These attributes allow you to place your elements anywhere on the screen and adjust them according to these attributes.
Let me know if you have any questions.

how to differentiate two "views" from overlapping each other

i am beginner to android programming and trying to build a simple app program.
whenever i try to make more than one views they stack on each other.
I am trying to make a text field and a button, but when i run it, the text field and button overlap each other however, i want them to be separated by some distance.
i am using the following code.
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:android1="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="horizontal"
tools:context="com.example.new1.MainActivity" >
<EditText android:id="#+id/edit_message"
android:layout_weight= "1"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:hint="#string/edit_message" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send" />
</RelativeLayout>
i am checking this code on Samsung Galaxy S2.
does anybody knows the solution to this problem and can guide me where i am doing it wrong.

Either use LinearLayout so that elements stack horizontally or vertically, or use attributes such as android:layout_toRightOf="#id/edit_message" to control placement within a RelativeLayout.
Find out more about LinearLayout here: http://developer.android.com/guide/topics/ui/layout/linear.html and RelativeLayout here: http://developer.android.com/guide/topics/ui/layout/relative.html

RelativeLayout positions views relative to each other. So if you do not specify the relationship between view, all the views will be put one above the other. You can either use LinearLayout with orientation attribute or define relationship between views. Following can be your working code
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent" >
<EditText
android:id="#+id/edit_message"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:gravity="center_vertical"
android:hint="#string/edit_message"
/>
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_toRightOf="#id/edit_message"
android:text="#string/button_send" />
</RelativeLayout>
Here android:layout_toRightOf="#id/edit_message" lets your button to be positioned to right of your edittext

Depending on what you want, a horizontal layout or vertical, you need a fitting layout xml.
You use relativeLayout, where you have to specify the parents to layout like:
android:layout_alignParentTop="true"
android:layout_alignParentLeft="true"
android:layout_alignParentStart="true"
If your beginner better take a look at a linear layout in vertical or horizontal mode.
You dont have to specify this then.
Like this:
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:orientation="horizontal"
android:weightSum="100"
>
<Button
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/bResults"
android:text="Try Command"
android:layout_weight="20" />
<ToggleButton
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#+id/tbPassword"
android:layout_weight="80"
android:checked="true"
/>
</LinearLayout>
This will put your two buttons nexto each other

How to center Textview inside Listview using RelativeLayout?

ArrayAdapter<String> arrayAdapter = new ArrayAdapter<String>(this,R.layout.activity_haltestellen, R.id.tvHaltestellen, HaltestellenListe);
lvH.setAdapter(arrayAdapter);
this is how the stuff is set and .xml:
<?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/lvHaltestellen"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" >
</ListView>
<TextView
android:id="#+id/tvHaltestellen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
/>
I get the StringArray from a database.
so how can center the tv inside the listview? realy bad thing

Try to add this one: android:layout_centerInParent="true"
<TextView
android:id="#+id/tvHaltestellen"
android:layout_centerInParent="true"
android:layout_width="wrap_content"
android:layout_height="wrap_content" />

I'm not quite sure what do you want to do, but if you want to center the TextView inside the RelativeLayout then remove
android:layout_alignParentBottom="true"
android:layout_alignParentRight="true"
from TV and try adding something like android:layout_centarInParent="true", and in the relative layout change match_parent to wrap_contents

You could anchor the TextView to the top and bottom of the ListView (and optionally left and right too, depending on the desired effect). That will make the TextView equally tall (and optionally wide), so use a center gravity to position the text in the middle.
<?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/lvHaltestellen"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />
<TextView
android:id="#+id/tvHaltestellen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignTop="#+id/lvHaltestellen"
android:layout_alignBottom="#+id/lvHaltestellen"
android:layout_alignLeft="#+id/lvHaltestellen"
android:layout_alignRight="#+id/lvHaltestellen"
android:gravity="center" />
</RelativeLayout>
If you're planning to add a background colour to the TextView, you'll need to wrap it inside another transparent container (e.g. a FrameLayout), to avoid the colour from obscuring what's displayed in the list. Something like:
<?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/lvHaltestellen"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true" />
<FrameLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignBottom="#+id/lvHaltestellen"
android:layout_alignLeft="#+id/lvHaltestellen"
android:layout_alignRight="#+id/lvHaltestellen"
android:layout_alignTop="#+id/lvHaltestellen" >
<TextView
android:id="#+id/tvHaltestellen"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_gravity="center"
android:background="#android:color/black" />
</FrameLayout>
</RelativeLayout>
Alternatively, if you decide to make the ListView fill up the whole height of the RelativeLayout, you don't need to anchor the TextView to the list anymore. As already pointed out by #user1796624, you can then just center the TextView.
As per your earlier comment on someone else's answer:
the textview is shown inside the listview.
I understand what you're trying to say here, but please do realize that the TextView does not sit inside the ListView, but rather floats on top of it.

Android App Layout

I'm developing an android app for 2.2 ver.
My app must hav such structure:
[ Spinner here (fixed height) ]
[ ListView (not-fixed height) ]
[ ImageView (fixed-height) ]
I have to use only portrait orientation.
I use linearLayout for it. How can I calculate listView height to show spinner on the top of the screen, imageview on the bottom, and listview cover all free space, but not push others away from field of view.
It will be cool to make it dinamic for lots of screen resolutions.
Thank you

Use a relative layout to accomplish what you need.
<?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" >
<Spinner
android:id="#+id/spinner1"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true" />
<ImageView
android:id="#+id/imageView1"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:src="#drawable/icon" />
<ListView
android:id="#+id/listView1"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#+id/spinner1"
android:layout_above="#+id/imageView1" />
</RelativeLayout>
By doing this listview will adjust its size so that it fits between the spinner and imageview on your screen

You need to use the android:layout_weight attribute on the variable-height item, so it fills the available space.
<LinearLayout
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
>
<Spinner
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
<ListView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
/>
<ImageView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
/>
</LinearLayout>

Here is another way to do this, using weights. This may be the easiest approach.
You can put in to the weight a percentage of the screen you would like it to take up.
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<Spinner
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="10"/>
<ListView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="80"></ListView>
<ImageView
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="10"/>
</LinearLayout>
EDIT:
Now that i think about it, this will "fix" the size of all the widgets. They will be "fixed" at percentages of the screen. This will scale well with other screen sizes, but you did say you wanted ListView to not be fixed.

Android Layout with ListView and Buttons

Alright, this specific layout is just annoying me. And can't seem to find a way to have a listView, with a row of buttons at the bottom so that the listview doesn't extend over top of the buttons, and so the buttons are always snapped to the bottom of the screen. Here's what I want:
removed dead ImageShack link
It seems like it should be so easy, but everything I've tried has failed. Any help?
Here's my current code:
RelativeLayout container = new RelativeLayout(this);
container.setLayoutParams(new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT,LayoutParams.FILL_PARENT));
//** Add LinearLayout with button(s)
LinearLayout buttons = new LinearLayout(this);
RelativeLayout.LayoutParams bottomNavParams = new RelativeLayout.LayoutParams(LayoutParams.WRAP_CONTENT, LayoutParams.WRAP_CONTENT);
bottomNavParams.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
bottomNavParams.addRule(RelativeLayout.CENTER_HORIZONTAL);
buttons.setLayoutParams(bottomNavParams);
ImageButton newLayer = new ImageButton(this);
newLayer.setImageResource(R.drawable.newlayer);
newLayer.setLayoutParams(new LinearLayout.LayoutParams(45, LayoutParams.FILL_PARENT));
buttons.addView(newLayer);
container.addView(buttons);
//** Add ListView
layerview = new ListView(this);
RelativeLayout.LayoutParams listParams = new RelativeLayout.LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
listParams.addRule(RelativeLayout.ABOVE, buttons.getId());
layerview.setLayoutParams(listParams);
container.addView(layerview);

I think this is what you are looking for.
<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent" android:layout_height="fill_parent">
<Button android:layout_width="fill_parent"
android:layout_height="wrap_content" android:id="#+id/testbutton"
android:text="#string/hello" android:layout_alignParentBottom="true" />
<ListView android:layout_width="fill_parent"
android:layout_height="fill_parent" android:id="#+id/list"
android:layout_alignParentTop="true" android:layout_above="#id/testbutton" />
</RelativeLayout>

I had the same problem for ages.
The solution to keeping the ListView above the buttons, but preventing it from covering them up when the list is long, is to set android:layout_weight="1.0" on the ListView. Leave the layout_weight on the buttons unset so that they remain at their natural size, otherwise the buttons will get scaled. This works with LinearLayout.
There's an example in the Android ApiDemos:
ApiDemos/res/layout/linear_layout_9.xml

I was just searching for an answer to this question and this was one of the first results. I feel as if all of the answers, including the one that is currently chosen as the "best answer" is not addressing the issue being asked about. The problem that is being stated is that there is an overlap of the two components Button and ListView in that the ListView is taking up the entire screen, and the Button is visually floating above (in front of) the ListView (blocking view/access of the last item in the ListView)
Based on the answers I've seen here and on other forums, I finally came to a conclusion on how to resolve this.
Originally, I had:
<?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"
android:background="#FF394952">
<ListView
android:id="#+id/game_list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
/>
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
style="#android:style/ButtonBar">
<Button
android:id="#+id/new_game"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/new_game"
android:textColor="#FFFFFFFF"
android:background="#drawable/button_background" />
</LinearLayout>
</RelativeLayout>
Note the use of RelativeLayout as the root node.
This is the final, working version in which the Button does not overlap the ListView:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:background="#FF394952">
<ListView
android:id="#+id/game_list"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentTop="true"
android:layout_weight="1.0" />
<LinearLayout
android:orientation="horizontal"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
style="#android:style/ButtonBar">
<Button
android:id="#+id/new_game"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="#string/new_game"
android:textColor="#FFFFFFFF"
android:background="#drawable/button_background" />
</LinearLayout>
</LinearLayout>
There are only two differences. First, I've switched to using a LinearLayout. This will help with the next bit, which was adding android:layout_weight to my ListView
I hope this helps.

The best way is a relative layout that sets the buttons below the listview. In this example the buttons are also in a linear layout because it is easier to put them side by side at an equal size.
<RelativeLayout android:id="#+id/RelativeLayout01"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
<ListView android:id="#+id/ListView01"
android:layout_alignParentTop="true"
android:layout_width="fill_parent"
android:layout_height="fill_parent">
</ListView>
<LinearLayout android:id="#+id/LinearLayout01"
android:layout_below="#+id/ListView01"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true">
<Button android:id="#+id/ButtonJoin"
android:text="Join"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:layout_alignParentBottom="true">
</Button>
<Button android:id="#+id/ButtonJoin"
android:layout_alignRight="#id/ButtonCancel"
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="Cancel"
android:layout_alignParentBottom="true">
</Button>
</LinearLayout>
</RelativeLayout>

I know this post is rather old, but, to answer the original poster's question, the reason the code did not work was buttons.getId() returns -1. If you are going to do this, you need to set do something like call buttons.setId(10). If you do that, the code works just fine.

the easiest solution would be to create two linear layouts, one with the button and the other with the list view(Wrap content on the button height and match parent on the list layout height). then only make a scroll view over the layout with the list view and the button layout will be ignored. hope it helps, sorry i didn't feel like writing out the code.

this should work. to have buttons above the listview too, put the buttons inside another linear layout.
<LinearLayout> main container // vertical
<LinearLayout> scrollview must be contained in a linear layout //vertical - height to fill parent
<ScrollView> set the height of this to fill parent
<ListView> will be contained in the scrollview
</ListView>
</ScrollView>
</LinearLayout>
<LinearLayout> //horizontal - height to wrap content
<Button>
</Button>
</LinearLayout>
</LinearLayout>