How To Add Checkboxes To ListView (Each list) in Android Studio

Question

basically I am creating a Task/ToDo List app and I can't figure this part out. I want to add a checkbox next to each task and the ability to check them.

Here is the MainActivity.java

---

public class MainActivity extends AppCompatActivity {

static ArrayList<String> notes = new ArrayList<>();
static ArrayAdapter arrayAdapter;


public boolean onCreateOptionsMenu(Menu menu) {

    MenuInflater menuInflater = getMenuInflater();
    menuInflater.inflate(R.menu.main_menu, menu);

    return super.onCreateOptionsMenu(menu);
}


public boolean onOptionsItemSelected(MenuItem item) {
    super.onOptionsItemSelected(item);
    if (item.getItemId() == R.id.add_note) {
        Intent intent = new Intent(getApplicationContext(),
                note_editor.class);
        startActivity(intent);
        return true;
    }
    return false;
}

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

    ListView listView = (ListView) findViewById(R.id.listView);

    SharedPreferences sharedPreferences =
            getApplicationContext().getSharedPreferences
                    ("com.example.assignment1", Context.MODE_PRIVATE);


    HashSet<String> set = (HashSet<String>)
            sharedPreferences.getStringSet("notes", null);

    if (set == null) {
        notes.add("Add Your Task Hereee");
    } else {
        notes = new ArrayList(set);
    }


    arrayAdapter = new ArrayAdapter
            (this, android.R.layout.simple_list_item_1, notes);

    listView.setAdapter(arrayAdapter);


    listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {

        public void onItemClick
        (AdapterView<?> adapterView, View view, int i, long l) {

            Intent intent = new Intent(getApplicationContext(),
                    note_editor.class);
            intent.putExtra("noteId", i);
            startActivity(intent);


        }

    });

---

My main.xml

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    tools:context=".MainActivity">

    <ListView
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_alignParentTop="true"
        android:layout_alignParentEnd="true"
        android:id="@+id/listView" />

    <com.google.android.material.floatingactionbutton.FloatingActionButton
        android:id="@+id/fab"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentEnd="true"
        android:layout_alignParentBottom="true"
        android:layout_marginEnd="32dp"
        android:layout_marginBottom="28dp"
        android:backgroundTint="#4BB3A9"
        android:src="@drawable/add_task"/>

</RelativeLayout>

I want it to look something like this": I drew the checkboxes here

I also have another class for when editing the tasks as well as for a splash screen but I don't think it's necessary here. Any help would be really appreciated!

Answer 1

You could use Recycler view instead of List view. See below code for Reference:

Create custom adapter and set it to your Recycler view and call it like recyclerView.setAdapter(CustomAdapter(new ArrayList("AAAAA","BBBBB","CCCCC","DDDDD"),getContext()));

Custom Adapter

public class CustomAdapter extends ArrayAdapter<String> {

    private ArrayList<String> dataSet;

    // View lookup cache
    private static class ViewHolder {
        CheckedTextView checkedTextView;
    }

    public CustomAdapter(ArrayList<String> data, Context context) {
        super(context, R.layout.list_item, data);
        this.dataSet = data;
    }

    @Override
    public View getView(int position, View convertView, ViewGroup parent) {

        // Check if an existing view is being reused, otherwise inflate the view
        ViewHolder viewHolder; // view lookup cache stored in tag

        if (convertView == null) {

            viewHolder = new ViewHolder();
            LayoutInflater inflater = LayoutInflater.from(getContext());
            convertView = inflater.inflate(R.layout.list_item, parent, false);
            viewHolder.checkedTextView = convertView.findViewById(R.id.check_box);
            viewHolder.checkedTextView.setOnClickListener(new View.OnClickListener() {
                @Override
                public void onClick(View view) {
                    viewHolder.checkedTextView.setChecked(!viewHolder.checkedTextView.isChecked());
                }
            });
            convertView.setTag(viewHolder);
        } else {
            viewHolder = (ViewHolder) convertView.getTag();
        }

        viewHolder.checkedTextView.setText(dataSet.get(position));

        return convertView;
    }
}

XML code for each list item: list_item.xml

<CheckedTextView
xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/check_box"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_marginStart="10dp"
android:layout_marginEnd="10dp"
android:checked="false"
android:checkMark="?android:attr/listChoiceIndicatorMultiple"
android:gravity="center"
android:text="Check Me"
/>

Answer 2

You are using an android default layout for your ListView and this default layout shows a TextView only, you have to create custom layout for your list item views and custom ArrayAdapter to achieve what you want.

for more information check out this: https://javapapers.com/android/android-listview-custom-layout-tutorial/

As a tip switch for RecyclerView which is much more efficient: https://developer.android.com/guide/topics/ui/layout/recyclerview