Diálogo de alerta con MultipleItemSelection en Android

En el artículo anterior Diálogo de alerta con SingleItemSelection en Android , vimos cómo se crea el diálogo de alerta para la selección de un solo elemento. En este artículo, se ha discutido cómo crear un cuadro de diálogo de alerta con selección de elementos múltiples. Los cuadros de diálogo de selección de varios elementos se utilizan cuando el usuario desea seleccionar varios elementos a la vez. Eche un vistazo a la siguiente imagen para diferenciar entre los cuadros de diálogo de alerta de selección de un solo elemento y de selección de varios elementos.

Alert Dialog with MultipleItemSelection in Android

Pasos para implementar el cuadro de diálogo de alerta con selección de elementos múltiples

Paso 1: crear un proyecto de actividad vacío

Paso 2: Trabajando con activity_main.xml

  • El diseño principal incluye un botón simple y un widget TextView. TextView se implementa para obtener una vista previa de los elementos seleccionados de la lista.
  • Invoque el siguiente código para construir la interfaz de usuario:

XML

<?xml version="1.0" encoding="utf-8"?>
<LinearLayout
    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:orientation="vertical"
    tools:context=".MainActivity"
    tools:ignore="HardcodedText">
 
    <Button
        android:id="@+id/openAlertDialogButton"
        android:layout_width="256dp"
        android:layout_height="60dp"
        android:layout_gravity="center_horizontal"
        android:layout_marginTop="64dp"
        android:backgroundTint="@color/colorPrimary"
        android:text="OPEN ALERT DIALOG"
        android:textColor="@android:color/white"
        android:textSize="18sp" />
 
    <TextView
        android:id="@+id/selectedItemPreview"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_gravity="center_horizontal"
        android:layout_marginStart="16dp"
        android:layout_marginTop="16dp"
        android:layout_marginEnd="16dp"
        android:textColor="@android:color/black"
        android:textSize="18sp" />
 
</LinearLayout>

 
 Interfaz de usuario de salida:

Alert Dialog with MultipleItemSelection in Android

Paso 3: trabajar con el archivo MainActivity.java 

Es necesario comprender las partes del cuadro de diálogo de alerta de selección de elementos múltiples. Mira la siguiente imagen para conocer las partes:

Alert Dialog with MultipleItemSelection in Android

La función que necesita implementar la selección de elementos múltiples para el cuadro de diálogo de alerta se analiza a continuación.

Sintaxis:

setMultiChoiceItems(listItems, checkedItems, n
ew DialogInterface.OnMultiChoiceClickListener()

Parámetros:

  • listItems: son los elementos que se mostrarán en el cuadro de diálogo de alerta.
  • checkItems: es el arreglo booleano que mantiene los valores seleccionados como verdaderos y los valores no seleccionados como falsos.
  • DialogInterface.OnMultiChoiceClickListener(): esta es una devolución de llamada cuando se produce un cambio en la selección de elementos.

Invoque el siguiente código para implementar las cosas. Se agregan comentarios para una mejor comprensión.

Java

import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;
import android.annotation.SuppressLint;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import java.util.Arrays;
import java.util.List;
 
public class MainActivity extends AppCompatActivity {
 
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);
 
        // UI widgets button and
        Button bOpenAlertDialog = findViewById(R.id.openAlertDialogButton);
        final TextView tvSelectedItemsPreview = findViewById(R.id.selectedItemPreview);
 
        // initialise the list items for the alert dialog
        final String[] listItems = new String[]{"C", "C++", "JAVA", "PYTHON"};
        final boolean[] checkedItems = new boolean[listItems.length];
 
        // copy the items from the main list to the selected item list
        // for the preview if the item is checked then only the item
          // should be displayed for the user
        final List<String> selectedItems = Arrays.asList(listItems);
 
        // handle the Open Alert Dialog button
        bOpenAlertDialog.setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View v) {
 
                // initially set the null for the text preview
                tvSelectedItemsPreview.setText(null);
 
                // initialise the alert dialog builder
                AlertDialog.Builder builder = new AlertDialog.Builder(MainActivity.this);
               
                // set the title for the alert dialog
                builder.setTitle("Choose Items");
               
                // set the icon for the alert dialog
                builder.setIcon(R.drawable.image_logo);
 
                // now this is the function which sets the alert dialog for multiple item selection ready
                builder.setMultiChoiceItems(listItems, checkedItems, new DialogInterface.OnMultiChoiceClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which, boolean isChecked) {
                        checkedItems[which] = isChecked;
                        String currentItem = selectedItems.get(which);
                    }
                });
 
                // alert dialog shouldn't be cancellable
                builder.setCancelable(false);
 
                // handle the positive button of the dialog
                builder.setPositiveButton("Done", new DialogInterface.OnClickListener() {
                    @SuppressLint("SetTextI18n")
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        for (int i = 0; i < checkedItems.length; i++) {
                            if (checkedItems[i]) {
                                tvSelectedItemsPreview.setText(tvSelectedItemsPreview.getText() + selectedItems.get(i) + ", ");
                            }
                        }
                    }
                });
 
                // handle the negative button of the alert dialog
                builder.setNegativeButton("CANCEL", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
 
                    }
                });
 
                // handle the neutral button of the dialog to clear
                  // the selected items boolean checkedItem
                builder.setNeutralButton("CLEAR ALL", new DialogInterface.OnClickListener() {
                    @Override
                    public void onClick(DialogInterface dialog, int which) {
                        for (int i = 0; i < checkedItems.length; i++) {
                            checkedItems[i] = false;
                        }
                    }
                });
 
                // create the builder
                builder.create();
 
                // create the alert dialog with the
                  // alert dialog builder instance
                AlertDialog alertDialog = builder.create();
                alertDialog.show();
            }
        });
    }
}

