Kotlin Compose 搜索栏答案

【问题标题】：Kotlin Compose Search BarKotlin Compose 搜索栏
【发布时间】：2021-09-14 20:27:53
【问题描述】：

我对如何在我的 Compose 应用程序中实现搜索栏有一些疑问。我从传递state 值的ContactContent 函数调用我的SeachView 函数。

@Composable
fun ContactContent(navigateToProfile: (Contact) -> Unit) {
    val contacts = remember { DataProvider.contactList }
    val textState = remember { mutableStateOf(TextFieldValue("")) }
    Column(){
        SearchView(textState)
        LazyColumn() {
            items(
                items = contacts,
                itemContent = {
                    ContactListItem(contact = it, navigateToProfile)
                }
           ...
   }

在SearchView我不知道我应该如何调用onImeActionPerformed搜索状态，因为我的搜索状态无法识别。

@Composable
fun SearchView(state: MutableState<TextFieldValue>) {
    Surface(){
        TextField(
            value = state.value,
            onValueChange = { value -> state.value = value},
            leadingIcon = {...},
            keyBoardOptions = KeyboardOptions(
                keyboardType = KeyboardType.Text,
                imeAction = ImeAction.Search
            ),
            onImeActionPerformed = {action, softKeyboardController -> if (action == ImeAction.Search){
                >HERE IS WHERE I AM NOT SURE WHAT TO DO<
                DataProvider.newSearch(textState)
            }
     ...
}

新的搜索功能 sn-p

fun newSearch (textState: MutableState<String>){
val result = repository.search(
      token = token,
      page = 1,
      query = "chicken"
  )
  DataProvider.value = result
}

也许您有不同的解决方案，如何使用 Kotlin Compose 从列表中实现搜索栏。

【问题讨论】：

这是一个如何从文本状态中获取文本值的问题？ textState.value.text
是的，但是当我添加它时，我确实得到了 SearchView() 中的“@Composable 调用只能在 @Composable 函数的上下文中发生”错误
显示DataProvider.newSearch函数
好的，我已经添加了newSearch功能，你也需要DataProvider对象列表吗？
你的错误看起来像一个错字，没有整个项目很难说..

标签： kotlin android-jetpack-compose

【解决方案1】：

不要直接在onImeActionPerformed的括号中使用它，在调用TextField之前将其提取到父Composable中。将其存储在 val 中，然后在 onImeActionPerformed 中使用该 val。另外，我假设您正在使用() -> Unit 之类的东西创建该参数，好吧，所以我不确定，但我认为将其更改为@Composable () -> Unit，您可以直接访问它而无需先将其提取到 val 中。试试看

【讨论】：