How to change background color when click on Horizontal Listview items in Android

Question

How to change background color when clicking on Horizontal Listview items in Android
So that users will know where they clicked.
Below is the code which I got from some internet site.

HorizontalListViewActivity.java

public class HorizontalListViewActivity extends Activity {
static BitmapFactory bf;
 ArrayList<String> dataObjectsList = new ArrayList<String>();
 ArrayList<Bitmap> myImageList = new ArrayList<Bitmap>();
@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.main);

    HorizontalListView listview = (HorizontalListView) findViewById(R.id.listview);
    listview.setAdapter(mAdapter);
    dataObjectsList.add("Text #1");
    dataObjectsList.add("Text #2");
    dataObjectsList.add("Text #3");
    dataObjectsList.add("Text #4");
    myImageList.add(BitmapFactory.decodeFile(Environment.getExternalStorageDirectory().getPath()+"/Restaurent/app1.jpg"));
    myImageList.add(BitmapFactory.decodeFile(Environment.getExternalStorageDirectory().getPath()+"/Restaurent/app2.jpg"));
    myImageList.add(BitmapFactory.decodeFile(Environment.getExternalStorageDirectory().getPath()+"/Restaurent/app3.jpg"));
    myImageList.add(BitmapFactory.decodeFile(Environment.getExternalStorageDirectory().getPath()+"/Restaurent/app4.jpg"));
    listview.setOnItemSelectedListener(new OnItemSelectedListener() {

        @Override
        public void onItemSelected(AdapterView<?> arg0, View arg1,
                int arg2, long arg3) {
            // TODO Auto-generated method stub
            /*Toast.makeText(getApplicationContext(), "dataObjects[position]=="+dataObjectsList.get(arg2).toString(), 100).show();
            Intent intent2 = new Intent(getApplicationContext(),Test.class);
            intent2.putExtra("category", dataObjectsList.get(arg2).toString());
            startActivity(intent2);*/
        }

        @Override
        public void onNothingSelected(AdapterView<?> arg0) {
            // TODO Auto-generated method stub

        }
    });

}

private static String[] dataObjects = new String[]{ "Delhi",
    "Bangalore",
    "Chennai",
    "Pune" }; 
private static Bitmap[] myImage = new Bitmap[]{ BitmapFactory.decodeFile(Environment.getExternalStorageDirectory().getPath()+"/Restaurent/app1.jpg"),
    BitmapFactory.decodeFile(Environment.getExternalStorageDirectory().getPath()+"/City/app2.jpg"),
    BitmapFactory.decodeFile(Environment.getExternalStorageDirectory().getPath()+"/City/app3.jpg"),
    BitmapFactory.decodeFile(Environment.getExternalStorageDirectory().getPath()+"/City/app4.jpg") }; 


private BaseAdapter mAdapter = new BaseAdapter() {

    @Override
    public int getCount() {
        return dataObjects.length;
    }

    @Override
    public Object getItem(int position) {
        Toast.makeText(getApplicationContext(), "getItem 111111 position=="+position, 100).show();
        return null;
    }

    @Override
    public long getItemId(int position) {
        Toast.makeText(getApplicationContext(), "getItemId position=="+position, 100).show();
        return 0;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {
        View retval = LayoutInflater.from(parent.getContext()).inflate(R.layout.viewitem, null);
        TextView title = (TextView) retval.findViewById(R.id.title);
        ImageView img=(ImageView) retval.findViewById(R.id.image);

        img.setImageBitmap(myImageList.get(position));
        title.setText(dataObjectsList.get(position).toString());
        return retval;
    }

};

}

HorizontalListView.java