Kotlin

import androidx.appcompat.app.AlertDialog;
import androidx.appcompat.app.AppCompatActivity;
import android.annotation.SuppressLint;
import android.content.DialogInterface;
import android.os.Bundle;
import android.view.View;
import android.widget.Button;
import android.widget.TextView;
import java.util.Arrays;
import java.util.List;
 
class MainActivity : AppCompatActivity() {
    override fun onCreate(savedInstanceState: Bundle?) {
        super.onCreate(savedInstanceState)
        setContentView(R.layout.activity_main)
 
        // UI widgets button and
        val bOpenAlertDialog: Button = findViewById(R.id.openAlertDialogButton)
        val tvSelectedItemsPreview = findViewById<TextView>(R.id.selectedItemPreview)
 
        // initialise the list items for the alert dialog
        val listItems = arrayOf("C", "C++", "JAVA", "PYTHON")
        val checkedItems = BooleanArray(listItems.size)
 
        // copy the items from the main list to the selected item list
        // for the preview if the item is checked then only the item
        // should be displayed for the user
        val selectedItems: List<String> = Arrays.asList(listItems)
 
        // handle the Open Alert Dialog button
        bOpenAlertDialog.setOnClickListener(object : OnClickListener() {
            fun onClick(v: View?) {
 
                // initially set the null for the text preview
                tvSelectedItemsPreview.text = null
 
                // initialise the alert dialog builder
                val builder: AlertDialog.Builder = Builder(this@MainActivity)
 
                // set the title for the alert dialog
                builder.setTitle("Choose Items")
 
                // set the icon for the alert dialog
                builder.setIcon(R.drawable.image_logo)
 
                // now this is the function which sets the alert dialog for multiple item selection ready
                builder.setMultiChoiceItems(listItems, checkedItems,
                    OnMultiChoiceClickListener { dialog, which, isChecked ->
                        checkedItems[which] = isChecked
                        val currentItem = selectedItems[which]
                    })
 
                // alert dialog shouldn't be cancellable
                builder.setCancelable(false)
 
                // handle the positive button of the dialog
                builder.setPositiveButton("Done",
                    DialogInterface.OnClickListener { dialog, which ->
                        for (i in checkedItems.indices) {
                            if (checkedItems[i]) {
                                tvSelectedItemsPreview.setText(tvSelectedItemsPreview.text + selectedItems[i] + ", ")
                            }
                        }
                    })
 
                // handle the negative button of the alert dialog
                builder.setNegativeButton("CANCEL",
                    DialogInterface.OnClickListener { dialog, which -> })
 
                // handle the neutral button of the dialog to clear
                // the selected items boolean checkedItem
                builder.setNeutralButton("CLEAR ALL",
                    DialogInterface.OnClickListener { dialog, which ->
                        for (i in checkedItems.indices) {
                            checkedItems[i] = false
                        }
                    })
 
                // create the builder
                builder.create()
 
                // create the alert dialog with the
                // alert dialog builder instance
                val alertDialog: AlertDialog = builder.create()
                alertDialog.show()
            }
        })
    }
}
// This code i written by Ujjwal Kumar Bhardwaj

Salida: ejecutar en el emulador

Publicación traducida automáticamente

Artículo escrito por adityamshidlyali y traducido por Barcelona Geeks. The original can be accessed here. Licence: CCBY-SA

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *