Accessing imageview inside adapter on OnItemClickListener

Question

My navigation drawer consists of many items. Each item has background image(with id optionbackground) which is invisible. I want to make the image visible only when user clicked on the item. How can i do it? ImageView whose visiblity I want to change is named optionBackground in Adapter. And my setOnItemClickListener is in activity in which i am setting the custom adapter for navigation drawer.

Activity

mDrawerList.setAdapter(new CustomAdapter(this, mdrawerTitles));
mDrawerList.setOnItemClickListener(new AdapterView.OnItemClickListener() {
  @Override
  public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
    if(position==0)
    {
      ...
    }
    else if(position==1)
    {
      ...
    }
  }
});

Adapter

public class CustomAdapter extends ArrayAdapter
{
    private final Context context;
private String[] optionList;
    public CustomAdapter(Context context,String[] data)
    {
       super(context, R.layout.drawer_list_item);
       this.context = context;
        optionList=data;
    }
    @Override
    public int getCount() {
        return optionList.length;
    }
    @Override
    public View getView(int position, View convertView, ViewGroup parent)
    {
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE);

        View v = inflater.inflate(R.layout.drawer_list_item, parent, false);
        ImageView icon=(ImageView)v.findViewById(R.id.optionlogo);
        TextView optiontext=(TextView)v.findViewById(R.id.optiontext);
        TextView optionsubtext=(TextView)v.findViewById(R.id.optionsubtext);
        ImageView optionBackground=(ImageView)v.findViewById(R.id.optionbackground);

        Log.e("bhuvnesh", optionList[position]);
        if(optionList[position].equals("ABOUT")) {


            optiontext.setText("AB");
            icon.setImageResource(R.drawable.g_icon);
            optionsubtext.setText("The what");
        }
        else if(optionList[position].equals("SHAR")) {
            optiontext.setText("SHA");
            icon.setImageResource(R.drawable.s_icon);
            optionsubtext.setText("Tell your ");
        }
        else if(optionList[position].equals("CONNEC")) {
            optiontext.setText("CONN");
            icon.setImageResource(R.drawable.fb_icon);
            optionsubtext.setVisibility(View.GONE);
        }
        else if(optionList[position].equals("LOG")) {
            optiontext.setText("LOGOUT");
            icon.setImageResource(R.drawable.l_icon);
            optionsubtext.setVisibility(View.GONE);
        }


        return v;
    }
}

Answer 1

There are multiple solutions to solve this issue.

You can either get the views you want to hide / show via the view you get in the onClickListener

public void onItemClick(AdapterView<?> parent, View view, int position, long id) {
   view.findViewById(R.id.optionbackground).setVisibility(View.VISIBLE);
   ...
}

or you define the onClickListener inside your adapter and keep those views final. So you can set the visibility inside the onClick event.

View v = inflater.inflate(R.layout.drawer_list_item, parent, false);
...
final ImageView optionBackground=(ImageView)v.findViewById(R.id.optionbackground);

v.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View v) {
        optionBackground.setVisibility(View.VISIBLE);
    }
});

...

---

If you plan to update to the RecyclerView. This view does not come with an onItemClickListener anymore, and you will need to add the Listener to the view inside the Adapter.

You can still pass it out to the containing activity or fragment, as i've done it in one of my Open Source projects:

https://github.com/mikepenz/wallsplash-android/blob/master/app/src/main/java/com/mikepenz/unsplash/views/adapters/ImageAdapter.java#L178

---

For the additional info on showing it and hiding it onTouch

.setOnTouchListener(new View.OnTouchListener() {
    @Override
    public boolean onTouch(View v, MotionEvent event) {
        switch (event.getAction()) {
            case MotionEvent.ACTION_DOWN:
                //press
                break;
            case MotionEvent.ACTION_UP:
            case MotionEvent.ACTION_CANCEL:
                //unpress
                break;
        }

        // Pass all events through to the host view.
        return false;
    }
}

Answer 2

In the onItemClick method you have the view parameter. This parameter is the View that contain all the elements you have inflated in the getView method in your CustomAdapter.

So in order to do what you want to achieve you simply have to retrieve the ImageView with its ID and set its visibility.

mDrawerList.setOnItemClickListener(new AdapterView.OnItemClickListener()
{
    @Override
    public void onItemClick(AdapterView<?> parent, View view, int position, long id) 
    {
        view.getViewById(R.id.optionBackground).setVisibility(View.VISIBLE);
    }
});

That's it.

Answer 3

dumazy's approach is good one but there is another solution to that as well. You can create onclick method in adapter's getView method. Here is an example

  final ImageView optionBackground=   (ImageView)v.findViewById(R.id.optionbackground);

      v.setOnClickListener(new OnClickListener() {

        @Override
        public void onClick(View v) {
            // TODO Auto-generated method stub
            optionBackground.setVisibility(View.VISIBLE);
        }
    });