ListView with Add and Delete Buttons in each Row in android
Asked Answered
I

3

35

I am developing an android application in which I have made one ListView. I have to add 2 buttons with each row in ListView. These 2 buttons are Add and Delete. When user selects one of the buttons then some actions should be taken. How can I do it?

Imprint answered 8/7, 2013 at 11:50 Comment(1)
Using custom listview layout, Add two buttons in the item view and write action on the corresponding click eventSteelwork
V
95

You will first need to create a custom layout xml which will represent a single item in your list. You will add your two buttons to this layout along with any other items you want to display from your list.

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

<TextView
    android:id="@+id/list_item_string"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerVertical="true"
    android:layout_alignParentLeft="true"
    android:paddingLeft="8dp"
    android:textSize="18sp"
    android:textStyle="bold" /> 

<Button
    android:id="@+id/delete_btn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentRight="true"
    android:layout_centerVertical="true"
    android:layout_marginRight="5dp"
    android:text="Delete" /> 

<Button
    android:id="@+id/add_btn"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_toLeftOf="@id/delete_btn"
    android:layout_centerVertical="true"
    android:layout_marginRight="10dp"
    android:text="Add" />

</RelativeLayout>

Next you will need to create a Custom ArrayAdapter Class which you will use to inflate your xml layout, as well as handle your buttons and on click events.

public class MyCustomAdapter extends BaseAdapter implements ListAdapter { 
private ArrayList<String> list = new ArrayList<String>(); 
private Context context; 
  
  
  
public MyCustomAdapter(ArrayList<String> list, Context context) { 
    this.list = list; 
    this.context = context; 
} 

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

@Override
public Object getItem(int pos) { 
    return list.get(pos); 
} 

@Override
public long getItemId(int pos) { 
    return list.get(pos).getId();
    //just return 0 if your list items do not have an Id variable.
} 

@Override
public View getView(final int position, View convertView, ViewGroup parent) {
    View view = convertView;
    if (view == null) {
        LayoutInflater inflater = (LayoutInflater) context.getSystemService(Context.LAYOUT_INFLATER_SERVICE); 
        view = inflater.inflate(R.layout.my_custom_list_layout, null);
    } 
    
    //Handle TextView and display string from your list
    TextView listItemText = (TextView)view.findViewById(R.id.list_item_string); 
    listItemText.setText(list.get(position)); 

    //Handle buttons and add onClickListeners
    Button deleteBtn = (Button)view.findViewById(R.id.delete_btn);
    Button addBtn = (Button)view.findViewById(R.id.add_btn);
    
    deleteBtn.setOnClickListener(new View.OnClickListener(){
        @Override
        public void onClick(View v) { 
            //do something
            list.remove(position); //or some other task
            notifyDataSetChanged();
        }
    });
    addBtn.setOnClickListener(new View.OnClickListener(){
        @Override
        public void onClick(View v) { 
            //do something
            notifyDataSetChanged();
        }
    });
      
    return view; 
} 
}

Finally, in your activity you can instantiate your custom ArrayAdapter class and set it to your listview.

public class MyActivity extends Activity { 
  
@Override
protected void onCreate(Bundle savedInstanceState) { 
    super.onCreate(savedInstanceState); 
    setContentView(R.layout.activity_my_activity); 
    
    //generate list
    ArrayList<String> list = new ArrayList<String>();
    list.add("item1");
    list.add("item2");

    //instantiate custom adapter
    MyCustomAdapter adapter = new MyCustomAdapter(list, this);
    
    //handle listview and assign adapter
    ListView lView = (ListView)findViewById(R.id.my_listview);
    lView.setAdapter(adapter);
}
Vaticide answered 11/4, 2014 at 20:25 Comment(6)
what If i want to use CursorLoader?Vendee
return list.get(pos).getId();---Cannot resolve method 'getId()'Scaffold
@TahaKörkem just replace "return list.get(pos).getId()" with "return 0". The getId() method is not useful if your list items do not have an Id property.Vaticide
Thanks this was helpful, but there is one little problem. I can't seem to use the position variable inside those anonymous classes, it says it has to be final.Blodget
Can't understand.. how i can start some action on button click, wich will not connected with my list... So i need practical the same, but with some difference. I need to start download file, on the button click, and show progress.... after finished i need to have button upgrade to active (or replace progress bar) And then i will start to load file by bluetooth to my device. So i need to sent something more than list... because type of layout depend from some value (i need array[int][string], o something like that, I think)... i'm newbie for Android and Java, so it all is rather hard for me)Satterfield
"R.layout.my_custom_list_layout" is because that RelativeLayout is saved in a layout file called "my_custom_list_layout.xml"Epicotyl
J
14