public class HorizontalListView extends AdapterView<ListAdapter> {

public boolean mAlwaysOverrideTouch = true;
protected ListAdapter mAdapter;
private int mLeftViewIndex = -1;
private int mRightViewIndex = 0;
protected int mCurrentX;
protected int mNextX;
private int mMaxX = Integer.MAX_VALUE;
private int mDisplayOffset = 0;
protected Scroller mScroller;
private GestureDetector mGesture;
private Queue<View> mRemovedViewQueue = new LinkedList<View>();
private OnItemSelectedListener mOnItemSelected;
private OnItemClickListener mOnItemClicked;
private OnItemLongClickListener mOnItemLongClicked;
private boolean mDataChanged = false;


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

private synchronized void initView() {
    mLeftViewIndex = -1;
    mRightViewIndex = 0;
    mDisplayOffset = 0;
    mCurrentX = 0;
    mNextX = 0;
    mMaxX = Integer.MAX_VALUE;
    mScroller = new Scroller(getContext());
    mGesture = new GestureDetector(getContext(), mOnGesture);
}

@Override
public void setOnItemSelectedListener(AdapterView.OnItemSelectedListener listener) {
    mOnItemSelected = listener;
}

@Override
public void setOnItemClickListener(AdapterView.OnItemClickListener listener){
    mOnItemClicked = listener;
}

@Override
public void setOnItemLongClickListener(AdapterView.OnItemLongClickListener listener) {
    mOnItemLongClicked = listener;
}

private DataSetObserver mDataObserver = new DataSetObserver() {

    @Override
    public void onChanged() {
        synchronized(HorizontalListView.this){
            mDataChanged = true;
        }
        setEmptyView(getEmptyView());
        invalidate();
        requestLayout();
    }

    @Override
    public void onInvalidated() {
        reset();
        invalidate();
        requestLayout();
    }

};

@Override
public ListAdapter getAdapter() {
    return mAdapter;
}

@Override
public View getSelectedView() {
    //TODO: implement
    return null;
}

@Override
public void setAdapter(ListAdapter adapter) {
    if(mAdapter != null) {
        mAdapter.unregisterDataSetObserver(mDataObserver);
    }
    mAdapter = adapter;
    mAdapter.registerDataSetObserver(mDataObserver);
    reset();
}

private synchronized void reset(){
    initView();
    removeAllViewsInLayout();
    requestLayout();
}

@Override
public void setSelection(int position) {
    //TODO: implement
}

private void addAndMeasureChild(final View child, int viewPos) {
    LayoutParams params = child.getLayoutParams();
    if(params == null) {
        params = new LayoutParams(LayoutParams.FILL_PARENT, LayoutParams.FILL_PARENT);
    }

    addViewInLayout(child, viewPos, params, true);
    child.measure(MeasureSpec.makeMeasureSpec(getWidth(), MeasureSpec.AT_MOST),
            MeasureSpec.makeMeasureSpec(getHeight(), MeasureSpec.AT_MOST));
}

@Override
protected synchronized void onLayout(boolean changed, int left, int top, int right, int bottom) {
    super.onLayout(changed, left, top, right, bottom);

    if(mAdapter == null){
        return;
    }

    if(mDataChanged){
        int oldCurrentX = mCurrentX;
        initView();
        removeAllViewsInLayout();
        mNextX = oldCurrentX;
        mDataChanged = false;
    }

    if(mScroller.computeScrollOffset()){
        int scrollx = mScroller.getCurrX();
        mNextX = scrollx;
    }

    if(mNextX <= 0){
        mNextX = 0;
        mScroller.forceFinished(true);
    }
    if(mNextX >= mMaxX) {
        mNextX = mMaxX;
        mScroller.forceFinished(true);
    }

    int dx = mCurrentX - mNextX;

    removeNonVisibleItems(dx);
    fillList(dx);
    positionItems(dx);

    mCurrentX = mNextX;

    if(!mScroller.isFinished()){
        post(new Runnable(){
            @Override
            public void run() {
                requestLayout();
            }
        });

    }
}

private void fillList(final int dx) {
    int edge = 0;
    View child = getChildAt(getChildCount()-1);
    if(child != null) {
        edge = child.getRight();
    }
    fillListRight(edge, dx);

    edge = 0;
    child = getChildAt(0);
    if(child != null) {
        edge = child.getLeft();
    }
    fillListLeft(edge, dx);


}

private void fillListRight(int rightEdge, final int dx) {
    while(rightEdge + dx < getWidth() && mRightViewIndex < mAdapter.getCount()) {

        View child = mAdapter.getView(mRightViewIndex, mRemovedViewQueue.poll(), this);
        addAndMeasureChild(child, -1);
        rightEdge += child.getMeasuredWidth();

        if(mRightViewIndex == mAdapter.getCount()-1) {
            mMaxX = mCurrentX + rightEdge - getWidth();
        }

        if (mMaxX < 0) {
            mMaxX = 0;
        }
        mRightViewIndex++;
    }

}

private void fillListLeft(int leftEdge, final int dx) {
    while(leftEdge + dx > 0 && mLeftViewIndex >= 0) {
        View child = mAdapter.getView(mLeftViewIndex, mRemovedViewQueue.poll(), this);
        addAndMeasureChild(child, 0);
        leftEdge -= child.getMeasuredWidth();
        mLeftViewIndex--;
        mDisplayOffset -= child.getMeasuredWidth();
    }
}

private void removeNonVisibleItems(final int dx) {
    View child = getChildAt(0);
    while(child != null && child.getRight() + dx <= 0) {
        mDisplayOffset += child.getMeasuredWidth();
        mRemovedViewQueue.offer(child);
        removeViewInLayout(child);
        mLeftViewIndex++;
        child = getChildAt(0);

    }

    child = getChildAt(getChildCount()-1);
    while(child != null && child.getLeft() + dx >= getWidth()) {
        mRemovedViewQueue.offer(child);
        removeViewInLayout(child);
        mRightViewIndex--;
        child = getChildAt(getChildCount()-1);
    }
}

private void positionItems(final int dx) {
    if(getChildCount() > 0){
        mDisplayOffset += dx;
        int left = mDisplayOffset;
        for(int i=0;i<getChildCount();i++){
            View child = getChildAt(i);
            int childWidth = child.getMeasuredWidth();
            child.layout(left, 0, left + childWidth, child.getMeasuredHeight());
            left += childWidth;
        }
    }
}

public synchronized void scrollTo(int x) {
    mScroller.startScroll(mNextX, 0, x - mNextX, 0);
    requestLayout();
}

@Override
public boolean dispatchTouchEvent(MotionEvent ev) {
    boolean handled = mGesture.onTouchEvent(ev);
    return handled;
}

protected boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
            float velocityY) {
    synchronized(HorizontalListView.this){
        mScroller.fling(mNextX, 0, (int)-velocityX, 0, 0, mMaxX, 0, 0);
    }
    requestLayout();

    return true;
}

