dart 如何检测用户已停止在TextField中键入?

y1aodyip  于 2023-07-31  发布在  其他
关注(0)|答案(4)|浏览(113)

我用的是TextField下的onChanged函数
我正在调用我的代码,但现在的问题是,每次输入或删除一个新词时,代码都会执行。
我正在寻找的是如何识别用户何时停止键入
意味着增加一些延迟或类似的东西。
我也尝试使用Future.delayed函数添加delay,但该函数也执行了n次。

TextField(
   controller: textController,
   onChanged: (val) {
            if (textController.text.length > 3) {
              Future.delayed(Duration(milliseconds: 450), () {
                 //code here
              });
            }
            setState(() {});
          },
 )

字符串

jhdbpxl9

jhdbpxl91#

我在这个link里找到了这么轻的东西
它定义此类

class Debouncer {
  final int milliseconds;

  Timer? _timer;

  Debouncer({this.milliseconds=500});

  run(VoidCallback action) {
    if (null != _timer) {
      _timer!.cancel();
    }
    _timer = Timer(Duration(milliseconds: milliseconds), action);
  }
}

字符串
此示例将帮助您更多

TextField(
     decoration: new InputDecoration(hintText: 'Search'),
     onChanged: (string) {
       _debouncer.run(() {
       print(string);
       //perform search here
       });
     },
   ),

2nbm6dog

2nbm6dog2#

感谢@pskink
我能够实现我正在寻找的功能。
pubspec.yaml中导入stream_transform包
stream_transform: ^0.0.19

import 'package:stream_transform/stream_transform.dart';

StreamController<String> streamController = StreamController();

@override
void initState() {
  streamController.stream
    .transform(debounce(Duration(milliseconds: 400)))
    .listen((s) => _validateValues());

  super.initState();
}

//function I am using to perform some logic
_validateValues() {
  if (textController.text.length > 3) {
     // code here
  }else{
     // some other code here
  }
}

字符串
TextField代码

TextField(
   controller: textController,
   onChanged: (val) {
        streamController.add(val);
     },
)

ru9i0ody

ru9i0ody3#

在我的情况下,我也需要flutter async。

//pubspec.yaml
stream_transform: ^2.0.0

import 'dart:async';
import 'package:stream_transform/stream_transform.dart';

StreamController<String> streamController = StreamController();

// In init function
streamController.stream
    .debounce(Duration(seconds: 1))
    .listen((s) => { 
       // your code 
     });

// In build function
TextField(
   style: TextStyle(fontSize: 16),
   controller: messageController,
   onChanged: (val) {
     myMetaRef.child("isTyping").set(true);
     streamController.add(val);
     },
   )

字符串

zvms9eto

zvms9eto4#

我知道现在很晚了。在我的情况下,我需要检查注册过程中的电子邮件的可用性,并需要显示相关的消息给用户时,用户停止键入文本字段的电子邮件。您需要创建一个计时器,并在每次用户在文本字段中键入内容时重置它。代码如下:

Timer? _checkTypingTimer;

startTimer() {
    _checkTypingTimer = Timer(const Duration(milliseconds: 600), () {//set your desired duration
      //perform your logic here
      //i was calling the method here which checks if the email is available or not
    });
  }

resetTimer() {
    _checkTypingTimer?.cancel();
    startTimer();
  }

字符串
现在在textfield的onChanged方法中调用这个resetTimer方法。不要忘记导入dart:async

注意:上面给出的答案是 *medium链接 *,即“debouncer one”,可能会不必要地调用代码多次

相关问题