Flutter未知功能插件findo的探索使用

发布于 1周前 作者 yibo5220 来自 Flutter

Flutter未知功能插件findo的探索使用

Findo将为您的搜索操作提供防抖功能。当用户在findofield中输入时,它不会直接发送请求。该字段会等待用户停止输入一段时间(默认时间300毫秒,但如果您想自定义持续时间,可以在构造函数中声明)。

特性

防抖 - 可取消

主要使用文本字段进行搜索,但如果您直接使用TextField并配合onChange,这将消耗更多的资源。您可以指定多长时间调用一次搜索,然后findo将在指定时间内返回结果。

FindoField(duration: Duration(seconds: 100), onChanged: .. ),

开始使用

我只使用了async包来实现此库。

使用方法

void _fetchSearch(String value) {
  // 每300毫秒调用一次
  _samples.where((element) => element.contains(value));
}

[@override](/user/override)
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: FindoField(
        duration: Duration(seconds: 100),
        onChanged: (value) {
          _fetchSearch(value);
        },
      ),
    ),
  );
}

其他信息

这个包虽然很小,但非常有用。如果您想要添加修复、功能或其他内容,随时可以提交PR,我很乐意审核。


完整示例Demo

以下是一个完整的示例代码,展示了如何使用findo插件。

import 'package:flutter/material.dart';
import 'package:findo/findo.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Material App',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Material App Bar'),
        ),
        body: Center(
          child: Container(
            child: Text('Hello World'),
          ),
        ),
      ),
    );
  }
}

class HomeView extends StatefulWidget {
  const HomeView({Key? key}) : super(key: key);

  [@override](/user/override)
  State<HomeView> createState() => _HomeViewState();
}

class _HomeViewState extends State<HomeView> {
  List<String> _samples = ['you', 'need', 'to', 'backend', 'service'];

  void _fetchSearch(String value) {
    // 每300毫秒调用一次
    _samples.where((element) => element.contains(value));
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: FindoField(
          duration: Duration(seconds: 100),
          onChanged: (value) {
            _fetchSearch(value);
          },
        ),
      ),
    );
  }
}

更多关于Flutter未知功能插件findo的探索使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html

回到顶部