Autocompletar en Xamarin.Android

Artículo
04/26/2024

AutoCompleteTextView es un elemento editable de la vista de texto que muestra automáticamente las sugerencias para completar texto mientras el usuario escribe. La lista de sugerencias se muestra en un menú desplegable en el que el usuario puede elegir cualquier elemento por el que reemplazar el contenido del cuadro de edición.

Example of Auto Complete

Información general

Para crear un widget de entrada de texto que proporcione sugerencias de autocompletar, use el widget AutoCompleteTextView. Las sugerencias se reciben de una colección de cadenas asociadas al widget a través de ArrayAdapter.

En este tutorial va a crear un widget AutoCompleteTextView que proporciona sugerencias de un nombre de país.

<?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">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Country" />
    <AutoCompleteTextView android:id="@+id/autocomplete_country"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"/>
</LinearLayout>

TextView es una etiqueta que presenta el widget AutoCompleteTextView.

Tutorial

Inicie un nuevo proyecto denominado HelloAutoComplete.

Cree un archivo XML denominado list_item.xml y guárdelo en la carpeta Resources/Layout. Establezca la acción de compilación de este archivo en AndroidResource. Edite el archivo hasta que tenga la siguiente apariencia:

<?xml version="1.0" encoding="utf-8"?>

<TextView xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:padding="10dp"
    android:textSize="16sp"
    android:textColor="#000">
</TextView>

Este archivo define un elemento TextView simple que se usará para cada elemento que aparezca en la lista de sugerencias.

Abra Resources/Layout/Main.axml e inserte el siguiente código:

<?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">
    <TextView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:text="Country" />
    <AutoCompleteTextView android:id="@+id/autocomplete_country"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_marginLeft="5dp"/>
</LinearLayout>

Abra MainActivity.cs e inserte el código siguiente para el Método OnCreate():

protected override void OnCreate (Bundle bundle)
{
    base.OnCreate (bundle);

    // Set our view from the "Main" layout resource
    SetContentView (Resource.Layout.Main);

    AutoCompleteTextView textView = FindViewById<AutoCompleteTextView> (Resource.Id.autocomplete_country);
    var adapter = new ArrayAdapter<String> (this, Resource.Layout.list_item, COUNTRIES);

    textView.Adapter = adapter;
}

Después de que la vista del contenido se establece en el diseño main.xml, el widget AutoCompleteTextView se captura del diseño con FindViewById. Luego, se inicializa un nuevo ArrayAdapter para enlazar el diseño list_item.xml a cada elemento de lista de la COUNTRIES matriz de cadenas (definido en el paso siguiente). Por último se llama a SetAdapter() para asociar ArrayAdapter con el widget AutoCompleteTextView para que la matriz de cadenas rellene la lista de sugerencias.

Dentro de la clase MainActivity, agregue la matriz de cadenas:

