美文网首页Flutter
Android flow 搜索框防抖处理

Android flow 搜索框防抖处理

作者: goodl | 来源:发表于2021-09-12 11:09 被阅读0次

场景:在搜索框中输入内容,实时进行搜索,结果以列表形式展现。

搜索时,为了避免产生无意义的搜索请求,通常会进行限流处理。熟悉 RxJava 的同学,一定会知道怎么做,各种天花乱坠的操作符让你眼花缭乱。

这里采用 flow 的方式,不多说,直接上代码:

import android.text.Editable
import android.text.TextWatcher
import android.widget.EditText
import kotlinx.coroutines.ExperimentalCoroutinesApi
import kotlinx.coroutines.channels.awaitClose
import kotlinx.coroutines.channels.onFailure
import kotlinx.coroutines.flow.Flow
import kotlinx.coroutines.flow.callbackFlow

@ExperimentalCoroutinesApi
fun EditText.onTextChangedFlow() = callbackFlow {
    val watcher = object : TextWatcher {
        override fun beforeTextChanged(s: CharSequence?, start: Int, count: Int, after: Int) {}
        override fun onTextChanged(s: CharSequence?, start: Int, before: Int, count: Int) {}
        override fun afterTextChanged(s: Editable?) {
            s?.let { value -> trySend(value).onFailure { e -> e?.printStackTrace() } }
        }
    }

    addTextChangedListener(watcher)
    awaitClose { removeTextChangedListener(watcher) }
}



使用姿势:

lifecycleScope.launch {
    mBinding.edit.onTextChangedFlow()
        .debounce(200)
        .filter { it.isNotEmpty() }
        .distinctUntilChanged()
        .catch { print(it.message) }
        .flowOn(Dispatchers.IO)
        .collect {
            // 网络请求获取搜索结果
        }
}



这时候 AndroidStudio 会有警告:

textChangedFlow警告1.png textChangedFlow警告2.png

不用太在意,强迫症可以在 build.gradle 中添加如下代码消除警告:

kotlinOptions {
    jvmTarget = '1.8'

    // 移除试验性和预览的 Api 警告
    freeCompilerArgs += "-Xopt-in=kotlinx.coroutines.ExperimentalCoroutinesApi"
    freeCompilerArgs += "-Xopt-in=kotlinx.coroutines.FlowPreview"
}

相关文章

  • Android flow 搜索框防抖处理

    场景:在搜索框中输入内容,实时进行搜索,结果以列表形式展现。 搜索时,为了避免产生无意义的搜索请求,通常会进行限流...

  • 深入JavaScript Day32 - 手写防抖函数debou

    一、防抖函数代码实现 防抖:适用于高频函数的【延迟执行】,比如搜索框的联想功能 0、测试代码 1、最基本的防抖函数...

  • 函数节流与函数防抖

    函数节流 适用场景:按钮防重复点击 函数防抖 适用场景:input输入框搜索

  • 防抖函数及其应用

    移动端会有一个搜索框,输入的时候就会在输入框下面弹出搜索结果 这个情况就会用到防抖dom 首先,创建一个防抖函数 ...

  • 有关vue的常见面试题(上)

    一:防抖节流 防抖:一个频繁触发的函数,在规定时间内,只让最后一次生效,前面的不生效。例:防抖经常用在我们搜索框输...

  • 前端函数防抖(debounce)和函数节流(throttle)

    什么是防抖和节流: 比如搜索框,用户在输入的时候使用change事件去调用搜索,如果用户每一次输入都去搜索的话,那...

  • debounce搜索防抖函数封装

    应用场景:需要频繁请求的地方,例如搜索框搜索 使用第三方框架 underscore.js解决防抖_.debounc...

  • JS防抖和节流

    一、什么是防抖和节流 Ps: 比如搜索框,用户在输入的时候使用change事件去调用搜索,如果用户每一次输入都去搜...

  • web前端面试2

    1 搜索请求如何处理(防抖) 2 搜索请求中文如何请求 前台需要对中文参数进行编码,调用js方法encodeURI...

  • 弱鸡教你搜索框节流防抖

    如果有个需求,用户在搜索框里的,只要搜索框里面的内容变动,就进行异步请求,就理来说这个功能简单的不行。 用户每输入...

网友评论

    本文标题:Android flow 搜索框防抖处理

    本文链接:https://www.haomeiwen.com/subject/nhnzwltx.html