Google building-blocks style ListView for Android

The default ListView on Android with no styling applied is pretty vanilla and boring. Google have provided some guidelines on how to provide more stylish lists here:

http://developer.android.com/design/building-blocks/lists.html

but unfortunately do not provide any code to achieve this. It isn’t difficult, but I put a version together for a project I was working on and thought I would create a standalone project showing one way to do it. It’s mainly xml and styling with various dimensions but this should produce that style of list and works on pre Ice Cream Sandwich devices too. For the purposes of a demo I went with Fr. Ted themed data 🙂 The buttons on the right are for that sort of master + detail + navigation style list that you can see in Google Drive.

The code can be found here:

https://github.com/steprobe/ListDemo

list

Advertisements

8 thoughts on “Google building-blocks style ListView for Android

    • steprobe says:

      Hi Eduardo,
      It may well be now. When I originally did this, I copied the pattern from google drive. Here is a screenshot of how it used to look:

      Google Drive (previous)

      They have now changed it to be an “i” icon, but this is simple – just change the drawable to what suits you.

  1. MJ says:

    How do you write a on item click listener? It works only for the headers I find….

    listview.setOnItemClickListener(new AdapterView.OnItemClickListener() {
    public void onItemClick(AdapterView parentAdapter, View view, int position,
    long id) {}};

  2. MJ says:

    I added the onClickListener directly to the convertView

    convertView.setOnClickListener(listener);

    But I want to click the arrow and be able to activate the listener, do you know how?

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s