protected boolean onDown(MotionEvent e) {
    mScroller.forceFinished(true);
    return true;
}

private OnGestureListener mOnGesture = new GestureDetector.SimpleOnGestureListener() {

    @Override
    public boolean onDown(MotionEvent e) {
        return HorizontalListView.this.onDown(e);
    }

    @Override
    public boolean onFling(MotionEvent e1, MotionEvent e2, float velocityX,
            float velocityY) {
        return HorizontalListView.this.onFling(e1, e2, velocityX, velocityY);
    }

    @Override
    public boolean onScroll(MotionEvent e1, MotionEvent e2,
            float distanceX, float distanceY) {

        getParent().requestDisallowInterceptTouchEvent(true);

        synchronized(HorizontalListView.this){
            mNextX += (int)distanceX;
        }
        requestLayout();

        return true;
    }

    @Override
    public boolean onSingleTapConfirmed(MotionEvent e) {
        Rect viewRect = new Rect();
        for(int i=0;i<getChildCount();i++){
            View child = getChildAt(i);
            int left = child.getLeft();
            int right = child.getRight();
            int top = child.getTop();
            int bottom = child.getBottom();
            viewRect.set(left, top, right, bottom);
            if(viewRect.contains((int)e.getX(), (int)e.getY())){
                if(mOnItemClicked != null){
                    mOnItemClicked.onItemClick(HorizontalListView.this, child, mLeftViewIndex + 1 + i, mAdapter.getItemId( mLeftViewIndex + 1 + i ));
                }
                if(mOnItemSelected != null){
                    mOnItemSelected.onItemSelected(HorizontalListView.this, child, mLeftViewIndex + 1 + i, mAdapter.getItemId( mLeftViewIndex + 1 + i ));
                }
                break;
            }

        }
        return true;
    }

    @Override
    public void onLongPress(MotionEvent e) {
        Rect viewRect = new Rect();
        int childCount = getChildCount();
        for (int i = 0; i < childCount; i++) {
            View child = getChildAt(i);
            int left = child.getLeft();
            int right = child.getRight();
            int top = child.getTop();
            int bottom = child.getBottom();
            viewRect.set(left, top, right, bottom);
            if (viewRect.contains((int) e.getX(), (int) e.getY())) {
                if (mOnItemLongClicked != null) {
                    mOnItemLongClicked.onItemLongClick(HorizontalListView.this, child, mLeftViewIndex + 1 + i, mAdapter.getItemId(mLeftViewIndex + 1 + i));
                }
                break;
            }

        }
    }

};

}

