Android ListView select items to delete with 3 column layout

Question

I'd like to implement a Listview in android in which I have the possibility to enable a delete mode, in which the user can select the entries to delete. It should be similar to the message application in android.

I already have a ListActivity which has an icon on the left and text on the right side. I now like to add a CheckBox floating on the right side of the list entry. The ListActivity is listed in another question by a friend of mine: android listactivity background color .

The layout should be:

Left Picture
Center List item
Right Checkbox for delete selection

How can I achieve this? Is there a standard ListView item in the framework I could use?

I don't understand WHERE do you have the problem. You don't know how to set up the delete mechanism or the problem is in your row layout construction? — user, May 03 '12 at 12:22
The problem is, that i can't set up the layout (xml) right. I'd like the middle part (message title and date) to be of dynamic width. On the left side is the icon with 48 dip and on the right side the checkbox which is also of a fixed with. Everytime im adding the checkbox to the xml it's not show. — KeepAlive, May 03 '12 at 12:27

score 1 · Accepted Answer · answered May 03 '12 at 12:44

I guess you want a CheckBox to appear(only) when is time to delete items from the ListView. Assuming you use the layout from the other question:

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:orientation="horizontal"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:padding="5dp"
    android:background="@color/darkbluelogo" >

    <ImageView android:id="@+id/list_image"
        android:layout_width="48dip"
        android:layout_height="48dip"
        android:contentDescription="@id/list_image"
         />
    <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
        android:orientation="vertical"
        android:layout_width="0dp"
        android:layout_weight="1"
        android:layout_height="fill_parent"
        android:padding="5dp" 
        android:background="@color/darkbluelogo"
        android:scrollingCache="false" 
        android:cacheColorHint="#00000000" >

        <TextView
            android:id="@+id/title"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="@+id/title" >
        </TextView>

        <TextView
            android:id="@+id/datetime"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:text="@+id/datetime" >
        </TextView>

    </LinearLayout>
       <CheckBox
          android:layout_width="wrap_content"
          android:layout_height="wrap_content"
          android:visibility="gone" />
</LinearLayout>

When the ListView starts the CheckBox will not be present and the content TextViews will occupy all the space. Add a flag in the getView method of your adapter that will signal that the CheckBox must be shown(here you will set the CheckBox's visibility from the layout to visible). When its time to delete items modify the flag and then call notifyDataSetChanged() so the ListView redraws its children, this time with the CheckBox present.

Note: You'll have to store the status of the CheckBoxes yourself.

thank you very much, that seems to do the job. This is exactly what i wanted. — KeepAlive, May 03 '12 at 12:51
@KeepAlive When implementing the code in the `getView` method, keep in mind that the `ListView` will recycle views as you scroll up and down. — user, May 03 '12 at 13:00

score 0 · Answer 2 · answered May 03 '12 at 12:23

First of all you need a custom layout for your list entries. A simple RelativeLayout including an ImageView , a TextView and a CheckBox should be enough.

Then you might want to build your own custom adapter which can extend BaseAdapter (or SimpleAdapter or CursorAdapter or ArrayAdapter or...). The adapter will bind the list's data to your custom layout. If for example your data is contained in a Cursor it will look like:

private class MyCustomAdapter extends CursorAdapter {

        public MyCustomAdapter(Context context) {
            super(context, null);
        }


        @Override
        public View newView(Context context, Cursor cursor, ViewGroup parent) {

            //Return a list item view
            return getLayoutInflater().inflate(R.layout.my_custom_list_item_layout, parent, false);

        }

        @Override
        public void bindView(View view, Context context, Cursor cursor) {

            //Get views from layout
            final ImageView imageView = (ImageView) view.findViewById(R.id.list_item_image);
            final TextView textView = (TextView) view.findViewById(R.id.list_item_text);
            final CheckBox checkBox = (CheckBox) view.findViewById(R.id.list_item_checkbox);


            //Get data from cursor
            final String text = cursor.getString(...); 

            //Add listener to the checkbox
            checkBox.setOnClickListener(new OnClickListener() {...});

            //Bind data
            textView.setText(text);
        }
    }

Android ListView select items to delete with 3 column layout

2 Answers2