Thursday, July 15, 2010

How to Change a ListView Row's Background but Keep Normal Android Selector

Here's a problem which I thought would be super complex to solve but is actually rather simple. The solution assumes a bit of knowledge of ListView row types, though; if you've never dealt with them, here's a primer.

Suppose I want to make a ListView composed of similar rows with different backgrounds. This is simple enough; create a ListView with multiple item view types and then as each one loads, set a different background resource based on their type. The catch is that you want the selected/pressed graphics to still look the same. An example of this would be an email app; you want read and unread emails to look different, but when the item is selected or pressed you still want that tacky orange (or whatever your system uses).

The naive solution of simply setting the background resource does not work, because it completely blocks the standard selector:

// Bad; don't use this!
convertView.setBackgroundResrouce(R.color.some_color);


I was able to glean the correct answer by examining the Email app's source code (thank goodness for open source). What you want to do is create a background which is transparent whenever the list's background selector kicks in, but uses your custom background color (or resource) when it's not. Here's what the drawable xml looks like:

<selector xmlns:android="http://schemas.android.com/apk/res/android">
<item android:state_window_focused="false" android:state_selected="true" android:drawable="@android:color/transparent" />
<item android:state_selected="true" android:drawable="@android:color/transparent" />
<item android:state_pressed="true" android:state_selected="false" android:drawable="@android:color/transparent" />
<item android:state_selected="false" android:drawable="@color/some_color" />
</selector>


With this in hand, you can set your view's background like so:

convertView.setBackgroundResrouce(R.drawable.some_row_background);


Just apply the above XML to multiple files, and you'll be able to set different types of backgrounds but still preserve the ListView's selector background.

6 comments:

  1. Thanks a lot dude:). Really nice article.

    ReplyDelete
  2. This comment has been removed by the author.

    ReplyDelete
  3. Thanks for this, the first million Google results advocated your "Bad; don't use this!" approach... not helpful - I already knew how to do it the stupid way!

    I'm surprised this works - that the selector we specify ourselves sits on top of the default one rather than overwriting it. But it *does* work, so I won't worry myself too much.

    ReplyDelete
  4. can you post more code? where does the selector can attached?

    ReplyDelete
  5. Thanks for this article.... It helps a lot....

    ReplyDelete
  6. If you customize ListRow, this does not work, i.e setting a background still blocks standard selector.

    ReplyDelete