HorizontalListview with image select and unselect

Question

i am getting problem in image select/unselect in listiview. in my case,

ByDefault->image color(Yellow)
First click->image color(Orange)
Second click->image color(Yellow)

If user click on over way then perfect,but when user first time click on first image and second time click on second image then both image color is orange(that's problem).

In my case only one image color is orange(means selected) at a time.

Answer 1

1. If you only support HoneyComb and above, it'll easy. Create a StateListDrawable and set it to list view item's background.

selector.xml

<selector xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:state_activated="true" android:drawable="@drawable/item_focus" />
    <item android:drawable="@android:color/transparent" />
</selector>

listview item's layout

<ImageView
    android:id="@+id/image"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:padding="5dp" />

and the last, set your listview choice mode to SINGLE

list.setChoiceMode(ListView.CHOICE_MODE_SINGLE);

2. If you manage to support pre HoneyComb, you will have to write your own layout implement checkable. You do this in order to work-out using checked state. Let take an example with LinearLayout(you can do the same with others).

 package com.example.listviewactivestate;

 import android.content.Context;
 import android.util.AttributeSet;
 import android.view.View;
 import android.widget.Checkable;
 import android.widget.LinearLayout;

 public class CustomLinearLayout extends LinearLayout implements Checkable {


private static final int[] CHECKED_STATE_SET = { android.R.attr.state_checked };

private boolean checked = false;

public CustomLinearLayout (Context context, AttributeSet attrs) {
    super(context, attrs);
}

public CustomLinearLayout (Context context) {
    super(context);
}

@Override
public boolean isChecked() {
    return checked;
}

@Override
public void setChecked(boolean checked) {
    this.checked = checked;

    refreshDrawableState();

    // Propagate to childs
    final int count = getChildCount();
    for (int i = 0; i < count; i++) {
        final View child = getChildAt(i);
        if (child instanceof Checkable) {
            ((Checkable) child).setChecked(checked);
        }
    }
}

@Override
protected int[] onCreateDrawableState(int extraSpace) {
    final int[] drawableState = super.onCreateDrawableState(extraSpace + 1);
    if (isChecked()) {
        mergeDrawableStates(drawableState, CHECKED_STATE_SET);
    }
    return drawableState;
}

@Override
public void toggle() {
    this.checked = !this.checked;
}
 }

Use this custom view in xml

 <?xml version="1.0" encoding="utf-8"?>
 <com.example.listviewactivestate.CustomLinearLayout 

 xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:orientation="vertical"
android:background="@drawable/selector"
>

<ImageView
    android:id="@+id/image"
    android:layout_width="100dp"
    android:layout_height="100dp"
    android:padding="5dp" />

</com.example.listviewactivestate.CustomLinearLayout >

Change state_activated to state_checked

<selector xmlns:android="http://schemas.android.com/apk/res/android">
   <item android:state_checked="true" android:drawable="@drawable/item_focus" />
   <item android:drawable="@android:color/transparent" />
</selector>

Also set listview choice mode to SINGLE. If it does not work, add onItemClickEvent like this

list.setOnItemClickListener(new OnItemClickListener() {

            @Override
            public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
                // TODO Auto-generated method stub
                list.setItemChecked(position, true);//make sure click item is set to checked.

            }
        });