Это обычная функция в приложениях которые позволяют пользователям осуществлять поиск по списку с помощью панели поиска и возвращать соответствующие результаты. Символы в элементе списка, соответствующие тексту, введенному в строку поиска, будут отличаться по цвету от символов, которые не совпадают.
Единственная проблема заключается в том, что я не могу о том, как правильно реализовать эту функцию. Я разработал функцию, которая очень близка к достижению этой цели, но немного отстает.
Вот код того, чего я уже достиг.
Код: Выделить всё
val searchValue by remember {mutableStateOf(TextFieldValue(""))}
val nameList = listOf("John", "Brittany", "Rick", "Jill", "Eric", "Alex", "Aaron")
Scaffold(
topBar = {
// SEARCH BAR; THE LIST IS RECOMPOSED ON EVERY INPUT
TextField(
value = searchValue,
onValueChange = {
searchValue = it
nameList.filter { it.contains(searchValue.text, ignoreCase = true) }
})
}
) {padding ->
LazyColumn(
modifier = Modifier.padding(padding)
) {
// DISPLAYED LIST OF MATCHING NAMES
items(if (searchValue.text.isEmpty()) emptyList() else nameList.filter { it.contains(searchValue.text, ignoreCase = true) }) { name ->
Text(
// ANNOTATED STRING THAT PARSES EACH CHARACTER IN A LIST ITEM
buildAnnotatedString {
name.forEach { letterInName ->
// IF THE CHARACTER MATCHES THEN THE TEXT CHANGES TO BLUE
if (letterInName.toString() in searchValue.text) {
withStyle(style = SpanStyle(color = Color.Blue)) { append(letterInName.toString()) }
// ELSE BLACK
} else {
withStyle(style = SpanStyle(color = Color.Black)) { append(letterInName.toString()) }
}
}
}
)
}
}
}
Например, в имени «Джилл " обе буквы "L" будут выделены, даже если в строке поиска есть только одна "L". Та же проблема возникает с буквой «А» в слове «Аарон», обе буквы будут выделены независимо от их количества в строке поиска.
Как я могу решить эту проблему. Убедитесь, что выделено только количество определенных символов, введенных в строку поиска.
Спасибо, что нашли время прочитать этот вопрос.
Подробнее здесь: https://stackoverflow.com/questions/793 ... aracters-w