implement autocompleteDropDownMenu

app/src/main/java/com/skyyo/samples/application/Destination.kt

@@ -27,6 +27,7 @@ sealed class Destination(val route: String) {
     object CustomView : Destination("customViewScreen")
     object MarqueeText: Destination("marqueeText")
     object Autofill: Destination("autofill")
+    object AutoComplete: Destination("autoComplete")
     object DogFeed : Destination("dogFeed")
     object DogDetails : Destination("dogDetails/{dogId}") {
         fun createRoute(dogId: String) = "dogDetails/$dogId"

app/src/main/java/com/skyyo/samples/application/activity/PopulatedNavHost.kt

@@ -16,6 +16,7 @@ import com.google.accompanist.pager.ExperimentalPagerApi
 import com.skyyo.samples.application.Destination
 import com.skyyo.samples.application.ProfileGraph
 import com.skyyo.samples.features.appBarElevation.AppBarElevation
+import com.skyyo.samples.features.autoComplete.AutoCompleteScreen
 import com.skyyo.samples.features.autofill.AutofillScreen
 import com.skyyo.samples.features.autoscroll.AutoScrollScreen
 import com.skyyo.samples.features.bottomSheets.BottomSheetScaffoldScreen
@@ -125,6 +126,7 @@ fun PopulatedNavHost(
     composable(Destination.CustomView.route) { CustomViewScreen() }
     composable(Destination.MarqueeText.route) { MarqueeTextScreen() }
     composable(Destination.Autofill.route) { AutofillScreen() }
+    composable(Destination.AutoComplete.route) { AutoCompleteScreen() }
     navigation(
         route = ProfileGraph.route,
         startDestination = ProfileGraph.Profile.route

app/src/main/java/com/skyyo/samples/features/autoComplete/AndroidViewTextFieldWithDropDownSample.kt

@@ -0,0 +1,45 @@
+package com.skyyo.samples.features.autoComplete
+
+import android.widget.ArrayAdapter
+import android.widget.AutoCompleteTextView
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.remember
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.platform.LocalContext
+import androidx.compose.ui.viewinterop.AndroidView
+import com.google.android.material.textfield.TextInputLayout
+import com.skyyo.samples.R
+
+@Composable
+fun AndroidViewTextFieldWithDropDownSample(
+    modifier: Modifier = Modifier,
+    suggestions: List<String>,
+    selectedValue: String = "",
+    onSelect: (Int) -> Unit = {},
+) {
+    val context = LocalContext.current
+    val adapter = remember(suggestions) {
+        ArrayAdapter(context, android.R.layout.simple_list_item_1, suggestions)
+    }
+    val textInputLayout = remember {
+        (TextInputLayout.inflate(
+            context,
+            R.layout.text_input_field,
+            null
+        ) as TextInputLayout).also { til ->
+            (til.editText as AutoCompleteTextView).setOnItemClickListener { _, _, index, _ ->
+                onSelect(index)
+            }
+        }
+    }
+    val autoCompleteTextView = remember { textInputLayout.editText as? AutoCompleteTextView }
+
+    AndroidView(
+        modifier = modifier,
+        factory = { textInputLayout },
+        update = {
+            autoCompleteTextView?.setAdapter(adapter)
+            autoCompleteTextView?.setText(selectedValue, false)
+        },
+    )
+}

app/src/main/java/com/skyyo/samples/features/autoComplete/AutoCompleteScreen.kt

@@ -0,0 +1,63 @@
+package com.skyyo.samples.features.autoComplete
+
+import androidx.compose.foundation.layout.*
+import androidx.compose.material.Text
+import androidx.compose.runtime.Composable
+import androidx.compose.runtime.collectAsState
+import androidx.compose.ui.Alignment
+import androidx.compose.ui.Modifier
+import androidx.compose.ui.unit.dp
+import androidx.hilt.navigation.compose.hiltViewModel
+
+@Composable
+fun AutoCompleteScreen(
+    viewModel: AutoCompleteViewModel = hiltViewModel()
+) {
+    val query = viewModel.query.collectAsState()
+    val isExpanded = viewModel.isExpanded.collectAsState()
+    val suggestions = viewModel.suggestions.collectAsState()
+
+    Column(
+        Modifier
+            .fillMaxSize()
+            .padding(top = 32.dp, start = 16.dp, end = 16.dp),
+        horizontalAlignment = Alignment.CenterHorizontally
+    ) {
+        Spacer(modifier = Modifier.height(16.dp))
+        Text(text = "AndroidView")
+        AndroidViewTextFieldWithDropDownSample(
+            modifier = Modifier.fillMaxWidth(),
+            suggestions = viewModel.countries,
+            selectedValue = "",
+        )
+        Spacer(modifier = Modifier.height(16.dp))
+        Text(text = "Native exposed dropdown menu")
+        NativeExposedDropDownMenuSample(
+            modifier = Modifier.fillMaxWidth(),
+            countries = viewModel.countries
+        )
+        Spacer(modifier = Modifier.height(60.dp))
+        Text(text = "Custom exposed dropdown menu")
+        CustomExposedDropdownMenuSample(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(horizontal = 32.dp),
+            onSuggestionSelected = viewModel::onCountrySelected,
+            onExpandedChange = viewModel::onExpandedChange,
+            onValueChange = viewModel::onCountryEntered,
+            onClick = viewModel::onExpandedFieldClick,
+            suggestions = suggestions.value,
+            expanded = isExpanded.value,
+            query = query.value,
+        )
+        Spacer(modifier = Modifier.height(16.dp))
+        Text(text = "AndroidView")
+        AndroidViewTextFieldWithDropDownSample(
+            modifier = Modifier
+                .fillMaxWidth()
+                .padding(horizontal = 32.dp),
+            suggestions = viewModel.countries,
+            selectedValue = "",
+        )
+    }
+}

app/src/main/java/com/skyyo/samples/features/autoComplete/AutoCompleteViewModel.kt

@@ -0,0 +1,65 @@
+package com.skyyo.samples.features.autoComplete
+
+import androidx.lifecycle.SavedStateHandle
+import androidx.lifecycle.ViewModel
+import androidx.lifecycle.viewModelScope
+import com.skyyo.samples.extensions.getStateFlow
+import dagger.hilt.android.lifecycle.HiltViewModel
+import kotlinx.coroutines.Dispatchers
+import kotlinx.coroutines.launch
+import java.util.*
+import javax.inject.Inject
+
+@HiltViewModel
+class AutoCompleteViewModel @Inject constructor(
+    handle: SavedStateHandle
+) : ViewModel() {
+
+    val countries = provideCountries()
+    val query = handle.getStateFlow(viewModelScope, "query", "")
+    val suggestions = handle.getStateFlow(viewModelScope, "suggestions", countries)
+    val isExpanded = handle.getStateFlow(viewModelScope, "isExpanded", false)
+
+    fun onCountryEntered(input: String) {
+        query.value = input
+
+        viewModelScope.launch(Dispatchers.Default) {
+            suggestions.value = if (input.isEmpty()) {
+                countries.also { onExpandedChange(false) }
+            } else {
+                val filteredList = countries.filter { country ->
+                    country
+                        .lowercase()
+                        .startsWith(input.lowercase()) && country != input
+                }
+                filteredList.also { onExpandedChange(true) }
+            }
+        }
+    }
+
+    fun onExpandedChange(value: Boolean) {
+        isExpanded.value = value
+    }
+
+    fun onCountrySelected(value: String) {
+        query.value = value
+    }
+
+    fun onExpandedFieldClick() {
+        onExpandedChange(!isExpanded.value)
+    }
+
+    private fun provideCountries(): List<String> {
+        val locales = Locale.getAvailableLocales()
+        val countries = ArrayList<String>()
+        for (locale in locales) {
+            val country: String = locale.displayCountry
+            if (country.trim { it <= ' ' }.isNotEmpty() && !countries.contains(country)) {
+                countries.add(country)
+            }
+        }
+        countries.sort()
+
+        return countries
+    }
+}