Selector for a view background gets applied to all siblings when focused

Question

I have a linearLayout with buttons as its children. I need the button backgrounds to change when they get focus. The buttons are focusable in touch mode.

I have set the following selector xml to the buttons.

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_focused="true"  
           android:drawable="@drawable/tile_focused" />
    <item android:drawable="@drawable/tile" /> <!-- default -->
</selector>

Update

if (layout == null) {
        layout = new LinearLayout(this);
        RelativeLayout.LayoutParams rlp = new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.WRAP_CONTENT);
        rlp.addRule(RelativeLayout.BELOW, R.id.toplogo);
        layout.setLayoutParams(rlp);
        layout.setId(wordLayoutID);
        layout.setBackgroundColor(Color.WHITE);
        mainLayout.addView(layout, rlp);
    } 

    Drawable tileBG = getResources().getDrawable(R.drawable.selector_tile);
    for (int i = 0; i < word.length(); i++) {
        Button btntile = new Button(this);
        LinearLayout.LayoutParams rlp =  new LinearLayout.LayoutParams(40, 40);
        btntile.setId(inputViewsIds+i);
        btntile.setBackgroundDrawable(tileBG);
        btntile.setFocusableInTouchMode(true);
        layout.addView(btntile, rlp);
    }

The problem is that when I set focus to any one button, all button's backgrounds change to "tile_focused". I guess the problem is in the selector xml. What is wrong here?

Answer 1

The root cause of this behavior was the common tile drawable reference I used for all buttons. I changed that and loaded separate drawables for each button. That fixed it.

Thanks to Everyone.

Answer 2

In short it looks like you want android:state_pressed="true" maybe a mix of some other stuff too. I'm not 100% sure but read on.

For problems like this I always look at the source code to see how the styles and themes work. The source code for the ListView style is below.

Looking at the source <item name="android:listSelector">@android:drawable/list_selector_background</item> looks like where we want to dive deeper into.

Here's the source code for that drawable. This should provide guidance to accomplish what you want.

https://github.com/android/platform_frameworks_base/blob/master/core/res/res/drawable/list_selector_background.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">

  <item android:state_window_focused="false" android:drawable="@color/transparent" />

  <!-- Even though these two point to the same resource, have two states so the drawable will invalidate itself when coming out of pressed state. -->
  <item android:state_focused="true"  android:state_enabled="false" android:state_pressed="true" android:drawable="@drawable/list_selector_background_disabled" />
  <item android:state_focused="true"  android:state_enabled="false"                              android:drawable="@drawable/list_selector_background_disabled" />
  <item android:state_focused="true"                                android:state_pressed="true" android:drawable="@drawable/list_selector_background_transition" />
  <item android:state_focused="false"                               android:state_pressed="true" android:drawable="@drawable/list_selector_background_transition" />
  <item android:state_focused="true"                                                             android:drawable="@drawable/list_selector_background_focus" />

</selector>

https://github.com/android/platform_frameworks_base/blob/master/core/res/res/values/styles.xml#L614

<style name="Widget.ListView" parent="Widget.AbsListView">
    <item name="android:listSelector">@android:drawable/list_selector_background</item>
    <item name="android:cacheColorHint">?android:attr/colorBackgroundCacheHint</item>
    <item name="android:divider">@android:drawable/divider_horizontal_dark_opaque</item>
</style>

<!-- Abstract ListView, nothing of importance here. -->
<style name="Widget.AbsListView">
    <item name="android:scrollbars">vertical</item>
    <item name="android:fadingEdge">vertical</item>
</style>