tags:

views:

1243

answers:

5

I have a simple list with a listselector like so.

<ListView android:id="@+id/list" android:layout_width="fill_parent"
    android:layout_height="fill_parent" android:layout_below="@+id/round"
    android:listSelector="#99000000" android:clickable="true" android:cacheColorHint="#00000000" android:background="#00000000">
</ListView>

As you can see android:listSelector="#99000000" but the "black alpha" color is applied to the entire list, not the selected item.


So this is what I have now but the entire list still turns black

::listview_background.xml

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"&gt;
  <item android:state_enabled="false" android:state_focused="true"
        android:drawable="@drawable/list_normal" />
  <item android:state_pressed="true"
        android:drawable="@drawable/list_pressed" />
  <item android:state_focused="true"
        android:drawable="@drawable/list_active" />
</selector>

::colors.xml

<resources>
    <drawable name="list_normal">#96FFFFFF</drawable>
    <drawable name="list_active">#66000000</drawable>
    <drawable name="list_pressed">#CA000000</drawable>
</resources>

::the xml tag in my list

android:listSelector="@drawable/listview_background"
A: 
Christopher
Hi still not working, see above
jax
+3  A: 

I had the same problem. I have a custom background image, and I don't want to have to make variants of that background image because that would be tedious to represent all the different states.

So I want to do the obvious thing, have a semi-transparent bar that is overlayed on top of the focused listitem and when the user taps the "enter" key or whatever, it flashes to the pressed overlay color which is more striking and somewhat more opaque.

The solution was to stay away from any @color or @drawable that refers to a color inside listSelector. I created two 3x3 pixel .png files. Each saved with the gamma layer. In my case it's two of the same color each mixed down in Gimp with a different transparency on the color layer. So when you select an item you get an overlay with 25% color, and when you press it you get a png with 50% color. I put them in my drawables as bg_list_item_pressed.png and bg_list_item_highlighted.png

Then I set my list selector to:

<?xml version="1.0" encoding="utf-8"?>
<selector xmlns:android="http://schemas.android.com/apk/res/android"&gt; 

  <!-- Selected --> 
  <item 
    android:state_focused="true" 
    android:state_pressed="false" 
    android:drawable="@drawable/bg_list_item_highlighted" /> <!--  @drawable/tab_focus -->

  <!-- Pressed -->
  <item 
    android:state_pressed="true" 
    android:drawable="@drawable/bg_list_item_pressed" /> <!--  @drawable/tab_press -->

</selector> 

Then I added my listSelector attributes to my ListView in my layout xml:

android:listSelector="@drawable/list_selector"
android:drawSelectorOnTop="true"

Now it works exactly how I want it to work. Including using the D-pad to select a row, and click it with enter. Getting the highlighting and subsequent pressing colors exactly how they should be.

Eric
the question remains: why can we not use a ColorDrawable for a single state? Creating a 3px image to represent a color is just a workaround, not a proper solution.
Matthias
A: 

I found this link to be a helpful workaround: http://whyandroid.com/android/186-fancy-listviews-part-five.html

Anna
A: 

Jax,

I was trying to figure out why my entire list was changing color setting the listSelector, and found out that this is exactly what it is supposed to do, i.e. we are setting the color for the entire list, and not the row which is what we want.

Here is what you want to do: I assume you have a ListView defined in XML. And for this ListView, I assume you are using an adapter of some sort to set present the data. Also for this adapter, you are using some row view that is defined in XML. What you want to do is set the background of this row element like this:

<?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="horizontal"
    android:background="@drawable/textview_selector">
        <TextView       android:id="@+id/textForList"
        android:layout_height="fill_parent"
        android:layout_width="wrap_content"
        android:padding="10sp"  />
</LinearLayout>

Here is my textview_selector.xml stored in drawable:

<?xml version="1.0" encoding="utf-8"?>
<selector
xmlns:android="http://schemas.android.com/apk/res/android"&gt;
    <item android:state_pressed="true" android:drawable="@drawable/teal" />
    <item android:drawable="@drawable/white" />
</selector>

Hope this helps

noobular
A: 

Above code worked like a charm. There are not any examples of how to do this from google.