dawoodman71
dawoodman71

Reputation: 395

add space to top and bottom of ListView so top and bottom item can be centered

My ListView items need to be centered when they are selected, but the top and bottom items stop at the top or bottom of the list. How do I center the top and bottom items?

Here's my test layout:

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
       android:id="@+id/parent"
       android:layout_width="fill_parent"
       android:layout_height="fill_parent"
       android:clipChildren="false"
       android:clipToPadding="false"
       android:gravity="top" >

       <ListView
           android:id="@+id/listview"
          android:layout_width="match_parent"
          android:layout_height="match_parent"
          android:layout_centerVertical="true"
          android:clipChildren="false"
          android:clipToPadding="false" >
       </ListView>

    </RelativeLayout>

Upvotes: 0

Views: 813

Answers (1)

dawoodman71
dawoodman71

Reputation: 395

I couldn't find a solution to the clipping issue so I went with adding a header and footer to the ListView. I changed my ListView height back to match_parent and then, using the post method on my ListView's parent view, I was able to calculate the height of my header and footer like so:

// this call should be included in the onCreate method
// the post method is called after parentView is ready to be added
// so the parentView's height and width can be used
parentView.post(addSpace(parentView, myListView)); 

private Runnable addSpace(final RelativeLayout parent, final ListView list) {
    return new Runnable(){
        public void run() {
            // create list adapter here or in the onCreate method
            // R.layout.list_item refers to my custom xml layout file
            adapter = new ArrayAdapter<String>(MainActivity.this, R.layout.list_item, values);
            // calculate size and add header and footer BEFORE applying adapter
            // listItemHeight was calculated previously
            spacerSize = (parent.getHeight()/2) - (listItemHeight/2);
            list.addHeaderView(getSpacer(), null, false);
            list.addFooterView(getSpacer(), null, false);
            list.setAdapter(adapter);
        }
    }
}

// I used a function to create my spacers   
private LinearLayout getSpacer(){
    // I used padding instead of LayoutParams thinking it would be easier to
    // change in the future. It wasn't, but still made resizing my spacer easy
    LinearLayout    spacer = new LinearLayout(MainActivity.this);
                    spacer.setOrientation(LinearLayout.HORIZONTAL);
                    spacer.setPadding(parentView.getWidth(), spacerSize, 0, 0);
    return spacer;
}

Using this method I was able to add the proper spacing to the top and bottom of my ListView so when I scrolled all the way to the top the top item appeared in the center of my view.

PROBLEM: My app allows the user to hide the bottom interface element which should make my parent much taller. I am working out a way to make my header and footer taller dynamically but I may need to simply remove the ListView and recreate it with a larger header and footer.

I hope this helps someone from hours of frustration :)

Upvotes: 3

Related Questions