Highlight the Listview row when any of the UI element Of row is Touched

Question

I am Inflating the List view by using the Base adapter Inside the Listview their are two widgets Textview and Edittext.

Listview Inflated properly and It is showing also. Our Requirement is when User Clicked on any of the row that row has to be color or highlighted. when user clicked on other row that row highlighted. and previous row color become normal.

score 1 · Accepted Answer · answered Dec 12 '11 at 06:05

1

The best way to do this is requesting focus on view, that was touched, to do this override method getView in adapter:

        @Override
        public View getView(final int position, View convertView, ViewGroup parent) {
            <prepare or create view here>
            convertView.setOnClickListener(new OnClickListener() {
                @Override
                public void onClick(View v) {
                    convertView.requestFocus();
                }
            });
            return convertView;
        }

For providing different colors for different states you can use selector background resource.

answered Dec 12 '11 at 06:05

Jin35

8,602
3
32
52

Thanks Jim It's Working for me. I have four views Inside the Listview 3 are Textview and 1 is Edittext. Listener is set on the Textview and color is changing But when I click on the Edittext color is not changing. Listener on the Edit text is not setting. – mayur rahatekar Dec 12 '11 at 08:47
1

This happens because `EditText` catches touch events and do it's own actions (like show keyboard or so). If you want forbid to enter text in EditText just do `setClickable(false)`. If you want leave possibility of text input seit `EditText.setOnFocusChanged()` - and mark hole list item as selected there. – Jin35 Dec 12 '11 at 10:10
Thanks Jim, Can you please explain what I have to do to set On click listener on the edit text of the List view. So that my problem is get resolved. I am not understanding I have 3 Text view when I click any one of them listener is setting but when I click on the Edit Text nothing going to happen – mayur rahatekar Dec 12 '11 at 12:34

score 1 · Answer 2 · answered Dec 12 '11 at 06:49

Well, its simple. Here is how I do it.

Firstly you need two images for showing the highligted and normal state of the ListView Item. Then you need to use custom row for your ListView. Lets say it has a TextView in it.

Keep an integer variable in your Activity. this integer will keep the selected index of the ListView. Initially assign it -1 value.

Now, as you are using custom Adapter, you can check in you getView() that whether the int variable == postition. When it is same, set the background of the TextView as Highlighted, otherwise, normal. And override the OnListItemClick(). In this, save the position in that int variable and call notifyDataSetChanged(). Below is the sample code for this:

public class MySampleActivity extends ListActivity 
{
    ArrayList<String> lst_string = new ArrayList<String>();
    int selected_item = -1;
    MyListAdapter adptr;

    /** Called when the activity is first created. */
    @Override
    public void onCreate(Bundle savedInstanceState) 
    {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.main);

        lst_string.add("item 1");
        lst_string.add("item 2");
        lst_string.add("item 3");
        lst_string.add("item 4");
        lst_string.add("item 5");
        lst_string.add("item 6");
        lst_string.add("item 7");
        lst_string.add("item 8");
        lst_string.add("item 9");

        adptr = new MyListAdapter();
        setListAdapter(adptr);
    }

    @Override
    protected void onListItemClick(ListView l, View v, int position, long id)
    {
        selected_item = position;
        adptr.notifyDataSetChanged();
    }

    private class MyListAdapter extends BaseAdapter
    {
        @Override
        public int getCount()
        {
            return lst_string.size();
        }

        @Override
        public Object getItem(int position)
        {
            return position;
        }

        @Override
        public long getItemId(int position)
        {
            return position;
        }

        private LayoutInflater mInflater;

        public MyListAdapter() 
        {
            mInflater = (LayoutInflater)getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        }

        @Override
        public View getView(int position, View convertView, ViewGroup parent) {
            ViewHolder holder = null;
            if (convertView == null) 
            {
                convertView = mInflater.inflate(R.layout.list_row, null);
                holder = new ViewHolder();
                holder.textView = (TextView)convertView.findViewById(R.id.tv_row);
                convertView.setTag(holder);
            } 
            else 
            {
                holder = (ViewHolder)convertView.getTag();
            }
            holder.textView.setText(lst_string.get(position));
            if(selected_item == position)
            {
                holder.textView.setBackgroundDrawable(getResources().getDrawable(R.drawable.list_selected));
            }
            else
            {
                holder.textView.setBackgroundDrawable(getResources().getDrawable(R.drawable.list_normal));
            }
            return convertView;
        }
    }

    public static class ViewHolder 
    {
        public TextView textView;
    }
}

Thanks Khawar, For such a wonderfull explanation. I am extending the Activity that's why is their any alternative for the @Override protected void onListItemClick method and where your setting the On click listener for the list view. — mayur rahatekar, Dec 12 '11 at 09:10

Highlight the Listview row when any of the UI element Of row is Touched

2 Answers2