
flutter
文章平均质量分 56
flutter的基础实战
坚果的博客
华为开发者专家(HDE),润开鸿生态技术专家, OpenHarmony布道师,OpenHarmony校源行开源大使,InfoQ签约作者,电子发烧友鸿蒙MVP,51CTO博客专家博主,阿里云博客专家,专注于前端技术的分享,包括鸿蒙,ArkUI-X,Flutter,小程序,如果你迷茫,不妨来瞅瞅码农的轨迹,也期待你加入坚果派!
展开
-
鸿蒙原生农历查询 (Lunar Calendar)
农历查询是一款简单实用的应用,可以帮助用户查询公历日期对应的农历信息、干支纪年、宜忌、吉凶、方位等传统历法信息。应用支持多平台部署,包括Android、iOS以及鸿蒙系统。原创 2025-03-13 08:55:49 · 1084 阅读 · 1 评论 -
鸿蒙版flutter项目解析screen_brightness
是一个 Flutter 插件的平台接口,用于定义屏幕亮度控制的标准 API。它采用了 Flutter 的联合插件(federated plugins)架构,允许不同平台(Android、iOS、macOS、Windows 等)实现相同的接口。原创 2025-03-11 20:45:41 · 286 阅读 · 0 评论 -
鸿蒙版Flutter快递查询助手
一个使用Flutter开发的鸿蒙原生应用,提供便捷的快递查询服务,支持物流跟踪、短信通知和电话联系等功能。原创 2025-03-09 12:45:44 · 1072 阅读 · 0 评论 -
跨平台框架开发鸿蒙原生应用
Flutter是谷歌的高性能、跨端UI框架,可以通过一套代码,支持iOS、Android、Windows/MAC/Linux等多个平台,且能达到原生性能。Flutter也可以与平台原生代码进行混合开发。在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。React Native 是一个基于 JavaScript 和 React 框架的开源框架,用于构建原生移动应用程序。它允许开发者使用 React 的组件模型和声明式编程风格来构建跨平台的移动应用。原创 2024-11-12 08:00:37 · 926 阅读 · 0 评论 -
使用 Flutter SDK 3.22.1构建HarmonyOS应用
专注于分享的技术包括HarmonyOS/OpenHarmony,ArkUI-X,元服务,服务卡片,华为自研语言,BlueOS操作系统、团队成员聚集在北京、上海、广州、深圳、南京、杭州、苏州、宁夏等地。聚焦“鸿蒙原生应用”、“智能物联”和“AI赋能”、“人工智能”四大业务领域,依托华为开发者专家等强大的技术团队,以及涵盖需求、开发、测试、运维于一体的综合服务体系,赋能文旅、媒体、社交、家居、消费电子等行业客户,满足社区客户数字化升级转型的需求,帮助客户实现价值提升。目录,这里面存放的就是鸿蒙平台的相关代码。原创 2024-11-05 10:50:48 · 681 阅读 · 0 评论 -
flutter - sort List排序
dart中,对List结构数据进行排序今天遇到一个需求,就是根据要把已经结束的活动排在最后,新发布的,排在最前面,那么,在flutter中如何做呢,其实很简单,对List用sort排序就好注意 sort方法 会直接改变原List数组结构我是根据结束时间对其进行了排序就这样解决了问题,所以你学会了吗?...原创 2022-06-30 13:50:21 · 2800 阅读 · 0 评论 -
dart使用技巧集合
在 Dart(以及 Flutter)中生成给定范围内的随机整数的几个示例。输出:您得到的结果可能包含最小值、最大值或此范围内的值。编码:输出(输出当然是随机的,每次重新执行代码时都会改变)。您得到的结果可能会包含 min 但绝不会包含 max。为了在 Dart 中对数字进行四舍五入,我们可以使用**round()**方法。此方法返回与输入数字最接近的整数。如果无法确定最接近的整数(例如 0.5、-2.5、3.5 等),则从零舍入。例子:输出:您可以在官方文档中找到有关 round() 方法的更多原创 2022-06-17 08:34:42 · 1159 阅读 · 5 评论 -
10 个派上用场的 Flutter 小部件
尝试学习一门新语言可能会令人恐惧和厌烦。很多时候,我们希望我们知道早先存在的某些功能。在今天的文章中,我将告诉你我希望早点知道的最方便的几个Flutter小部件。Spacer 创建一个可调整的空白空间,它占据 Flex 容器中小部件之间的任何剩余空间,例如行或列。TextButton.icon在创建带有图标的按钮时,此小部件取代了使用行的需要。您必须提供图标和标签。Wrap它根据提供的方向值水平或垂直显示其子项。它可以用来代替 Gridview。这个小部件是响应式的,无需做太多就可以适应不同的屏幕尺原创 2022-06-09 08:20:19 · 621 阅读 · 0 评论 -
Flutter doctor 显示xcode没有安装的解决办法
Flutter doctor 显示xcode没有安装的解决办法按照报错信息的指导CocoaPods没有安装,那么CocoaPods 管理 Xcode 项目的库依赖项。项目的依赖项在称为 Podfile 的单个文本文件中指定。CocoaPods 将解析库之间的依赖关系,获取生成的源代码,然后在 Xcode 工作区中将它们链接在一起以构建您的项目。最终目标是通过创建一个更加集中的生态系统来提高第三方开源库的可发现性和参与度。CocoaPods 是用 Ruby 构建的,它可以使用 macOS 上可用的默认 Rub原创 2022-06-07 11:06:48 · 817 阅读 · 0 评论 -
Flutter:创建透明/半透明的应用栏
在 Flutter 中,您可以通过执行以下操作来创建透明或半透明的应用栏:如果您希望 body 的高度扩展到包含应用栏的高度并且 body 的顶部与应用栏的顶部对齐,则必须将Scaffold小部件的extendBodyBehindAppBar属性设置为true(默认值为false )。单纯的解释可能很无聊和令人困惑。以下是三个示例,涵盖了最常见的实际用例。编码:半透明应用栏截屏:编码:带有颜色渐变的半透明应用栏这个例子有点复杂。截屏:编码:结论我们已经浏览了几个关于在 Flutter 中创建透明原创 2022-06-06 08:19:58 · 2253 阅读 · 2 评论 -
Flutter如何一键唤起
如何一键唤起目前我们的项目有分享功能,想通过分享的链接实现判断用户是否已经下载,如果没有,则下载,下载了的用户则可以跳转到对应的详情页,查看详情为了方便尽可能的少写代码,在pub上发现openinstall_flutter_plugin插件openinstall插件封装了openinstall平台原生SDK,集成了 渠道统计,携带参数安装,快速安装与一键拉起 功能,目前渠道支持 H5渠道,广告平台渠道 以及 Apple Search Ads (ASA) 渠道。接下来我们就介绍如何在自己的项目中使用安装方式有原创 2022-06-02 08:03:16 · 886 阅读 · 1 评论 -
flutter doctor 不起作用
解决办法因为是用了fvm版本控制工具,加个fvm就可以了fvm flutter doctor但是这样其实是很麻烦的那么我们还有一个方式编辑~/.zshrc设置命令的别名aliases 快捷使用fvm命令alias flutter="fvm flutter"alias dart="fvm dart"使生效:source ~/.zshrc重启命令行工具。是不是好了呢,点个赞...原创 2022-05-23 17:34:16 · 447 阅读 · 0 评论 -
Flutter:AnimatedOpacity 示例
本文是关于 Flutter 中的 AnimatedOpacity 小部件。前言顾名思义,AnimatedOpacity的目的是在给定的持续时间内为其子项的不透明度设置动画:AnimatedOpacity({ Key? key, Widget? child, required double opacity, Curve curve = Curves.linear, required Duration duration, VoidCallback? onEnd, b原创 2022-05-19 08:29:10 · 796 阅读 · 0 评论 -
Flutter 中的 StatefulBuilder 小部件
本文是关于 Flutter 中的 StatefulBuilder 小部件。我将介绍小部件的基础知识,然后检查一个在实际中使用它的完整示例。、StatefulBuilder 小部件可以在这些区域的状态发生变化时仅重建某些小区域而无需付出太多努力。这提高了应用程序的性能。StatefulBuilder({ Key? key, required StatefulWidgetBuilder builderr})builder 函数有两个参数:context和一个用于在状态改变时触发重建的函数:b原创 2022-05-18 12:46:32 · 524 阅读 · 0 评论 -
Flutter & Dart:如何检查字符串是否为空
Flutter & Dart:如何检查字符串是否为空作者:坚果公众号:“大前端之旅”华为云享专家,InfoQ签约作者,OpenHarmony布道师,,华为云享专家,阿里云专家博主,51CTO博客首席体验官,开源项目GVA成员之一,专注于大前端技术的分享,包括Flutter,鸿蒙,小程序,安卓,VUE,JavaScript。在使用 Flutter 和 Dart 时,可能存在必须检查给定字符串是null还是empty的情况。假设我们的应用程序的功能仅在字符串既不为空也不为空时继续,那么我们原创 2022-05-15 17:42:11 · 4084 阅读 · 0 评论 -
在Flutter中使用WillPopScope*
在Flutter中使用WillPopScope作者:坚果公众号:“大前端之旅”华为云享专家,InfoQ签约作者,OpenHarmony布道师,,华为云享专家,阿里云专家博主,51CTO博客首席体验官,开源项目GVA成员之一,专注于大前端技术的分享,包括Flutter,鸿蒙,小程序,安卓,VUE,JavaScript。突然,在阅读特定内容时,。令人惊讶的是,您发现您的手指掠过后退按钮。页面弹出,这可能不是什么大问题,如果您可以前进到页面并从您停止的地方继续,但如果应用程序已刷新屏幕或设置为在您进原创 2022-05-14 10:32:46 · 2468 阅读 · 0 评论 -
关于Flutter的RichText组件你了解吗?
今天给大家带来的是RichText组件,他里面有个text属性,RichText显示的文本内容是TextSpan类型,他不是一个简单的string,而是TextSpan类型,TextSpan类型是一个可以无限传递的树形结构,每个节点出了text属性,还可以通过style属性,设置自定义文字样式。甚至通过children属性,传入一个TextSpan列表作为子节点,已实现叠加和嵌套文字样式的功能。然后大家有没有疑问,关于红色的这个是如何设置的,这个我可以称呼它为碰撞检测,以便完成TextSpan树中某一片段的原创 2022-05-04 08:50:58 · 1236 阅读 · 0 评论 -
Flutter 中的文本溢出的示例
Flutter 中的文本溢出的示例在 Flutter 中,Text、RichText和DefaultTextStyle小部件的溢出属性指定了如何将未显示的溢出内容通知给用户。它可以被剪裁、显示省略号(三个点)、淡入淡出或溢出到其父窗口小部件之外。可以使用TextOverflow枚举值设置溢出属性:TextOverflow.clip:截断内容区域边缘的文本,以便截断可以发生在字符中间。TextOverflow.ellipsis : 显示一个省略号 (‘…’) 来表示剪切的文本。省略号显示在内容区域内原创 2022-04-27 23:16:31 · 2788 阅读 · 0 评论 -
Dart:在循环中使用 Async 和 Await
Dart:在循环中使用 Async 和 Await在 Dart(以及 Flutter)中,您可以使用Future.forEach在循环中顺序执行同步操作。下面的示例程序将打印从 1 到 10 的数字。每次打印完一个数字,它会等待 3 秒,然后再打印下一个数字。//大前端之旅void main() async { final items = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10]; await Future.forEach(items, (item) async {原创 2022-04-21 23:22:15 · 1585 阅读 · 0 评论 -
flutter报错_needsLayout
_AssertionError (‘package:flutter/src/rendering/object.dart’: Failed assertion: line 2789 pos 12: ‘!_needsLayout’: Updated layout information required for RenderIndexedSemantics#dc6e5 NEEDS-LAYOUT to calculate semantics.)它似乎来自flutter_staggered_grid_view插原创 2022-04-14 08:33:04 · 2495 阅读 · 0 评论 -
Flutter:ExpansionTile 示例
Flutter 中的ExpansionTile小部件用于创建可扩展和可折叠的列表图块。本文将向您介绍 2 个在实践中使用该小部件的示例。第一个例子简短而简单,而第二个例子稍微复杂一些。示例 1:单个 ExpansionTile预览此示例应用程序显示一个扩展磁贴,其子项是颜色列表:编码生成上述示例的完整源代码:// main.dartimport 'package:flutter/material.dart';void main() { runApp(const MyApp());}原创 2022-04-14 08:24:15 · 2366 阅读 · 0 评论 -
flutter pub get错误pub get failed和Downloading CanvasKit问题
flutter pub get错误pub get failed和Downloading CanvasKit问题这种问题一般都是网络问题以macOS 或者与 Linux 相近的系统为例,$ export PUB_HOSTED_URL=https://pub.flutter-io.cn$ export FLUTTER_STORAGE_BASE_URL=https://storage.flutter-io.cn然后source就好了,所以你学会了吗?...原创 2022-04-08 11:30:36 · 1498 阅读 · 0 评论 -
在 Flutter 和 Dart 中取消 Future 的 3 种方法
在 Flutter 和 Dart 中取消 Future 的 3 种方法作者:坚果公众号:“大前端之旅”华为云享专家,InfoQ签约作者,阿里云专家博主,51CTO博客首席体验官,开源项目GVA成员之一,专注于大前端技术的分享,包括Flutter,小程序,安卓,VUE,JavaScript。本文将引导您了解在 Flutter 和 Dart 中取消 future 的 3 种不同方法。使用异步包(推荐)async包由 Dart 编程语言的作者开发和发布。它提供了dart:async风格的实用程序来原创 2022-04-05 21:04:19 · 3656 阅读 · 2 评论 -
在 Flutter 中使用 NavigationRail 和 BottomNavigationBar
在 Flutter 中使用 NavigationRail 和 BottomNavigationBar作者:坚果公众号:“大前端之旅”华为云享专家,InfoQ签约作者,阿里云专家博主,51CTO博客首席体验官,开源项目GVA成员之一,专注于大前端技术的分享,包括Flutter,鸿蒙,小程序,安卓,VUE,JavaScript等。本文将向您展示如何使用NavigationRail和BottomNavigationBar在 Flutter 中创建****自适应布局。我们将浏览一下这个概念,然后通过一个原创 2022-03-14 08:31:06 · 1684 阅读 · 0 评论 -
Flutter Web 应用程序的 URL 中删除前导`#`
接上文作者:坚果公众号:“大前端之旅”华为云享专家,InfoQ签约作者,阿里云专家博主,51CTO博客首席体验官,开源项目GVA成员之一,专注于大前端技术的分享,包括Flutter,小程序,安卓,VUE,JavaScript。然后大家是不是发现上面有个# ,说实话,我看着也很烦,那么如何解决呢,其实也简单。导入下面的包url_strategy: ^0.2.0如何安装呢?控制台运行flutter pub add url_strategyurl_strategyFlutter 应用程序原创 2022-03-07 08:44:11 · 1119 阅读 · 1 评论 -
如何使用自定义端口运行 Flutter Web
如何使用自定义端口运行 Flutter Web默认情况下,每次在localhost上启动 Flutter web 时,它都会有一个不同的端口。但是,在某些情况下,您需要设置一个固定端口(例如,当您想使用 Google 登录实现社交身份验证时)。为此,请在运行项目时使用**–web-port**标志,如下所示:flutter run -d chrome --web-port=8080截屏:...原创 2022-03-07 08:42:36 · 4324 阅读 · 0 评论 -
检查 Flutter 应用程序是否在 Web 上运行
您可以使用基础库中的kIsWeb常量检查您的 Flutter 应用程序是否在 Web 浏览器上运行import 'package:flutter/material.dart';import 'package:flutter/foundation.dart';void main() { runApp(const MyApp());}class MyApp extends StatelessWidget { const MyApp({Key? key}) : super(key: key原创 2022-03-03 15:02:46 · 1851 阅读 · 0 评论 -
resamplingEnabled属性
GestureBinding.instance.resamplingEnabled = true;通过将其设置为 true,为触摸设备启用指针事件重采样。重采样会以增加一些延迟为代价使触摸事件处理更加顺畅。具有低频传感器或频率不是显示频率倍数的设备(例如,120Hz 输入和 90Hz 显示)会受益于此。这通常在应用程序初始化期间设置,但可以动态调整,以防应用程序只需要重新采样一段时间。...原创 2022-02-28 10:01:26 · 635 阅读 · 0 评论 -
如何在Dart中读取控制台输入/ stdin?
如何在Dart中读取控制台输入/ stdin?import 'dart:io';void main(){ stdout.write("请输入: "); var name = stdin.readLineSync(); stdout.write(name);}请输入: 1111默认情况下 readLineSync() 将输入作为字符串。但是如果你想要整数输入,那么你必须使用 parse() 或 tryparse()。import 'dart:async';import 'dar原创 2022-02-23 07:59:25 · 2348 阅读 · 0 评论 -
一个统计编码时长的Vscode插件神器
Vscode插件之推荐一个统计编码时长的插件神器作者:坚果公众号:“大前端之旅”华为云享专家,InfoQ签约作者,阿里云专家博主,51CTO博客首席体验官,开源项目GVA成员之一,专注于大前端技术的分享,包括Flutter,小程序,安卓,VUE,JavaScript。大家看到这个图片是不是蛮有意思的那么这是一款咋样的插件呢?可以先来看一看他运行时的样子最后给大家介绍一下他的名字Time Master对的,就是下图这个大家可以下载了体验一下,还是蛮有意思的....原创 2022-02-22 13:53:17 · 4068 阅读 · 0 评论 -
Dart - 如何对 Map 的键进行排序
import "dart:collection";main() { final SplayTreeMap<String, Map<String,String>> st = SplayTreeMap<String, Map<String,String>>(); st["yyy"] = {"should be" : "3rd"}; st["zzz"] = {"should be" : "last"}; st["aaa"] = {原创 2022-02-22 08:09:17 · 2466 阅读 · 0 评论 -
用于显示本地通知的跨平台插件flutter_local_notifications
用于显示本地通知的跨平台插件。https://pub.flutter-io.cn/packages/flutter_local_notifications在这里插入图片描述原创 2022-02-13 12:12:34 · 1799 阅读 · 0 评论 -
Flutter监听音量实现波形可视化的音频
关于下图这个大家采用的下面的那个插件?just_audiojust_audio 是一款功能丰富的音频播放器,适用于 Android、iOS、macOS 和 web。https://pub.flutter-io.cn/packages/just_audiojust_waveform该插件从可用于呈现波形可视化的音频文件中提取波形数据。https://pub.flutter-io.cn/packages/just_waveformaudio_wave带有动画的多用途简单条形图。它是高度可原创 2022-02-13 11:47:59 · 5476 阅读 · 0 评论 -
Flutter web问题:Failed to load network image
Flutter web问题:Failed to load network image我的解决办法:flutter build web --release --web-renderer htmlflutter run --web-renderer htmlflutter run -d chrome --web-renderer html预览图:原创 2022-01-14 13:14:23 · 2530 阅读 · 3 评论 -
2022年为什么要使用Flutter构建应用程序?
今天每个人都想构建一个应用程序,但是谁又能责怪他们呢?事实上,如今每个人都拥有智能手机,它已迅速成为我们白天最常使用的工具。当我们没有它们时,我们会感到缺少一些东西,我们甚至把它们带到洗手间,我们甚至想不出没有它们,如何出门。无论我们喜欢与否,它对我们生活都在进行最快,最积极的影响.原创 2022-01-14 08:01:42 · 598 阅读 · 0 评论 -
最新Flutter 微信分享功能实现
Flutter 微信分享功能实现Flutter 用来快速开发 Android iOS平台应用,在Flutter 中,通过 fluwx或者fluwx_no_pay 插件来实现微信分享功能主要还是看自己的需求,本示例我将按照没有支付的实现。至于为什么,主要是ios打包提审比较麻烦。那么接下来就看一下如何实现吧,1.首先去pub官网https://pub.flutter-io.cn/查找这两个包fluwx_no_pay或者fluwx安装方式有两种:flutter pub add原创 2022-01-10 08:45:45 · 4395 阅读 · 4 评论 -
Flutter:使用复选框进行下拉多选
Flutter:使用复选框进行下拉多选本文向您展示了在 Flutter 中使用复选框实现下拉多选的两种不同方法。在第一种方法中,我们将从头开始构建多选。在第二种方法中,我们将使用第三方包快速完成工作。从头开始使用复选框创建多选应用预览我们将要构建的应用程序有一个专业的、功能齐全的多选小部件,可显示选项列表。可以通过选中/取消选中与其关联的复选框来选择或取消选择一个选项。当按下升高的按钮时,将显示多选对话框。它让用户在编程中选择他们最喜欢的主题。所选主题将作为筹码显示在屏幕上。以下是我们的应用程原创 2022-01-03 10:04:05 · 3401 阅读 · 2 评论 -
Flutter 完美的验证码输入框(2 种方法)
Flutter 完美的验证码输入框(2 种方法)本文向您展示了在 Flutter 中实现完美的验证码输入框几种不同方法。重点是什么?真实世界的 完美的验证码输入框或 PIN 输入 UI 通常满足以下最低要求:有4个或6个文本域,每个文本域只能接受1个字符(通常是一个数字)输入数字后自动聚焦下一个字段您经常在需要电话号码确认、电子邮件或双因素身份验证的应用程序中看到此功能。从头开始制作 OTP 字段应用预览此示例创建一个简单的 OTP 屏幕。首先,聚焦第一个输入字段。当您输入一个数字时原创 2021-12-24 08:24:26 · 6507 阅读 · 1 评论 -
Flutter中实现整个App变为灰色
前言为了让更多的人永远记住12月13日,各大厂都在这一天将应用变灰了。那么接下来我们看一下Flutter是如何实现的。Flutter中实现整个App变为灰色在Flutter中实现整个App变为灰色是非常简单的,只需要在最外层的控件上包裹ColorFiltered,用法如下:ColorFiltered(颜色过滤器)看名字就知道是增加颜色滤镜效果的,ColorFiltered( colorFilter:ColorFilter.mode(Colors.grey, BlendMode.原创 2021-12-13 09:10:12 · 7364 阅读 · 3 评论 -
Dart Hello World 示例程序【Dart专题1】
大家好,我是坚果,公众号“坚果前端”,关注我公众号,获取更多细节Dart Hello World 示例程序Dart—你好世界在本教程中,我们将编写一个非常基本的 Dart 程序。此示例程序打印Hello World到控制台。打开文本编辑器并粘贴以下代码。void main(){ print('Hello World');}将文件另存为hello.dart 或some_file_name_you_like.dart。让我们继续hello.dart。打开命令提示符并转到hello.d原创 2021-12-07 13:07:29 · 583 阅读 · 1 评论