How to Handle Click on Imageview in Custom Listview with image and Textview?

Question

I Want to know how do we handle click on Imageview on a Custom Listview with Image and Textview. I Even made Imageview Clickable.

Here is my code for

CustomAdapter.java

public class CustomAdapter extends ArrayAdapter<RowItem>  {

    Context mcontext;
    ArrayList<RowItem> rowItem = new ArrayList<RowItem>();
    private RowItem row;
    RowItem data;


    public CustomAdapter(Context context, int resourceId,
                                 ArrayList<RowItem> items) {
        super(context, resourceId, items);
        this.mcontext = context;
        this.rowItem =items;
    }

    @Override
    public int getCount()
    {
        return rowItem.size();
    }


    @Override
    public long getItemId(int position) {
        return rowItem.indexOf(getItem(position));
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent)
    {
       final RowItem row_pos;

        if (convertView == null)
        {
            LayoutInflater mInflater = (LayoutInflater) mcontext
                    .getSystemService(Activity.LAYOUT_INFLATER_SERVICE);
            convertView = mInflater.inflate(R.layout.list_item,parent,false);
        }

        RoundImageView imgIcon = (RoundImageView) convertView.findViewById(R.id.profile_pic);

        TextView txtTitle = (TextView) convertView.findViewById(R.id.member_name);
        TextView txtSubTitle = (TextView) convertView.findViewById(R.id.status);
        TextView txtRightTitle = (TextView) convertView.findViewById(R.id.contact_type);

        row_pos = getItem(position);


        if (row_pos.getIcon() != null)
        {
            imgIcon.setImageURI(Uri.parse(row_pos.getIcon()));
        }
        else
        {
            imgIcon.setImageResource(R.mipmap.ic_launcher);
        }


        imgIcon.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v)
            {
                // Create custom dialog object
                final Dialog dialog = new Dialog(getContext());

                // Include dialog.xml file
                dialog.setContentView(R.layout.dialog);

                ImageView img = (ImageView)dialog.findViewById(R.id.img);

                if (row_pos.getIcon() != null)
                {
                    img.setImageURI(Uri.parse(row_pos.getIcon()));
                }
                else
                {
                    img.setImageResource(R.mipmap.ic_launcher);
                }
            }
        });


        if(row_pos.getTitle() == " ")
        txtTitle.setText(row_pos.getPhone_number());
        else
        txtTitle.setText(row_pos.getTitle());

        txtSubTitle.setText(row_pos.getSub_title());
        txtRightTitle.setText(row_pos.getRight_title());

        return convertView;
    }

}

Here is my xml Layout

list_item.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:paddingLeft="8dp"
    android:paddingRight="8dp"
    android:descendantFocusability="blocksDescendants">

    <com.example.rama.hello.RoundedImageView.RoundImageView
        android:id="@+id/profile_pic"
        android:layout_width="50dp"
        android:layout_height="50dp"
        android:layout_marginTop="10dp"
        android:contentDescription="desc"
        android:paddingLeft="10dp"
        android:paddingRight="10dp"
        android:clickable="true"
        />

    <TextView
        android:id="@+id/member_name"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_marginTop="10dp"
        android:layout_toRightOf="@+id/profile_pic"
        android:paddingBottom="10dp"
        android:text="txt"
        android:paddingLeft="20dp"
        android:textColor="#000000"
        android:textSize="20sp" />

    <TextView
        android:id="@+id/status"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/member_name"
        android:layout_below="@+id/member_name"
        android:text="txt"
        android:paddingLeft="20dp"
        android:textColor="#000000"
        android:textSize="16sp" />

    <TextView
        android:id="@+id/contact_type"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignBaseline="@+id/member_name"
        android:layout_alignBottom="@+id/member_name"
        android:layout_alignParentRight="true"
        android:text="txt"
        android:layout_marginLeft="7dp"
        android:textSize="16sp" />

</RelativeLayout>

Answer 1

It's convenient not to make any element of the custom view clickable and implement the listView.setOnItemClickListener(new ListClickHandler());

In fact, on long and scrollable lists, it happened that I clicked on one image item and the description was not correct. It belonged to the one of another image. I solved this problem removing all the possibilities to have a clickable image or button within a custom listview, and implement the on click listener on it.

See this example:

https://github.com/alessandroargentieri/AuctionExample/blob/master/app/src/main/java/argentieri/alessandro/crossoverauction/ViewActivity.java