AutoCompleteTextView

AutoCompleteTextView adalah komponen tampilan di Android yang menyediakan fungsionalitas pelengkapan otomatis saat pengguna mengetik di dalam kolom teks. Komponen ini sering digunakan untuk memberikan saran atau prediksi teks berdasarkan input pengguna, seperti ketika memilih nama, lokasi, atau data lainnya dari daftar yang telah disediakan.

Fitur Utama:

• Saat pengguna mulai mengetik, daftar saran yang sesuai dengan input akan muncul.
• Pengguna dapat memilih item dari daftar tersebut, yang kemudian akan diisi otomatis ke dalam kolom teks.
• Daftar saran biasanya diambil dari sumber data seperti array statis, daftar dinamis, atau dari database.

Cara Kerja:

1. Sumber Data: AutoCompleteTextView memerlukan sumber data untuk menampilkan saran. Ini bisa berupa ArrayAdapter, CursorAdapter, atau custom adapter yang menampilkan daftar pilihan kepada pengguna.
2. Threshold: Anda bisa menentukan berapa banyak karakter yang perlu diketik sebelum saran mulai muncul. Misalnya, Anda bisa mengatur agar daftar saran muncul setelah pengguna mengetik dua huruf.

Langkah-langkah Implementasi AutoCompleteTextView:

Tambahkan AutoCompleteTextView di XML Layout

Anda bisa menambahkan komponen AutoCompleteTextView di layout XML aplikasi Anda.

<AutoCompleteTextView

    android:id="@+id/autoCompleteTextView"

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    android:hint="Ketik sesuatu"

    android:completionThreshold="1" />

• android:hint memberikan petunjuk bagi pengguna.
• android:completionThreshold menentukan berapa banyak karakter yang harus dimasukkan sebelum saran muncul. Nilai defaultnya adalah 2, tetapi dalam contoh ini diatur menjadi 1.

2. Buat Sumber Data di Activity

Sekarang, Anda perlu memberikan daftar pilihan atau saran yang akan ditampilkan di AutoCompleteTextView. Contohnya, kita bisa menggunakan array string.

String[] countries = {"Indonesia", "India", "Inggris", "Italia", "Islandia", "Iran"};

3. Menghubungkan Sumber Data dengan AutoCompleteTextView

Anda harus menggunakan ArrayAdapter untuk menghubungkan data tersebut dengan AutoCompleteTextView. Berikut adalah implementasi di file Java atau Kotlin:

Java:

import android.os.Bundle;

import android.widget.ArrayAdapter;

import android.widget.AutoCompleteTextView;

import androidx.appcompat.app.AppCompatActivity;

public class MainActivity extends AppCompatActivity {

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_main);

        // Data array

        String[] countries = {"Indonesia", "India", "Inggris", "Italia", "Islandia", "Iran"};

        // Mendapatkan referensi AutoCompleteTextView

        AutoCompleteTextView autoCompleteTextView = findViewById(R.id.autoCompleteTextView);

        // Membuat adapter dengan data array

        ArrayAdapter<String> adapter = new ArrayAdapter<String>(this,

                android.R.layout.simple_dropdown_item_1line, countries);

        // Menghubungkan adapter dengan AutoCompleteTextView

        autoCompleteTextView.setAdapter(adapter);

    }

}

Kotlin:

import android.os.Bundle

import android.widget.ArrayAdapter

import android.widget.AutoCompleteTextView

import androidx.appcompat.app.AppCompatActivity

class MainActivity : AppCompatActivity() {

    override fun onCreate(savedInstanceState: Bundle?) {

        super.onCreate(savedInstanceState)

        setContentView(R.layout.activity_main)

        // Data array

        val countries = arrayOf("Indonesia", "India", "Inggris", "Italia", "Islandia", "Iran")

        // Mendapatkan referensi AutoCompleteTextView

        val autoCompleteTextView = findViewById<AutoCompleteTextView>(R.id.autoCompleteTextView)

        // Membuat adapter dengan data array

        val adapter = ArrayAdapter(this, android.R.layout.simple_dropdown_item_1line, countries)

        // Menghubungkan adapter dengan AutoCompleteTextView

        autoCompleteTextView.setAdapter(adapter)

    }

}

Penjelasan Kode:

• ArrayAdapter: Digunakan untuk menghubungkan data (dalam bentuk array) dengan tampilan dropdown di AutoCompleteTextView.
• android.R.layout.simple_dropdown_item_1line: Layout default untuk menampilkan setiap item dalam dropdown.
• setAdapter(): Metode ini digunakan untuk menghubungkan adapter dengan AutoCompleteTextView, sehingga saran bisa ditampilkan saat pengguna mengetik.

Mengatur Threshold Karakter

Anda bisa mengatur berapa banyak karakter yang perlu diketik sebelum saran muncul. Contohnya, jika threshold diatur menjadi 2, daftar saran hanya akan muncul setelah pengguna mengetik minimal 2 karakter.

autoCompleteTextView.setThreshold(2);

Customizing Tampilan Dropdown

Anda juga bisa mengubah tampilan dropdown dengan menggunakan layout kustom jika tampilan default tidak sesuai dengan kebutuhan desain aplikasi Anda. Caranya adalah dengan membuat layout XML baru dan menggunakannya dalam adapter.

Contoh layout kustom:

<!-- res/layout/custom_dropdown_item.xml -->

<TextView xmlns:android="http://schemas.android.com/apk/res/android"

    android:layout_width="match_parent"

    android:layout_height="wrap_content"

    android:padding="10dp"

    android:textSize="18sp"

    android:textColor="#000000" />

Menggunakan layout kustom di adapter:

ArrayAdapter<String> adapter = new ArrayAdapter<>(this,

        R.layout.custom_dropdown_item, countries);

autoCompleteTextView.setAdapter(adapter);

Kesimpulan

• AutoCompleteTextView sangat berguna untuk meningkatkan pengalaman pengguna dengan menyediakan saran otomatis saat mengetik.
• Implementasi dasar melibatkan penggunaan AutoCompleteTextView dalam XML dan menghubungkannya dengan adapter untuk menyediakan data.
• Anda dapat menyesuaikan jumlah karakter minimum sebelum saran muncul, serta mengubah tampilan dropdown menggunakan layout kustom.

Fitur ini sangat membantu terutama untuk aplikasi yang memerlukan input pengguna dengan data tertentu seperti nama kota, produk, atau layanan.