Morteza Soleimani Morteza Soleimani - 5 months ago 32
Android Question

Click Event for an element inside list view items to toggle contents of ListItem

I have an activity inside my android app that lists some information inside ListView , in the top left corner of each Item there is a more information icon, when user touches this icon application should change the content of this list item to some useful information , and also the icon should change to another icon , for example a close icon , again when user touchs close icon application should show list item contents.

For changing the Icon i used this code, but first time that i click icon nothing happens , second time it changes, and sometimes when i click one of the icons the icon of another list item changes.

ListActivity.java

list.setOnItemClickListener(new OnItemClickListener() {
@Override
public void onItemClick(AdapterView<?> parent, View viewCliced, int position, long id)
{
img = (ImageView)viewCliced.findViewById(R.id.img_icon);
img.setOnClickListener(new OnClickListener()
{
@Override
public void onClick(View arg0)
{
img.setImageResource(R.drawable.setting);
}
});
}
});


this code changes the icon but user should touch icon twice and sometimes change another list item's icon :|

this is the XML of ListView Item

listitem.xml

<?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="vertical" >

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_marginLeft="10dp"
android:layout_marginRight="10dp"
android:layout_marginTop="10dp"
android:background="@drawable/item_select"
android:orientation="vertical" >

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:orientation="horizontal"
android:weightSum="8" >

<LinearLayout
android:layout_width="0dp"
android:layout_height="fill_parent"
android:layout_weight="1"
android:gravity="top|left"
android:orientation="vertical" >

<ImageView
android:id="@+id/img_icon"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="5dp"
android:src="@drawable/bookabout" />
</LinearLayout>

<LinearLayout
android:layout_width="0dp"
android:layout_height="wrap_content"
android:layout_weight="7"
android:gravity="right|center_vertical"
android:orientation="vertical" >

<TextView
android:id="@+id/txt_subject"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:text="نام فصل"
android:textColor="#000000" />
</LinearLayout>
</LinearLayout>

<LinearLayout
android:layout_width="fill_parent"
android:layout_height="wrap_content"
android:layout_weight="1"
android:gravity="right|center_vertical"
android:orientation="vertical" >

<TextView
android:id="@+id/txt_explanation"
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_margin="15dp"
android:text="توضیحات فصل درسی"
android:textColor="#000000" />
</LinearLayout>
</LinearLayout>

</LinearLayout>


How i should develop this feature ?
toggling between two kind of contents for a ListView item when user touches an Icon inside the ListView Item

I read a lot of article about list views but i couldn't find a way to do that,

Thank you very much for answering

Best Regards

Answer

"For changing the Icon i used this code, but first time that i click icon nothing happens , second time it changes, and sometimes when i click one of the icons the icon of another list item changes."

because you declare the listener inside the list listener so for the first time you click the icon your listener set (because you click list item ) and for the second time the icon responses. pull out listener of img and put it in onCreate method. Inside your adapter modify the getView method like this:

@Override
public View getView(int position, View row, ViewGroup parent) {
    final int listItemPosition = position;
    ImageView img = (ImageView)row.findViewById(R.id.image1);

    img.setOnClickListener(new View.OnClickListener() {
        @Override
        public void onClick(View arg0) {
            // Change icon here

            // If you'd like to delete item use the code below
            // List.remove(listItemPosition);
            // Adapter.this.notifyDataSetChanged();
        }
    });
}
Comments