I'm porting a board game from Windows Phone to Android and struggle a lot with the Android layout system.
This is the layout of the main page on Windows Phone:
I have a Grid with row definitions like this:
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition Height="*"/>
</Grid.RowDefinitions>
This means the controls at the bottom get whatever height is left after the board in the top row has taken what it needs. The board size updates itself at runtime to use the smallest of it's width and height, so that it becomes a square.
I'm almost getting what I want when using a RelativeLayout as root layout, but my problem with RelativeLayout as root layout is that the controls at the bottom ends up filling the entire screen.
I've done several attempts to use a TableLayout as root layout with two TableRows as children, where the first TableRow has android:height="match_parent" or "wrap_content" and the second TableRow has android:height="wrap_content". Even though I set the board size at runtime, Android doesn't resize the TableRow like Windows Phone does, so the first TableRow takes up the entire screen.
How would an expert on the Android layout system attack a problem like this? I've got an alpha release up at Google Play that looks quite well on a 7" tablet, but on phones with high DPI screens it looks like this:
Update:
As Luksprog suggested in a comment, I now use a LinearLayout with the first element having android:layout_height="0dp" and android:layout_weight="1" and the second part having android:layout_height="wrap_content". At first it didn't seem to do what I wanted, because the part at the bottom ended up taking the entire screen as I've experienced on several attempts before.
However after doing some modifications to the "wrap_content" and "match_parent" settings of the elements inside the fragments, I now get a layout that is close to what I want, and it scales quite well on high DPI phones as long as I stick with px instead of dp values for all bitmaps (against all recommendations in the Android guidelines).
Here's is the updated layout and a screenshot showing the result:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<!-- Board -->
<EivindApps.Ludo.Droid.Views.BoardView
android:id="#+id/boardView"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
<!-- Game info layout -->
<LinearLayout
android:id="#+id/gameInfoLayout"
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content">
<!-- Left column -->
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<!-- Red player -->
<fragment
android:name="EivindApps.Ludo.Droid.Views.PlayerInfoFragment"
android:id="#+id/redPlayerInfoFragment"
android:layout_margin="5dp"
android:layout_alignParentLeft="true"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content" />
<!-- Blue player -->
<fragment
android:name="EivindApps.Ludo.Droid.Views.PlayerInfoFragment"
android:id="#+id/bluePlayerInfoFragment"
android:layout_margin="5dp"
android:layout_alignParentBottom="true"
android:layout_alignParentLeft="true"
android:layout_height="wrap_content"
android:layout_weight="0"
android:layout_width="wrap_content" />
</LinearLayout>
<!-- Middle column -->
<LinearLayout
android:orientation="vertical"
android:layout_width="wrap_content"
android:layout_height="wrap_content">
<!-- Dice -->
<fragment
android:name="EivindApps.Ludo.Droid.Views.DiceFragment"
android:id="#+id/diceFragment"
android:layout_centerHorizontal="true"
android:layout_centerVertical="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_gravity="center_vertical" />
</LinearLayout>
<!-- Right column -->
<LinearLayout
android:orientation="vertical"
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1">
<!-- Yellow player -->
<fragment
android:name="EivindApps.Ludo.Droid.Views.PlayerInfoFragment"
android:id="#+id/yellowPlayerInfoFragment"
android:layout_margin="5dp"
android:layout_alignParentRight="true"
android:layout_alignParentTop="true"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
android:layout_toRightOf="#+id/redPlayerInfoFragment" />
<!-- Green player -->
<fragment
android:name="EivindApps.Ludo.Droid.Views.PlayerInfoFragment"
android:id="#+id/greenPlayerInfoFragment"
android:layout_margin="5dp"
android:layout_alignParentRight="true"
android:layout_alignParentBottom="true"
android:layout_height="wrap_content"
android:layout_toRightOf="#+id/bluePlayerInfoFragment"
android:layout_width="wrap_content" />
</LinearLayout>
</LinearLayout>
<!-- End of game info layout -->
</LinearLayout>
Related
I have an activity in my app where I would like the user to be able to vertically scroll the content contained inside a LinearLayout which in turn is inside a ScrollView. Here is a summary of what the layout XML for this activity looks like:
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="fill_parent"
android:layout_height="match_parent">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_margin="20dip"
android:orientation="vertical">
<!-- a bunch of standard widgets, omitted for brevity -->
<!-- everything renders but starting in this TextView -->
<!-- content begins to get truncated -->
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:paddingLeft="20dp"
android:gravity="left"
android:textSize="20dip"/>
<!-- this View, really just a trick for a horizontal row, is -->
<!-- completely cutoff -->
<View
android:layout_width="fill_parent"
android:layout_height="2dip"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:background="#color/green" />
</LinearLayout>
</ScrollView>
</LinearLayout>
What I am observing is that content in the inner LinearLayout is being cutoff inside the ScrollView. In the final TextView above, when it contains little text, then the View below it does render in portrait, but does not in landscape. When this TextView contains a lot of text, then it gets cutoff in portrait mode.
I tried the recommendations I found on Stack Overflow. Adding bottom padding to the ScrollView did not resolve the problem, nor did swapping the ScrollView for a NestedScrollView.
Any helpful suggestions would be welcome. This is actually turning out to be a blocker.
Change your inner LinearLayout's margin to padding. Or, if you really need it to be margin (maybe you're using a custom background), wrap your LinearLayout in a FrameLayout.
The ScrollView is taking its height (or, more accurately, it is computing its scrollable range) from the LinearLayout. This value doesn't include margins, so your ScrollView is going to be "too short" by the sum of the LinearLayout's top and bottom margins.
The margins are ignored while measuring, See this
So you can provide padding to your ScrollView and remove margins from your LinearLayout
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="match_parent">
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:padding="20dp">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical">
<!-- a bunch of standard widgets, omitted for brevity -->
<!-- everything renders but starting in this TextView -->
<!-- content begins to get truncated -->
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingLeft="20dp"
android:gravity="left"
android:textSize="20dip"/>
<!-- this View, really just a trick for a horizontal row, is -->
<!-- completely cutoff -->
<View
android:layout_width="match_parent"
android:layout_height="2dip"
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:background="#color/green" />
</LinearLayout>
</ScrollView>
Also fill_parent is deprecated and renamed match_parent in API Level 8 and higher
I'm struggling on a layout management so I decided to ask here.
I would like to get 3 layouts working in a certain way.
I have 3 views vertically dispatched into a RelativeLayout (let's call them VTop, VMiddle and VBottom).
VBottom is a Button, I want him to stay aligned with the bottom of the screen and to never move or get resized (actually working).
VMiddle is a scroll view. I want this ScrollView to take all possible place between the bottom button (VBottom) and the top most layout (VTop) but never having it height inferior to an specific size.
I would like to have VTop (A linear layout containing some TextViews and other stuffs) wrapping all of its content as long as VMiddle doesn't get smaller that its minimum size.
Actually the code I have is almost working but when I Inflate too much content into VMiddle, it keeps growing towards the top of the screen and VTop completely disappear. I want VMiddle to stay at it minimum size if VTop doesn't have enough space to wrap his content.
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/relativeLayout1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout1" <!-- VTop -->
android:layout_above="#+id/eventDetail_RateLayout"
android:layout_alignParentTop="true"
android:layout_margin="10sp"> <!-- LOT OF VIEWS, NEED TO BE WRAPPED AS MUCH AS POSSIBLE -->
</LinearLayout>
<LinearLayout
android:orientation="vertical"
android:layout_width="match_parent"
android:layout_height="100px"
android:id="#+id/eventDetail_RateLayout" <!-- Not visible for now, you can ignore it -->
android:layout_marginTop="10dp"
android:layout_marginBottom="10dp"
android:minWidth="25px"
android:minHeight="25px"
android:background="#color/common_google_signin_btn_text_light_default"
android:layout_above="#+id/eventDetail_CommentScrollView"
android:visibility="gone" />
<ScrollView
android:id="#+id/eventDetail_CommentScrollView" <!-- VMiddle -->
android:background="#4D4A58"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_above="#+id/eventDetail_commentButton">
<LinearLayout
android:orientation="vertical"
android:minWidth="25px"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/eventDetail_CommentLayout" />
</ScrollView>
<Button
android:text="commenter"
android:id="#+id/eventDetail_commentButton" <!-- VMiddle, this one is doing ok -->
android:background="#666"
android:textColor="#f8f8f8"
android:layout_width="match_parent"
android:layout_height="30sp"
android:layout_alignParentBottom="true" />
</RelativeLayout>
Thanks for your answers.
Try the following code for the ScrollView -
<ScrollView
android:id="#+id/eventDetail_CommentScrollView" <!-- VMiddle -->
android:background="#4D4A58"
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_below="#id/linearLayout1"
android:layout_weight="1"
android:layout_above="#+id/eventDetail_commentButton">
...
</ScrollView>
Use this, however the kind of UI you want can be easily achieved using Linear layout and using weight and weightSum properties.. also rename ID of the layout and views accordingly
<?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">
<LinearLayout
android:id="#+id/topLayout"
android:layout_width="match_parent"
android:layout_height="100dp"
android:layout_alignParentTop="true"
android:background="#70AD47"
android:orientation="vertical">
</LinearLayout>
<ScrollView
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_above="#+id/btnBottom"
android:layout_below="#+id/topLayout"
android:background="#ED7D31"
android:minHeight="400dp">
<LinearLayout
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:orientation="vertical">
</LinearLayout>
</ScrollView>
<Button
android:id="#+id/btnBottom"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:background="#4472C4"
android:text="Bottom button" />
</RelativeLayout>
1. Add attribute android:layout_below="#id/linearLayout1" and android:layout_above="#id/eventDetail_commentButton" to ScrollView to keep it at middle position.
2. Use ScrollView and its child LinearLayout height android:layout_width="match_parent" although its not necessary.
No matter how big the top and bottom layout, middle scrollview will always fill the middle free spaces. It will never change the height of top and bottom layout.
Here is the working layout:
<RelativeLayout
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/relativeLayout1">
<LinearLayout
android:orientation="horizontal"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:id="#+id/linearLayout1"
android:layout_alignParentTop="true"
android:layout_margin="10sp">
</LinearLayout>
<Button
android:text="commenter"
android:id="#+id/eventDetail_commentButton"
android:background="#666"
android:textColor="#f8f8f8"
android:layout_width="match_parent"
android:layout_height="30sp"
android:layout_alignParentBottom="true" />
<ScrollView
android:id="#+id/eventDetail_CommentScrollView"
android:background="#4D4A58"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:layout_below="#id/linearLayout1"
android:layout_above="#id/eventDetail_commentButton">
<LinearLayout
android:orientation="vertical"
android:minWidth="25px"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:id="#+id/eventDetail_CommentLayout" />
</ScrollView>
</RelativeLayout>
Hope this will help~
Use android:layout_below="#+id/linearlayout1"
in eventDetail_RateLayout
I'm pretty sure none of the given answers achieve what you're looking for. What you wanna do is not simple because it involves a circular dependency: you basically want your vTop view to wrap and fill any space left by your vMiddle view (android:layout_above="#id/vMiddle") and at the same time you want your vMiddle view to wrap and fill any space left by your vTop view (android:layout_below="#id/vTop").
The only solution I can imagine would be to check and set the view sizes programmatically, I don't think this is doable only by rearranging your layout.
I finally achieved to get something close to what I wanted. I combined layout_above and below and fixed the size of VTop by making the Huge TextView scrollable. I have now VTop and VBottom at a fixed size and VMiddle taking the rest of the place at the center.
Thanks for your fast answers :)
I just started a programing in course in android studio using Java and XML and cant really figure out how to do a simple task. I have 3 buttons at the top of the screen, they fill up the whole width of the screen. I want to add a text below these 3 buttons, but i dont really now how to specify this. Right now i have:
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout 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"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main">
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_send" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_textcolor" />
<Button
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:text="#string/button_textsize" />
<TextView
android:text="South Africa"
android:layout_height="wrap_content"
android:layout_width="wrap_content"
/>
</LinearLayout>
Now, the text in the text element is displayed at the right side of the screen, its barely visible. The text gets cramped up so tight that it gets misaligned verticaly. What would i do if i instead wanted the text inside the textview element to be displayed just below the 3 buttons, to the left horizontaly, like normal text?
Thank you!
Use something like this. Inside the TextView tag add:
android:layout_below="#+id/buttonid"
Obviously you have to use relative layout for using this
Here you go
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main">
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="horizontal" >
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_send" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_textcolor" />
<Button
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="1"
android:text="#string/button_textsize" />
</LinearLayout>
<TextView
android:text="South Africa"
android:layout_height="match_parent"
android:layout_width="wrap_content"
/>
</LinearLayout>
Use RelativeLayout instead of LinearLayout. There are also many other layouts you can try. Check here for the other type of available layouts.
RelativeLayout lets child views specify their position relative to the
parent view or to each other (specified by ID). So you can align two
elements by right border, or make one below another, centered in the
screen, centered left, and so on. By default, all child views are
drawn at the top-left of the layout, so you must define the position
of each view using the various layout properties available from
RelativeLayout.LayoutParams.
Basically when I make a new project in android studio, all default activities contain a NestedScrollView.
If I try to put a grid layout, as its only children, the colums go outside the screen size. You can see that in the picture below:
this is adding a imagebutton identical to the one with the bottle in (1,1) notice that the width of the button is wrap_content, but there's no content (the wine is an squared icon,set as src,with fitStart scale),yet it covers the whole size of the screen for some reason.
I tried multiple things to make it work, reading stackoverflow I understood that I should use android.support.v7.widget.GridLayout instead of grid layout,and so I did. Then I read that I should add a linear layout as a parent,for some reason,but no fortune.
here's my xml file
<?xml version="1.0" encoding="utf-8"?>
<android.support.v4.widget.NestedScrollView
xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:tools="http://schemas.android.com/tools"
xmlns:app="http://schemas.android.com/apk/res-auto"
app:layout_behavior="#string/appbar_scrolling_view_behavior"
tools:showIn="#layout/activity_main"
android:layout_width="match_parent"
android:layout_height="match_parent"
tools:context="it.giuseppi.alessandro.wine.Main">
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical" >
<android.support.v7.widget.GridLayout
android:layout_width="match_parent"
android:layout_height="900dp"
app:columnCount="3">
<ImageButton
android:layout_height="150dp"
app:layout_column="0"
android:id="#+id/imageButton"
android:src="#drawable/premium"
android:scaleType="fitStart"
android:background="#color/yellow"
android:baselineAlignBottom="false"
app:layout_row="0"/>
<ImageButton
android:layout_width="wrap_content"
android:layout_height="150dp"
android:id="#+id/imageButton2"
android:src="#drawable/premium"
android:scaleType="fitStart"
app:layout_column="1"
app:layout_row="1" />
</android.support.v7.widget.GridLayout>
</LinearLayout>
</android.support.v4.widget.NestedScrollView>
if needed I can provide my whole project.
Check on your Row settings and row sizes.
app:layout_column="1"
app:layout_row="1" />
The rows width is equivalent to the device width. That means any other horizontally placed item goes to the right of the screen.
I'm struggling to get a layout looking correctly, and I've tried to produce the shortest, smallest possible example of my problem.
My goal is to have a header and footer View, at the top and bottom of the screen, with a ListView in between the two, with another View (let's call it the label, it's the gray box from the screen shots) directly below the ListView. This label, and the footer should always be shown when ListView needs to scroll.
Visual Result
When the ListView does not need to scroll (this is correct):
When the ListView needs to scroll, the footer and the gray box are pushed off screen (wrong):
Layout
<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:orientation="vertical">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="header"
android:padding="20dp"
android:textSize="18sp"
android:background="#color/red"/>
<ListView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#android:id/list" />
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="this should be directly below the ListView, but not pushed off screen when the ListView needs to scroll"
android:padding="5dp"
android:background="#color/light_gray"
android:textColor="#color/black"/>
<!-- Used to push the footer to the bottom -->
<View android:layout_width="0dp" android:layout_height="0dp" android:layout_weight="1"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="footer"
android:padding="20dp"
android:textSize="18sp"
android:background="#color/blue"/>
</LinearLayout>
Test Activity
public class TestActivity extends ListActivity
{
public void onCreate(Bundle savedInstanceState)
{
super.onCreate(savedInstanceState);
ArrayList<String> items = new ArrayList<String>();
items.add("one");
items.add("two");
items.add("three");
items.add("four");
items.add("five");
items.add("six");
items.add("seven");
items.add("eight");
items.add("nine");
items.add("ten");
setListAdapter(new ArrayAdapter<String>(this, R.layout.simple_list_item_1, items));
setContentView(com.myproject.android.R.layout.test);
}
}
I've tried a few different approaches, such as giving the ListView layout_weight="1" and removing the blank View that I use to push the footer to the bottom. This is almost what I want, it keeps the footer and label visible when the ListView scrolls, but when it only has 1 or 2 items, I need the gray box right below the ListView. I've also attempted to use a RelativeLayout, without success. I guess I'm completely misunderstanding things.
EDIT
Here's my attempt with a RelativeLayout which still isn't correct.
<?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">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="header"
android:padding="20dp"
android:textSize="18sp"
android:background="#color/red"
android:id="#+id/header"
/>
<ListView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#android:id/list"
android:layout_below="#id/header"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="this should be directly below the ListView, but not pushed off screen when the ListView needs to scroll"
android:padding="5dp"
android:background="#color/light_gray"
android:textColor="#color/black"
android:layout_below="#android:id/list"/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="footer"
android:padding="20dp"
android:textSize="18sp"
android:background="#color/blue"
android:layout_alignParentBottom="true"
android:id="#+id/footer"/>
</RelativeLayout>
Relative Layout (Still Wrong):
Add android:layout_weight="1" to the listview. That will make it the biggest element in the LinearLayout, without pushing the other ones off the screen.
This layout adds the header a top of the screen and the footter and the bottom. The list fills the rest of the screen. With theses aproach list elements never be obscured by the footer. See how to add the gray box below the XML...
<?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">
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="header"
android:padding="20dp"
android:textSize="18sp"
android:background="#color/red"
android:id="#+id/header"
/>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="footer"
android:padding="20dp"
android:textSize="18sp"
android:background="#color/blue"
android:layout_alignParentBottom="true"
android:id="#+id/footer"/>
<ListView android:layout_width="fill_parent"
android:layout_height="fill_parent"
android:id="#android:id/list"
android:layout_below="#id/header"
android:layout_above="#id/footer"/>
</RelativeLayout>
Ok. This XML solves the problem of the missing footer. Now we have to add a gray box at the end of the list. I think there is two ways to do it:
Use the addFooterView method: http://developer.android.com/reference/android/widget/ListView.html#addFooterView(android.view.View)
Play with the adapter and the getViewTypeCount() method so you can define two types or elements: normal elements and footer element. http://developer.android.com/reference/android/widget/BaseAdapter.html#getViewTypeCount()
A solution that worked for me was to add positive padding to the bottom of the list view and negative padding to the top of the "footer". This will work in a linear layout or a relative layout.
<ListView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:paddingBottom="50dp"/>
<TextView
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginTop="-50dp"/>
Two years late to answer the question, but I will leave my solution so it may help someone with the same problem. I solve this problem using 2 nested LinearLayouts and using layout_weigth. Maybe not the best performatic layout, but it reaches the desired effect.
You need to arrange your layout this way:
Your ListView will have wrap_content height to take only the needed space when not filling the entire screen.
Your ListView will be inside a layout with height using layout_weight so the list will take only the needed space when not filling the entire screen and to take only a limited space of the screen when it have size enouth to push the views out of screen.
The grey box view the should be immediately below the list will have wrap_content height and will be a sinbling of the layout of step 2.
This layout and the grey box will be inside a second layout with wrap_content height so they can stay together.
Now you have a layout with the list and the grey view and the list won't push the other views out of screen if it gets too big; you only need to move the footer view to the bottom of the screen.
5a. If you are using RelativeLayout as your root layout, you can do as sgallego said and use android:layout_alignParentBottom.
5b. But if you are using LinearLayout you need to create a third layout with layout_weigth and put inside the layout of step 4 and a empty view also with layout_weigth to fill the empty space.
Here is a commented example.
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical" >
<!-- Header -->
<TextView
android:id="#+id/RecordStudy_StudyLabel"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/RecordStudy_StudyLabel"
android:textSize="#dimen/text_large" />
<!-- Body -->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical" >
<!--
This layout encapsules the list and the button that must be immediately
below the list with a wrap_content height, so the list plus the button
fills only as much space as they need (if the list is not big enouth to
fill the entire screen).
-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:orientation="vertical" >
<!--
Layout with varaible size with a list inside.
Using layout_weight tells android that this layout should not grow
greater then the screen, but uses only the free space.
-->
<LinearLayout
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1"
android:orientation="vertical" >
<!--
Inside this limited height layout, there is a list with height
wrap_content so it can grow as much as it needs INSIDE the
layout (through scrolling).
-->
<ListView
android:id="#+id/RecordStudy_StudyList"
android:layout_width="match_parent"
android:layout_height="wrap_content" />
</LinearLayout>
<!-- Button immediately below the list -->
<Button
android:id="#+id/RecordStudy_AddStudy"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/RecordStudy_AddStudy" />
</LinearLayout>
<!-- Space between the list and the footer -->
<View
android:layout_width="match_parent"
android:layout_height="0dp"
android:layout_weight="1" />
</LinearLayout>
<!-- Footer -->
<Button
android:id="#+id/RecordStudy_ConfirmButton"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:text="#string/RecordStudy_ConfirmButton" />
</LinearLayout>
One solution that I implemented and found useful was to keep the listview inside a linear layout with fixed height so that it doesn't extend and overlap other items.
Something like this:
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="header"
android:padding="20dp"
android:textSize="18sp"
android:background="#color/red"
android:id="#+id/header"
/>
<LinearLayout
android:layout_width="fill_parent"
android:layout_height="150dip" //assume 150dip height is sufficient
<ListView android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:id="#android:id/list"
android:layout_below="#id/header"/>
</LinearLayout>
<TextView
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:text="this should be directly below the ListView, but not pushed off screen when the ListView needs to scroll"
android:padding="5dp"
android:background="#color/light_gray"
android:textColor="#color/black"
android:layout_below="#android:id/list"/>