Flutter开发 -写一个历史记录的页面

最新推荐文章于 2025-03-06 15:03:02 发布
最新推荐文章于 2025-03-06 15:03:02 发布
阅读量913 收藏
点赞数
分类专栏： Flutter实用开发技巧合集 文章标签： 历史记录 flutter历史记录 flutter
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.youkuaiyun.com/CodingFire/article/details/108757984
版权
本文介绍了如何在Flutter中创建一个历史记录页面，重点使用Wrap组件实现自动换行的效果。通过Chip组件展示记录，调整样式，并展示了相关代码示例。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

首先，大家先看一下效果图：
在这里插入图片描述

看起来就是一行行的显示，但是小伙伴千万不要觉得使用Row就能解决，还涉及到换行呢，你总不至于要一个个算长度来换行吧？所以这里推荐使用Wrap，来看下Wrap部分怎么使用：

Wrap(
        spacing: 12.0, // 主轴(水平)方向间距
        runSpacing: 0, // 纵轴（垂直）方向间距
了解本专栏 订阅专栏 解锁全文 超级会员免费看
flutter 实现搜索历史功能，缓存记录
studer_rui的博客
05-31 644
// 保存搜索记录。
京东 8 Flutter 存储搜索历史记录 删除历史 记录 清空历史记录（还没看完）
weixin_38107457的博客
02-19 740
https://pub.dev/packages/shared_preferences
Flutter SearchDelegate 带搜索历史记录
丿灬安之若死
04-07 1171
class searchBarDelegate extends SearchDelegate { @override void showResults(BuildContext context) { super.showResults(context); if (query == "") { return; } const sufix = "asdasdas56"; var data = []; var history = SpUtil..
flutter购物商城搜索界面（热搜，历史记录）
m0_46527751的博客
03-10 1447
flutter购物商城搜索界面 这里数据是固定的，没有从后端获取，仅仅展示页面效果 // ignore_for_file: prefer_const_constructors, sized_box_for_whitespace, prefer_const_literals_to_create_immutables, avoid_unnecessary_containers import 'package:flutter/material.dart'; import 'package:flutterjds
Flutter-防京东商城项目-保存搜索历史记录-17
weixin_38716347的博客
09-02 438
一直觉得自己写的不是技术，而是情怀，一个个的教程是自己这一路走来的痕迹。靠专业技能的成功是最具可复制性的，希望我的这条路能让你们少走弯路，希望我能帮你们抹去知识的蒙尘，希望我能帮你们理清知识的脉络，希望未来技术之巅上有你们也有我。 1.导入第三方： shared_preferences: ^0.5.3+1 2.导入封装好的库 import 'package:shared_preferences/shared_preferences.dart'; class Storage{ static Fut
每天一个Flutter开发小项目 (3) : 高效Flutter学习与产出 - 构建简易天气应用
堇以无笙的博客
02-24 1193
希望本篇博客不仅帮助您掌握了天气应用的开发技能，更重要的是，掌握了高效学习 Flutter 的方法，这将对您未来的 Flutter 学习之路大有裨益。今天，我们将更进一步，探讨。在开始构建天气应用之前，我们先来探讨一些高效学习Flutter的方法，这些方法将贯穿我们整个项目构建过程，帮助您更高效地学习和掌握Flutter。在开发过程中，我们会经常用到一些重复性的代码片段，例如，Widget的基本结构、网络请求的模板代码等。现在，我们将应用上述高效学习方法，一步步构建我们的简易天气应用。
每天一个Flutter开发小项目 (13) : 本地数据随心存取 - 构建SQLite ToDo 应用，掌握Flutter本地数据库操作
最新发布
堇以无笙的博客
03-06 1398
通过这个项目，您不仅掌握了 Flutter 应用集成 SQLite 数据库、实现 CRUD 操作的核心流程和关键插件的使用方法，更重要的是，学会了如何运用本地数据库技术实现数据持久化，打造数据驱动、功能更完善的 Flutter 应用。不知不觉，我们已经携手走过了十二篇博客，从绚丽的动画效果到强大的地图定位，相信您已经掌握了丰富的 Flutter 开发技能，能够构建各种功能的应用界面。然而，一个功能完善的应用，不仅要拥有精美的 UI 界面和流畅的用户体验，更要具备。的应用，数据持久化更是必不可少。
Flutter-Youbike:尝试建立一个项目，在iOS和Android移动系统上为您的摩托车加油站提供Flutter功能
04-14
下面将详细介绍如何使用Dart语言和Flutter工具来构建这样一个应用。 首先，Flutter是Google推出的一款开源UI工具包，它允许开发者使用单一代码库创建美观且性能卓越的原生应用。Dart语言作为Flutter的主要编程语言...
flutter-projects
03-10
在实际项目中，版本控制工具如Git经常被用来管理代码，因此在"flutter-projects-master"中可能包含一个.git文件夹，记录了项目的版本历史和协同编辑的信息。 总的来说，"flutter-projects"可能是一个综合性的学习...
Flutter-Grocery
03-27
【Flutter-Grocery】是一个基于Dart编程语言的开源项目，专为开发移动应用程序而设计，特别是针对购物应用。这个项目充分利用了Flutter框架的优势，提供了一整套完整的解决方案，包括前端用户界面、交互逻辑以及可能...
flutter-expandable:Flutter小部件，可由用户展开或折叠
05-02
可扩展的 Flutter小部件，可由用户展开或折叠。 介绍 该库有助于实现Material Design规定的可扩展行为： 请勿将Expandable与混淆。 ExpansionPanel是Flutter材质库的一部分，仅可在ExpansionPanelList中使用，不能用于制作其他小部件，例如可扩展Card部件。 用法 制作可扩展小部件的最简单方法是使用ExpandablePanel ： class ArticleWidget extends StatelessWidget { final Article article; ArticleWidget ( this .article); @override Widget build ( BuildContext context) { return ExpandablePanel ( header
17 Flutter仿京东商城项目 保存历史搜索记录 删除历史记录 清空历史记录 长按删除...
weixin_30522095的博客
09-03 963
Storage.dart import 'package:shared_preferences/shared_preferences.dart'; class Storage{ static Future<void> setString(key,value) async{ SharedPreferences sp=await SharedPrefere...
Flutter Webview多层嵌套 处理回退历史
weixin_40570474的博客
05-05 950
在 App 开发中，我们总会遇到使用 WebView 的情况， 比如 我们打开了 网页A，然后点击 A 中的链接跳转到 B。如果这个时候，我们按一下系统的返回键，预期的应该是 返回A，而不是推到一个 Native 页面。但事实就是，如果你没有经过特殊处理，那么很有可能就不是预期的效果(B –> A)。不过还在我们只需要简单修改代码，就能解决。再次明确一下，我们的预期。
flutter：实现一个简单的appBar上的搜索框、一个简单的搜索历史
weixin_41897680的博客
07-03 3277
flutter：实现一个简单的appBar上的搜索框
flutter入门之实现登陆页面的记住历史登录账号功能
热门推荐
不忘初心
01-10 1万+
    【原创不易，转载请注明出处：https://blog.youkuaiyun.com/email_jade/article/details/86220592】     切换账号在移动app中应用的场景非常多，记住账号功能在Android或者IOS中有大量的开源代码，今天，我们就用flutter来实现一个能够记录历史登录账号的Demo吧，以下是效果演示：     实现思路：     1. sha...
Flutter输入框下方弹出历史下拉选择PopWindow(输入框不失去焦点)
Monster的博客
12-08 736
Flutter中TextField输入的同时弹出Pop，点击Pop输入框不失去焦点
flutter小记（5）
qq_44592406的博客
03-25 141
搜索历史记录的实现 用constrainedbox限制最小高度实现，而没有最大高度来实现 ConstrainedBox( constraints: BoxConstraints( minWidth: double.infinity, //宽度尽可能大 minHeight: height[i], ), child: Container( padding: EdgeInsets.only(bottom: 30), c
Flutter组件--搜索页面布局(Wrap组件)
eastWind1101的博客
10-15 409
搜索页面布局(Wrap组件)
flutter 搜索组件，带流式布局搜索记录
晓风残叶
12-24 1825
流式布局wrap,flutter中文网 代码： import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; import 'package:monitor/common/style/style_custom.dart'; class DeviceSearchPage ex...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

CodingFire

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值