Flutter SearchDelegate 带搜索历史记录

最新推荐文章于 2024-03-26 03:35:40 发布

安果移不动

最新推荐文章于 2024-03-26 03:35:40 发布

阅读量1k

点赞数

分类专栏： 042Flutter

独学而无友，则孤陋寡闻。q群582951247

本文链接：https://blog.csdn.net/mp624183768/article/details/115474763

版权

042Flutter 专栏收录该内容

135 篇文章 26 订阅

订阅专栏

这个博客展示了如何创建一个自定义的搜索栏组件，包括搜索历史的存储和加载。使用了sp_util库来处理本地数据存储，并在用户输入时提供实时建议。搜索历史限制为10项，新查询会替换最旧的条目。此外，还实现了清除搜索内容、关闭搜索页面以及搜索结果展示等功能。

摘要由CSDN通过智能技术生成

class searchBarDelegate extends SearchDelegate {
  @override
  void showResults(BuildContext context) {
    super.showResults(context);
    if (query == "") {
      return;
    }
    const sufix = "asdasdas56";
    var data = [];
    var history = SpUtil.getString("histry");
    if (history == null) {
      history = "";
    }
    data = history.split(sufix);

    while (data.length >= 10) {
      data.removeAt(0);
    }
    if (!data.contains(query)) {
      data.add(query);
      SpUtil.putString("histry", data.join(sufix).toString());
    }

    SpUtil.putString("search", query);
    Navigator.of(context).pop(query);
  }

  // 搜索条右侧的按钮执行方法，我们在这里方法里放入一个clear图标。 当点击图片时，清空搜索的内容。
  @override
  List<Widget> buildActions(BuildContext context) {
    return [
      IconButton(
        color: Colors.blue,
        icon: Icon(Icons.clear),
        onPressed: () => {
          if (query == "") {close(context, null)} else {query = ""}
        },
      )
    ];
  }

  // 搜索栏左侧的图标和功能，点击时关闭整个搜索页面
  @override
  Widget buildLeading(BuildContext context) {
    return IconButton(
      color: Colors.blue,
      icon: AnimatedIcon(
          icon: AnimatedIcons.menu_arrow, progress: transitionAnimation),
      onPressed: () => close(context, null),
    );
  }

  // 搜索到内容了
  @override
  Widget buildResults(BuildContext context) {
    //缓存下来记录
    return Center(
      child: Container(
        child: Card(
          color: Colors.redAccent,
          child: Text(query),
        ),
      ),
    );
  }

  // 输入时的推荐及搜索结果
  @override
  Widget buildSuggestions(BuildContext context) {
    const sufix = "asdasdas56";
    var history = SpUtil.getString("histry");
    if (history == null) {
      history = "";
    }
    var searchHistory = history
        .split(sufix)
        .reversed
        .where((element) => element != '')
        .toList();

    final suggestionList = query.isEmpty
        ? searchHistory
        : [].where((input) => input.startsWith(query)).toList();
    return ListView.builder(
      itemCount: suggestionList.length == 0 ? 0 : suggestionList.length,
      itemBuilder: (context, index) => ListTile(
        title: RichText(
          text: TextSpan(
              text: suggestionList[index].substring(0, query.length),
              style:
                  TextStyle(color: Colors.black, fontWeight: FontWeight.bold),
              children: [
                TextSpan(
                    text: suggestionList[index].substring(query.length),
                    style: TextStyle(color: Colors.grey))
              ]),
        ),
      ),
    );
    ;
  }
}

使用到了第三方