viewitem.xml

    <?xml version="1.0" encoding="utf-8"?>
    <LinearLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="vertical"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:background="#fff">

   <ImageView
      android:id="@+id/image"
      android:layout_width="145dp"
      android:layout_height="145dp"
      android:layout_marginTop="5dp"
      android:scaleType="centerCrop"
      android:src="@drawable/ic_launcher"
      />

      <TextView
      android:id="@+id/title"
      android:layout_width="fill_parent"
      android:layout_height="wrap_content"
      android:textColor="#000"
      android:text="text"
      android:gravity="center_horizontal"
      />

    </LinearLayout>

main.xml

   <?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:background="#fff"
    android:orientation="vertical" >

    <com.horilistview.HorizontalListView
        android:id="@+id/listview"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:background="#ddd" />

    </LinearLayout>

Housekeeping

Did you try to set a Selector as background on your viewitem.xml? This post may help you: #5372219 – Bolt

Thanks Yes I tried but it's not working. – Housekeeping

possible duplicate of Horizontal ListView in Android? – Medrek

Answer 1

For example in this implementation you can use listSelector property in xml. Check out maybe yours also supports similar property or use the one I linked above.

Andress

It's not working for me because I am using horizontal list view – Housekeeping

@MDFAIZANWAR please, look at the link above. That HorizontalListView implementation supports listSelector property. – Andress

Answer 2

public View selectedRow;//declare this in class

Add this code in onitemSelectListner

if (selectedRow != null) {
    selectedRow.setBackgroundResource(color.transparent);                   
}
selectedRow = view; //view is the onitemSelectListner View
view.setBackgroundResource(R.drawable.list_background); 

this will work 3.0 and above version..

Prole

Answer 3

add this onclick listener in getview method..

list.setOnItemSelectedListener(new AdapterView.OnItemSelectedListener() {
            @Override
            public void onItemSelected(AdapterView<?> adapterView, View view, int i, long l) {
                for(int j=0;j<20;j++)
                {
                    test[j]=0;
                }


                for (int k = 0; k < mAdapter.getCount(); k++) {
                    View item = list.getChildAt(k);
                    if (item != null) {
                        test[k]=0;
                        item.setBackgroundColor(Color.WHITE);
                    }
                    view.setBackgroundColor(Color.BLUE);
                    test[i]=1;

                }
            }

test is a dummy array, use it out of onclicklistner to keep the selected even when view is changed.. like this..

   if (test[position]==1) {             
            relativeLayout.setBackgroundColor(Color.BLUE);
        }
        if(test[position]==0)
            relativeLayout.setBackgroundColor(Color.WHITE);

Arabelle