How to Delete Listview Item Using ImageView as OnClick Event

Question

Ok, I have an Listview adapter that contains an ImageView, TextView and another ImageView in that order. So I want to be able to delete the item in list when user presses on second ImageView. When the user press on the item in list it will start TextToSpeech and it will say what is inside TextView. But if the user wants to remove the entry he/she will press on second ImageView which is a delete icon, at that point the item will be remove from the list. Starting the click listener for the imageview is not a problem, the problem is how do I get the number (int) of the corresponding item in listview adapter so I can remove it from array. Here's xml list_item.xml for single entry in list

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

    <LinearLayout
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:orientation="horizontal"
        android:layout_marginTop="3dp"
        android:layout_marginBottom="3dp">

        <ImageView
            android:id="@+id/item_icon_imageview"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="0.15"
            android:src="@drawable/ic_record_voice_24dp2"/>

        <TextView
            android:id="@+id/phrase_textview"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="0.80"
            android:textSize="20sp"
            android:layout_marginTop="5dp"
            android:text="My phone number is 305 666 8454"/>

        <ImageView
            android:layout_gravity="center"
            android:id="@+id/delte_item_imageview"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="0.10"
            android:src="@drawable/ic_delete_black_24dp"/>

    </LinearLayout>

</RelativeLayout>

The fragment for inflating the listview

public class CustomFragment extends Fragment {
    private ArrayAdapter<String> adapter;
    private ListView listView;
    private FloatingActionButton addPhraseButton;
    private TextView phraseTitleTextView;
    private TextToSpeech textToSpeech;
    private ArrayList<String> phrases;
    private static final String PHRASE_LABEL = " Phrases";
    private static final String CATEGORY_KEY = "categories";
    private ImageView deleteItemImageView;

    @Nullable
    @Override
    public View onCreateView(@NonNull LayoutInflater inflater, @Nullable ViewGroup container, @Nullable Bundle savedInstanceState) {
        View view = inflater.inflate(R.layout.fragment_custom, container, false);

        final String categories;
        //if we selecte a category sent from home fragment else we got here through menu
        Bundle arguments = getArguments();
        if (arguments != null && arguments.containsKey(CATEGORY_KEY)) {
            categories = arguments.getString(CATEGORY_KEY).toLowerCase();
        }
        else {
            Resources res = view.getResources();
            categories = res.getStringArray(R.array.categories)[0].toLowerCase();
        }

        final Phrases allPhrases = Phrases.getPhrases();
        allPhrases.fetchAllPhrases(view.getContext());
        phrases = allPhrases.getAllPhrases().get(categories);

        phraseTitleTextView = view.findViewById(R.id.label_phrases_txtview);
        deleteItemImageView = view.findViewById(R.id.delte_item_imageview);

        phraseTitleTextView.setText(categories.substring(0,1).toUpperCase() +
                categories.substring(1)+ PHRASE_LABEL);
        addPhraseButton = view.findViewById(R.id.add_phrases_btn);
        // setting local for text to speech
        textToSpeech = new TextToSpeech(getActivity().getApplicationContext(), new TextToSpeech.OnInitListener() {
            @Override
            public void onInit(int status) {
                textToSpeech.setLanguage(Locale.US);
            }
        });

        //setting adapter and listview
        adapter = new ArrayAdapter<String>(getContext(), R.layout.entry_item, R.id.phrase_textview, phrases);
        listView = (ListView) view.findViewById(R.id.phrases_list);
        listView.setAdapter(adapter);
        listView.setItemsCanFocus(true);

        //activating text to speech when user selects item in listview
        listView.setOnItemClickListener(new AdapterView.OnItemClickListener() {
            @Override
            public void onItemClick(AdapterView<?> paren, View view, int position, long id) {
                String text = phrases.get(position);
                Toast.makeText(getContext(), text, Toast.LENGTH_LONG).show();
                textToSpeech.speak(text, TextToSpeech.QUEUE_FLUSH,null, null);
            }
        });

        deleteItemImageView.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {

            }
        });

        //button to display alert dialog box to add new phrase
        addPhraseButton.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                addPhraseDialogBox();
            }
        });
        return view;
    }
}

I think you should use a RecyclerView and create a custom adapter to achieve what you asked — roccocullo, Dec 06 '19 at 16:36
do I have to implement the onClicklistener inside the custom adapter? — miatech, Dec 06 '19 at 16:42
Follow this [link](https://stackoverflow.com/a/31727513/9589677) — Shakib Uz-Zaman, Dec 06 '19 at 16:55
why you have to implement a custom adapter. doesn't java has the same functionality as javascript that you create a listener for a parent view and you can traverse down and find the item that was selected through a for loop or something — miatech, Dec 06 '19 at 17:35

score 0 · Answer 1 · answered Dec 06 '19 at 16:50

You can achieve this through Custom Adapter. Check below:

public class CustomArrayAdapter extends ArrayAdapter<String> {

    LayoutInflater inflater;
    ArrayList<String> phrases;

    public CustomArrayAdapter(Context context, int textViewResourceId, ArrayList<String> items) {
        super(context, textViewResourceId, items);
        inflater = (LayoutInflater) context
                .getSystemService(Context.LAYOUT_INFLATER_SERVICE);
        phrases = items;
    }


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

        if (convertView == null) {
            convertView = inflater.inflate(R.layout.entry_item, parent, false);
        }

        ....

        ImageView deleteItemImageview = (ImageView) convertView.findViewById(R.id. delte_item_imageview);
        deleteItemImageview.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {
                phrases.remove(position);
                notifyDataSetChanged();
            }
        });

        return convertView;
    }
}

How to Delete Listview Item Using ImageView as OnClick Event

1 Answers1