static string[] COUNTRIES = new string[] {
  "Afghanistan", "Albania", "Algeria", "American Samoa", "Andorra",
  "Angola", "Anguilla", "Antarctica", "Antigua and Barbuda", "Argentina",
  "Armenia", "Aruba", "Australia", "Austria", "Azerbaijan",
  "Bahrain", "Bangladesh", "Barbados", "Belarus", "Belgium",
  "Belize", "Benin", "Bermuda", "Bhutan", "Bolivia",
  "Bosnia and Herzegovina", "Botswana", "Bouvet Island", "Brazil", "British Indian Ocean Territory",
  "British Virgin Islands", "Brunei", "Bulgaria", "Burkina Faso", "Burundi",
  "Cote d'Ivoire", "Cambodia", "Cameroon", "Canada", "Cape Verde",
  "Cayman Islands", "Central African Republic", "Chad", "Chile", "China",
  "Christmas Island", "Cocos (Keeling) Islands", "Colombia", "Comoros", "Congo",
  "Cook Islands", "Costa Rica", "Croatia", "Cuba", "Cyprus", "Czech Republic",
  "Democratic Republic of the Congo", "Denmark", "Djibouti", "Dominica", "Dominican Republic",
  "East Timor", "Ecuador", "Egypt", "El Salvador", "Equatorial Guinea", "Eritrea",
  "Estonia", "Ethiopia", "Faeroe Islands", "Falkland Islands", "Fiji", "Finland",
  "Former Yugoslav Republic of Macedonia", "France", "French Guiana", "French Polynesia",
  "French Southern Territories", "Gabon", "Georgia", "Germany", "Ghana", "Gibraltar",
  "Greece", "Greenland", "Grenada", "Guadeloupe", "Guam", "Guatemala", "Guinea", "Guinea-Bissau",
  "Guyana", "Haiti", "Heard Island and McDonald Islands", "Honduras", "Hong Kong", "Hungary",
  "Iceland", "India", "Indonesia", "Iran", "Iraq", "Ireland", "Israel", "Italy", "Jamaica",
  "Japan", "Jordan", "Kazakhstan", "Kenya", "Kiribati", "Kuwait", "Kyrgyzstan", "Laos",
  "Latvia", "Lebanon", "Lesotho", "Liberia", "Libya", "Liechtenstein", "Lithuania", "Luxembourg",
  "Macau", "Madagascar", "Malawi", "Malaysia", "Maldives", "Mali", "Malta", "Marshall Islands",
  "Martinique", "Mauritania", "Mauritius", "Mayotte", "Mexico", "Micronesia", "Moldova",
  "Monaco", "Mongolia", "Montserrat", "Morocco", "Mozambique", "Myanmar", "Namibia",
  "Nauru", "Nepal", "Netherlands", "Netherlands Antilles", "New Caledonia", "New Zealand",
  "Nicaragua", "Niger", "Nigeria", "Niue", "Norfolk Island", "North Korea", "Northern Marianas",
  "Norway", "Oman", "Pakistan", "Palau", "Panama", "Papua New Guinea", "Paraguay", "Peru",
  "Philippines", "Pitcairn Islands", "Poland", "Portugal", "Puerto Rico", "Qatar",
  "Reunion", "Romania", "Russia", "Rwanda", "Sqo Tome and Principe", "Saint Helena",
  "Saint Kitts and Nevis", "Saint Lucia", "Saint Pierre and Miquelon",
  "Saint Vincent and the Grenadines", "Samoa", "San Marino", "Saudi Arabia", "Senegal",
  "Seychelles", "Sierra Leone", "Singapore", "Slovakia", "Slovenia", "Solomon Islands",
  "Somalia", "South Africa", "South Georgia and the South Sandwich Islands", "South Korea",
  "Spain", "Sri Lanka", "Sudan", "Suriname", "Svalbard and Jan Mayen", "Swaziland", "Sweden",
  "Switzerland", "Syria", "Taiwan", "Tajikistan", "Tanzania", "Thailand", "The Bahamas",
  "The Gambia", "Togo", "Tokelau", "Tonga", "Trinidad and Tobago", "Tunisia", "Turkey",
  "Turkmenistan", "Turks and Caicos Islands", "Tuvalu", "Virgin Islands", "Uganda",
  "Ukraine", "United Arab Emirates", "United Kingdom",
  "United States", "United States Minor Outlying Islands", "Uruguay", "Uzbekistan",
  "Vanuatu", "Vatican City", "Venezuela", "Vietnam", "Wallis and Futuna", "Western Sahara",
  "Yemen", "Yugoslavia", "Zambia", "Zimbabwe"
};

Esta es la lista de sugerencias que se proporcionarán en una lista desplegable cuando el usuario escribe en el widget AutoCompleteTextView.

Ejecute la aplicación. Mientras escribe, debería ver algo parecido a esto:

Más información

Tenga en cuenta que el uso de una matriz de cadenas codificada de forma rígida no es una práctica de diseño recomendada, ya que el código de la aplicación debe centrarse en el comportamiento, no en el contenido. El contenido de la aplicación, como las cadenas, debe externalizarse desde el código para facilitar la realización de modificaciones en el contenido y su localización. Las cadenas codificadas de forma rígida solo se usan en este tutorial para simplificar y centrarse en el widget AutoCompleteTextView. En su lugar, la aplicación debe declarar estas matrices de cadenas en un archivo XML. Esto se puede hacer con un recurso de <string-array> en el archivo res/values/strings.xml del proyecto. Por ejemplo:

<?xml version="1.0" encoding="utf-8"?>
<resources>
    <string-array name="countries_array">
        <item>Bahrain</item>
        <item>Bangladesh</item>
        <item>Barbados</item>
        <item>Belarus</item>
        <item>Belgium</item>
        <item>Belize</item>
        <item>Benin</item>
    </string-array>
</resources>

Para usar estas cadenas de recursos para ArrayAdapter, reemplace la línea de constructor ArrayAdapter original por lo siguiente:

string[] countries = Resources.GetStringArray (Resource.array.countries_array);
var adapter = new ArrayAdapter<String> (this, Resource.layout.list_item, countries);

Referencias

AutoCompleteTextView Recipe: proyecto de ejemplo de Xamarin.Android para AutoCompleteTextView
ArrayAdapter
AutoCompleteTextView

Varias partes de esta página son modificaciones basadas en el trabajo creado y compartido por el proyecto de código abierto de Android y se usan según los términos descritos en la licencia de atribución de Creative Commons 2.5. Este tutorial se basa en el tutorial de uso de la función de autocompletar de Android*.

Autocompletar en Xamarin.Android

Información general

Tutorial

Más información

Referencias

Recursos adicionales