Question

I’m trying to show a list of data in an android activity. Normally anyone would do that with a simple ListView which I have used many times before. But now I’m having an application with a fixed header and footer, with the middle part (the content) scrolling underneath both the header and the footer. In the middle section I would like to add other components both above and below the list of data, but the entire part must be scrollable. I tried adding components (like a button, textview etc) to a listview but the lay-out builder in Eclipse won’t let me do that.

So I started using a ScrollView where you can easily add any component you like. But I am not allowed to add a ListView to a ScrollView, which I can understand as it would create a strange effect (as both are able to scroll).

Next I wanted to use a TableLayout to dynamically add TableRows, but on multiple websites it is said to be slow and ‘not the way to do it’. I also couldn’t find an elegant way to add the seperator between each item. With a ListView that would all be done very easily.

The following image probably explaines at best the effect I want: http://tinyurl.com/bvkec5d

The table with the ‘Table Data’ header can possibly have a lot of items and thus can become very large in length. What I don’t want is that the table has a fixed size and the items are scrollable within that table. I actually want the table to grow in size and the ScrollView containing the table should therefore be growing as well. I also want the infobox above the table to scroll along (as with any other components which might be added later).

What is the best way to achieve this effect?

Answer 1

You can use a simple vertical LinearLayout (or a RelativeLayout) that contains your static header and footer, and use a ListView between them. You can set header and footer views on the ListView to add the scrollable header and footer content. For simplicity of example here’s the LinearLayout way:

 <LinearLayout android:orientation="vertical" 
               android:layout_height="match_parent"
               android:layout_width="match_parent">
      <!--static header content... can be any kind of view-->
      <TextView 
               android:layout_width="match_parent"
               android:layout_weight="0"
               android:layout_height="wrap_content"/>
      <ListView 
               android:id="@+id/list"
               android:layout_width="match_parent"
               android:layout_height="0dp"
               android:layout_weight="1"/>

      <!--static footer content... can be any kind of view-->
      <TextView 
               android:layout_width="match_parent"
               android:layout_weight="0"
               android:layout_height="wrap_content"/>
 </LinearLayout>

And in code, you can say:

ListView theList = (ListView)findViewById(R.id.list);

// example of creating header and footer views from inflation or by instantiation in code
View myHeaderView = getLayoutInflater().inflate(R.layout.myHeaderLayout,theList,false);
View myFooterView = new TextView(this, some layout params);

theList.addHeaderView(myHeaderView); 
theList.addFooterView(myFooterView); 

ListView.addHeaderView and ListView.addFooterView should enable you to add other static views (whose content could be updated dynamically) to the top or bottom of a ListView:

public void addHeaderView (View v)

Since: API Level 1 Add a fixed view to appear at the top of the list.
If addHeaderView is called more than once, the views will appear in
the order they were added. Views added using this call can take focus
if they want.

NOTE: Call this before calling setAdapter. This is so ListView can
wrap the supplied cursor with one that will also account for header
and footer views.