on delete button click event

public void delete(View v){                

    ListView listview1;
    ArrayList<E> datalist;

    final int position = listview1.getPositionForView((View) v.getParent());
    datalist.remove(position);
    myAdapter.notifyDataSetChanged();

}
Jointless answered 5/9, 2013 at 12:2 Comment(0)
N
10

Step-1: Create activity_main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#0099CC"
    tools:context=".MainActivity" >

    <TextView
        android:id="@+id/textView"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentTop="true"
        android:layout_centerHorizontal="true"
        android:text="Multi Touch Listview"
        android:textColor="#FFFFFF"
        android:textSize="25sp" />

    <ListView
        android:id="@+id/listView"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:layout_below="@+id/textView"
        android:layout_marginTop="5dp"
        android:cacheColorHint="#00000000" />

</RelativeLayout>

Step-2 Create row.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:padding="5dp"
    tools:context=".MainActivity" >

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:text="User Name"
        android:textAppearance="?android:attr/textAppearanceLarge" />

    <TextView
        android:id="@+id/textView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/textView1"
        android:layout_marginTop="5dp"
        android:text="Address"
        android:textAppearance="?android:attr/textAppearanceLarge"
        android:textSize="16sp" />

    <Button
        android:id="@+id/button1"
        android:layout_width="80dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:layout_alignParentTop="true"
        android:background="#FFFFFF"
        android:focusable="false"
        android:focusableInTouchMode="false"
        android:text="Edit Data"
        android:textColor="#0099CC" />

    <Button
        android:id="@+id/button2"
        android:layout_width="80dp"
        android:layout_height="40dp"
        android:layout_alignParentRight="true"
        android:layout_below="@+id/button1"
        android:layout_marginTop="3dp"
        android:background="#FFFFFF"
        android:focusable="false"
        android:focusableInTouchMode="false"
        android:text="Delete"
        android:textColor="#0099CC" />

    <TextView
        android:id="@+id/textView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_below="@+id/textView2"
        android:layout_marginTop="5dp"
        android:text="Location" />

</RelativeLayout>

Step-3 Create User.java bean class

public class User {
 String name;
 String address;
 String location;

 public String getName() {
  return name;
 }

 public void setName(String name) {
  this.name = name;
 }

 public String getAddress() {
  return address;
 }

 public void setAddress(String address) {
  this.address = address;
 }

 public String getLocation() {
  return location;
 }

 public void setLocation(String location) {
  this.location = location;
 }

 public User(String name, String address, String location) {
  super();
  this.name = name;
  this.address = address;
  this.location = location;
 }

}

