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.
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):

<?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>
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.
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>

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"/>
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With