Multiple clickable views inside listview item

Question

I am trying to create an item in a ListView that has multiple options; view and edit. I would like to create it in exactly the same way as android's contact system - see below:

enter image description here

I have added the red boxes to illustrate the behaviour I want. If you press within the left red-box, you call the contact. If you press within the right red-box, you send a text message to the contact. I have already created a similar layout in XML, but I am having trouble implementing this functionality in code.

I have tried to create custom android:onClick function calls for the separate layouts within the item, but calling an onClick method only allows you to pass in the View as a parameter, but not the position. Needing the position to use listview.getItemAtPosition function, I tried to use listview.getPositionForView to return the position but found this was extremely unstable and was very easy to return incorrect positioning due to recycling of views.

I then tried to set the item's position as the 'tag' in the getView method of my adapter, like so: convertView.setTag(position). But on the onClick method of my activity, I try and use getTag and cast it back to an integer, and it always returns null, which I find puzzling.

What is the best way of implementing a list populated by items with multiple buttons/layouts on each item?

Have a look here: http://stackoverflow.com/questions/1709166/android-listview-elements-with-multiple-clickable-buttons http://stackoverflow.com/questions/7763983/how-to-do-button-click-and-list-view-item-click-in-customize-list-view-in-androi — gskbyte, Sep 25 '13 at 13:34
this link is obligatory http://cyrilmottier.com/2011/11/23/listview-tips-tricks-4-add-several-clickable-areas/ — gipi, Sep 25 '13 at 13:48

score 1 · Answer 1 · answered Sep 25 '13 at 13:42

You can create an onClick event on each views in your row like this :

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="horizontal" >

    <TextView
        android:id="@+id/text_id"
        android:layout_width="0sp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center_vertical"
        android:onClick="textOnClickEvent"/>


    <ImageButton
        android:id="@+id/button_id"
        android:layout_width="@dimen/width_button"
        android:layout_height="match_parent"
        android:onClick="imageOnClickEvent"
        android:src="@android:drawable/ic_menu_delete" />
</LinearLayout>

Or even, add onClick listeners on each views in the getView method...

more info on this here.

score 0 · Answer 2 · answered Sep 25 '13 at 13:36

0

In the list view when you define getview method, this is where you provide all the details of the single list item. There you can mention onlick event of each of the views.

answered Sep 25 '13 at 13:36

Amrut

543
4
8

But onClickListener does not take an `int position` parameter. How can I know the position of the row which has been pressed? – Mike Baxter Sep 25 '13 at 15:27
Define listview in your layout and assign arrayadapter to the list view. You will get position in arrayadapter. getView of arrayadapter comes with position number – Amrut Sep 25 '13 at 17:41

score 0 · Answer 3 · edited Oct 11 '16 at 11:55

in adapter class, add View.OnClickListener to the getView method:

@Override
public View getView(int i, View view, ViewGroup viewGroup) {

    if(view == null) {
        final LayoutInflater layoutInflater = LayoutInflater.from(mContext);
        view = layoutInflater.inflate(R.layout.grid_vendor_item, null);
    }

    final TextView textName = (TextView) view.findViewById(R.id.text_id);
    final ImageButton imageProfil = (TextView) view.findViewById(R.id.button_id);

    textName.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            // add your edit codes
        }
    });

    imageProfil.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View view) {
            // add your open prodil codes
        }
    });    
    return view;
}

Multiple clickable views inside listview item

3 Answers3