Step-4 Create UserCustomAdapter.java

 public class UserCustomAdapter extends ArrayAdapter<User> {
     Context context;
     int layoutResourceId;
     ArrayList<User> data = new ArrayList<User>();
    
     public UserCustomAdapter(Context context, int layoutResourceId,
       ArrayList<User> data) {
      super(context, layoutResourceId, data);
      this.layoutResourceId = layoutResourceId;
      this.context = context;
      this.data = data;
     }
    
     @Override
     public View getView(int position, View convertView, ViewGroup parent) {
      View row = convertView;
      UserHolder holder = null;
    
      if (row == null) {
       LayoutInflater inflater = ((Activity) context).getLayoutInflater();
       row = inflater.inflate(layoutResourceId, parent, false);
       holder = new UserHolder();
       holder.textName = (TextView) row.findViewById(R.id.textView1);
       holder.textAddress = (TextView) row.findViewById(R.id.textView2);
       holder.textLocation = (TextView) row.findViewById(R.id.textView3);
       holder.btnEdit = (Button) row.findViewById(R.id.button1);
       holder.btnDelete = (Button) row.findViewById(R.id.button2);
       row.setTag(holder);
      } else {
       holder = (UserHolder) row.getTag();
      }
      User user = data.get(position);
      holder.textName.setText(user.getName());
      holder.textAddress.setText(user.getAddress());
      holder.textLocation.setText(user.getLocation());
      holder.btnEdit.setOnClickListener(new OnClickListener() {
    
       @Override
       public void onClick(View v) {
        // TODO Auto-generated method stub
        Log.i("Edit Button Clicked", "**********");
        Toast.makeText(context, "Edit button Clicked",
          Toast.LENGTH_LONG).show();
       }
      });
      holder.btnDelete.setOnClickListener(new OnClickListener() {
    
       @Override
       public void onClick(View v) {
        // TODO Auto-generated method stub
        Log.i("Delete Button Clicked", "**********");
        Toast.makeText(context, "Delete button Clicked",
          Toast.LENGTH_LONG).show();
       }
      });
      return row;
    
     }
    
     static class UserHolder {
      TextView textName;
      TextView textAddress;
      TextView textLocation;
      Button btnEdit;
      Button btnDelete;
     }
    }

Step-5 Create MainActivity.java

public class MainActivity extends Activity {
 ListView userList;
 UserCustomAdapter userAdapter;
 ArrayList<User> userArray = new ArrayList<User>();

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

  /**
   * add item in arraylist
   */
  userArray.add(new User("Mumer", "Spain", "Spain"));
  userArray.add(new User("Jon", "EW", "USA"));
  userArray.add(new User("Broom", "Span", "SWA"));
  userArray.add(new User("Lee", "Aus", "AUS"));
  userArray.add(new User("Jon", "EW", "USA"));
  userArray.add(new User("Broom", "Span", "SWA"));
  userArray.add(new User("Lee", "Aus", "AUS"));
  /**
   * set item into adapter
   */
  userAdapter = new UserCustomAdapter(MainActivity.this, R.layout.row,
    userArray);
  userList = (ListView) findViewById(R.id.listView);
  userList.setItemsCanFocus(false);
  userList.setAdapter(userAdapter);
  /**
   * get on item click listener
   */
  userList.setOnItemClickListener(new OnItemClickListener() {

   @Override
   public void onItemClick(AdapterView<?> parent, View v,
     final int position, long id) {
    Log.i("List View Clicked", "**********");
    Toast.makeText(MainActivity.this,
      "List View Clicked:" + position, Toast.LENGTH_LONG)
      .show();
   }
  });

 }

}

You may check my blog for full code. look here-

Niccolo answered 8/7, 2013 at 11:54 Comment(7)
Confusion is there. My ListView is ready. I just have to add two buttons in each row. I am not getting your code clearly.Imprint
just put two button in your row_layout.xml like other textview and call them with their id.. And set onclick listner like me- holder.btnDelete.setOnClickListener(new OnClickListener() { @Override public void onClick(View v) { // TODO Auto-generated method stub Log.i("Delete Button Clicked", "**********"); Toast.makeText(context, "Delete button Clicked", Toast.LENGTH_LONG).show(); } });Niccolo
well I suggest just copy paste all code and make a demo application then you can easily understand working of code..Niccolo
Now I have to make changes to my GUI as per requirement. I have to add two buttons only at bottom with listview.Imprint
Do you have any idea about this.?Imprint
Yes just put your button into relative layout where you want and call them with their ID in your layout.. See my demo..Niccolo
Still you did not get any luck? If yes please mark this answer as correct.. I need some point at this stage :) Thanks..Niccolo

© 2022 - 2024 — McMap. All rights reserved.