首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

干货 | 携程火车票Flutter最佳实践

同时最好复写dispose()和notifyListeners()方法,防止用户在调用数据时销毁界面,而等到数据获取到以后通知界面刷新导致Crash。...异步任务结束在页面被销毁之后,没有检查State是否还是mounted状态,继续setState()就会出现这个错误。...1)错误展示信息 BoxConstraints has a negative minimum width; 2)错误分析 这种情况一般出现在需要获取屏幕宽度,根据屏幕宽度减去另外一个组件的宽度,用来设置另外一个组件的宽度导致...,在一些计算速度比较低的手机,可能获取到的屏幕宽度为0,这样就会导致你的组件的宽度为负数,报出错误异常。...1)错误信息展示 Null check operator used on a null value; 2)错误分析 一般情况下出现这种问题是由于界面销毁后,继续调用notifyListeners()方法通知界面刷新引起的

2.2K30

Flutter - 检查 Internet 连接示例

Flutter - 检查 Internet 连接示例 本教程为您提供了如何在 Flutter 中检查互联网连接的示例。 有时,您可能想要检查运行您的应用程序的设备的互联网连接。...如果应用程序是使用 Flutter 开发的,您可以阅读本教程中的示例。 码字不易,点个赞,点亮再看,支持一下。...本实例flutter版本2.5.3,开启空安全 使用connectivity_plus包 有一个来自 Flutter Community的connectivity_plus包,可以轻松获取当前网络状态。...在函数内部,您可以处理连接状态发生变化时要执行的操作。确保您在不再使用时取消订阅,这可以在 dispose 方法中完成。 ConnectivityResult?...在 Flutter 中,可以通过使用 dart:io 包来完成。它具有 InternetAddress.lookup 方法,可用于执行地址查找。因此,您需要通过传递有效且可访问的主机来调用该方法。

2.1K20
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    那些初学者实践 Flutter 最常出现的错误

    哔哩哔哩漫画APP实践Flutter 也有大半年时间了,我针对线上收集到的错误进行分析,挑选出了一些有一般代表性的错误,列在本文,可供实践 Flutter 的初学者们作为一点参考。...异步任务结束在页面被pop之后,但没有检查State 是否还是 mounted,继续调用 setState 就会出现这个错误。...示例代码 在某个方法里获取网络数据,为了更好的提示用户,会先弹一个 loading 窗,之后再根据数据执行别的操作... // show loading dialog on request data showDialog...典型错误三:ScrollController 里薛定谔的 position 在获取ScrollController的position、offset,或者调用jumpTo()等方法时,常出现StateError...const {}); } 总结 综上所述,这些典型错误,都不是什么疑难杂症,而是不理解或者不熟悉 Flutter 和 Dart 语言所导致的,关键是要学会容错处理。

    3K21

    Flutter完整开发实战详解(二、 快速开发实战篇)

    顶部TabBar效果   在 TabBar 页面中,一般还会出现:父页面需要控制 PageView 中子页的需求。这时候就需要用到GlobalKey了。...继续上一小节中的 _buildProgressIndicator方法实现,通过 flutter_spinkit 可以快速实现更不一样的 Loading 样式。...也就是你可以通过 Navigator 的 pop 时返回参数,之后在 Future 中可以的监听中处理页面的返回结果。...大家都知道在 Flutter 中 ,是通过实现 State 与 setState 来渲染和改变 StatefulWidget 的。如果使用了flutter_redux 会有怎样的效果?  ...如果结合网络请求,通过闭包实现,在需要数据库时先返回数据库,然后通过 next 方法将网络请求的方法返回,最后外部可以通过调用next方法再执行网络请求。

    5.2K10

    【Flutter 专题】119 图解简易 ACEFrameAnimated 帧动画

    Widget,并通过 Future 延迟加载图片资源,其中需要注意的是循环加载,注意当前数组下标;其中在 initState() 中更新图片 _framePicList() 时,需要在 Future.delayed...之前先加载第一张图片,否则会出现短暂空白的情况; class _ACEFrameAnimatedState extends State { List<Map<ACEFramePicType...Tips 和尚在退出页面时出现内存溢出,导致原因有两个,第一个是未清除 Widget 中的资源列表;第二个是 Future.delayed 发送消息后,await 导致消息未返回; E/flutter...和尚根据提示在使用 setState 时先判断当前 State 是否已绑定在 View 中;同时在 dispose 中清空资源; @override void dispose() { super.dispose...;如有错误请多多指导!

    82561

    <大厂实战经验> Flutter&鸿蒙next 中使用 initState 和 mounted 处理异步请求的详细解析

    写在前面在 Flutter 开发中,处理异步请求是常见的需求,例如从网络获取数据。理解如何在 initState 中触发异步请求,并在请求完成时使用 setState 更新 UI 是非常重要的。...因为这个方法在构造函数之后立即执行,所以它非常适合进行异步操作的启动。...它在 State 对象被插入到树中时为 true,在被从树中移除时为 false。在执行异步请求时,尤其是当请求时间较长时,可能会出现 setState 被调用时对象已被卸载的情况。...mounted 的使用场景在异步请求的回调中,我们需要检查 mounted 的值,以确定是否可以安全地调用 setState:if (mounted) { setState(() { _data...始终确保在调用 setState 之前检查 mounted 属性,这可以帮助你避免在组件卸载后更新 UI 的问题。通过遵循这些最佳实践,你将能够更有效地管理 Flutter 应用的状态,提升用户体验。

    7700

    Flutter完整开发实战详解(二、 快速开发实战篇)

    TabBar 页面中,一般还会出现:父页面需要控制 PageView 中子页的需求。...继续上一小节中的 _buildProgressIndicator方法实现,通过 flutter_spinkit 可以快速实现更不一样的 Loading 样式。...也就是你可以通过 Navigator 的 pop 时返回参数,之后在 Future 中可以的监听中处理页面的返回结果。...大家都知道在 Flutter 中 ,是通过实现 State 与 setState 来渲染和改变 StatefulWidget 的。如果使用了flutter_redux 会有怎样的效果?  ...如果结合网络请求,通过闭包实现,在需要数据库时先返回数据库,然后通过 next 方法将网络请求的方法返回,最后外部可以通过调用next方法再执行网络请求。

    5K30

    Stateful 组件的生命周期​

    生命周期二:initState initState 函数在组件被插入树中时被 Framework 调用(在 createState 之后),此函数只会被调用一次,子类通常会重写此方法,在其中进行初始化操作...didChangeDependencies 中调用也会出现异常,但和上面的异常不是同一个。...调用完 dispose后,mounted 属性被设置为 false,也代表组件生命周期的结束,此时再调用 setState 方法将会抛出异常。 子类重写此方法,释放相关资源,比如动画等。...mounted mounted 是 State 对象中的一个属性,此属性表示当前组件是否在树中,在创建 State 之后,调用 initState 之前,Framework 会将 State 和 BuildContext...因为如果当前组件未插入到树中或者已经从树中移除时,调用 setState 会抛出异常,加上 mounted 判断,则表示当前组件在树中。

    99410

    Flutter的生命周期

    生命周期二:initState 「initState」 函数在组件被插入树中时被 Framework 调用(在 「createState」 之后),此函数只会被调用一次,子类通常会重写此方法,在其中进行初始化操作...didChangeDependencies 中调用也会出现异常,但和上面的异常不是同一个。...调用 「deactivate」 之后,然后将 「State」 对象重新插入树的另一个位置。 此方法可以在每一帧中调用,此方法中应该只包含构建组件的代码,不应该包含其他额外的功能,尤其是耗时任务。...mounted 「mounted」 是 State 对象中的一个属性,此属性表示当前组件是否在树中,在创建 「State」 之后,调用 「initState」 之前,Framework 会将 「State...因为如果当前组件未插入到树中或者已经从树中移除时,调用 「setState」 会抛出异常,加上 「mounted」 判断,则表示当前组件在树中。

    1.7K30

    Flutter State生命周期

    2.2 State生命周期 前面说过了StatefullWidget,这节我们来说说State的生命周期,这在flutter开发中是非常重要的。...build 构建 会在以下场景调用: initState()之后; didUpdateWidget()之后; setState()之后。 didChangeDependencies()之后。...reassemble 重新安装 专门为了开发调试而提供的,在热重载(hot reload)时会被调用,此回调在Release模式下永远不会被调用。...didUpdateWidget 组件更新 当组件的状态改变的时候就会调用didUpdateWidget(),比如调用了setState(), 在widget重新构建时,Flutter framework...deactivate 暂停 State对象从树中被移除时(在dispose之前),会调用这个函数来将对象暂停。 dispose 销毁 当State对象被销毁时调用,通常在此回调中释放资源和移除监听。

    85020

    Flutter | 事件处理

    (Hit Test) ,以确定指针与屏幕接触的位置存在哪些 Widget,指针按下事件(以及该指针的后续事件)会被分发到由命中测试发现的最内部的组件,然后从哪里开始,事件会在组件树中向上冒泡,这些事件会从最内部的组件分发的组件树的根路径上的所有组件...delta:当用户在屏幕上滑动时,会触发多次 Update 事件,dalta 指一次 Update 事件滑动的偏移量 velocity:该属性代表用户抬起时的滑动速度(包含x,y两个轴的),上例中没有处理抬起的速度...() { //用到GestureRecognizer的话一定要调用其dispose方法释放资源 _recognizer.dispose(); super.dispose(); }...复制代码 注意:使用 GestureRecognizer 之后,一定要调用其 dispose 方法来释放资源(主要是取消内部的计时器),运行效果如下: 手势竞争与冲突 竞争 如在上例中,同时监听水平方向和垂直方向的拖动事件...对于一些简单的应用,事件总线总是奏议满足业务需求,如果觉得使用状态管理包的话,一定要想清楚 APP 是否有必要使用它,防止化简为繁的过度设计 参考 参考自 Flutter实战

    2.8K10

    flutter使用eventBus进行组件间通信

    在使用flutter开发过程中有些时候需要在组件之间进行通讯,我们可以借助eventBus来实现。...实现步骤如下: 1、导入eventBus第三方包 2、实例化EventBus得到eventBus对象 3、定义事件消息类,一般内部属性为消息实体。...4、在需要订阅消息的组件内部 订阅消息 1、定义观察者 2、在initState函数内部为通过eventBus监听消息其返回值是观察值,eventBus在监听事件时需要明确监听的是哪个消息事...3、在dispose函数中销毁观察者。 5、另外一个组件内部通过eventBus来发布消息。...总结:在flutter中使用eventBus和在其他框架中使用,原理层面没有差别,都是借助发布订阅模式,但是在使用时的细微之处需要记忆,不然在运用是就会卡壳这样不利于开发效率的提升。

    3.8K11

    【Flutter】Flutter 页面生命周期 ( 初始化期 | createState | initState | 更新期 | build | 销毁期 | dispose)

    Widget 组件时除构造方法之外的第一个方法 , 对应方法 : 对应 Android 中的 onCreate 方法 ; 对应 iOS 中的 viewDidLoad 方法 ; 常用用法 : 在该方法中执行一些初始化操作...方法后调用该方法 ; ② 调用 setState 方法之后 , 该方法也会被调用 ; 方法作用 : 页面每次渲染时都会调用该方法 ; /// 4....更新期的生命周期函数 /// 方法调用时机 : /// ① 调用完 didChangeDependencies 方法后调用该方法 /// ② 调用 setState 方法之后 , 该方法也会被调用...销毁期的生命周期函数 /// 方法调用时机 : 该生命周期方法不经常调用 , 只有在组件被移除时才调用 /// 该方法在 dispose 方法之前被调用 @override void deactivate...更新期的生命周期函数 /// 方法调用时机 : /// ① 调用完 didChangeDependencies 方法后调用该方法 /// ② 调用 setState 方法之后 , 该方法也会被调用

    4.4K00

    flutter系列之:用来管理复杂状态的State详解

    这个新创建的State对象会和一个BuildContext相关联.注意这个关联关系是永久性的,不会发生变化的。虽然关联关系不会发生变化,但是BuildContext本身是可以在树上进行移动的。...这时候的State处于mounted状态。接下来,flutter会调用State中的 initState方法。...除了State主动调用setState方法之外,还有一些外部的变动会导致State的变动,比如:void didUpdateWidget(covariant T oldWidget) { }这个方法什么时候会被调用呢...注意,flutter框架会在调用didUpdateWidget之后自动调用build方法,所以我们在写程序的过程中,注意不要重复调用。...如果是在开发过程中,flutter还支持热重载,这时候会调用state的reassemble方法:void reassemble() { }flutter框架会在触发热重载之后,调用build方法,所以一般来说

    47810

    【Flutter 16】图解 ListView 异步加载数据与 Loading 等待

    setState(() {}); 和尚准备在刚进入页面时,开启异步请求数据,可以在 initState() 中进行操作,如下: @override void initState() { getNewsData...列表加载数据 和尚每次写 item 时都会想到 Flutter 中一切都是 Widget 的重要性,和尚建议很多公共的或重复的 Widget 完全可以提取成统一的 Widget,即方便管理也会大幅度减少代码量...和尚偷了个懒,借用一个三方库 flutter_spinkit,这个 loading 库集成简单而且效果多样,基本包含日常中常见的样式。 ?...集成步骤: pubspec.yaml 中添加 flutter_spinkit: "^2.1.0"; 在相应的 .dart 文件中添加引用 import 'package:flutter_spinkit/...flutter_spinkit.dart'; 添加需要展示的样式:SpinKit + Wave() 方式,同时与官网的使用有点区别,官网中用 width 和 height 来设置宽高,但是和尚在测试过程中

    3.6K31

    Flutter--Flutter中Widget、App的生命周期

    和Android的Activity和iOS的Controller一样,在Widget中,也有对应生命周期的一些方法函数。当进行到某一阶段时,会自动回调对应的方法函数。...didChangeDependencies 中调用也会出现异常,但和上面的异常不是同一个。...调用 deactivate 之后,然后将 State 对象重新插入树的另一个位置。 此方法可以在每一帧中调用,此方法中应该只包含构建组件的代码,不应该包含其他额外的功能,尤其是耗时任务。...1.3.1 mounted mounted 是 State 对象中的一个属性,此属性表示当前组件是否在树中,在创建 State 之后,调用 initState 之前,Framework 会将 State...因为如果当前组件未插入到树中或者已经从树中移除时,调用 setState 会抛出异常,加上 mounted 判断,则表示当前组件在树中。

    3K31

    【Flutter】Flutter 混合开发 ( Flutter 与 Native 通信 | 在 Flutter 端实现 EventChannel 通信 )

    与 Flutter 中的消息编解码器也要保持一致 ; 2、创建广播流 Stream 创建了 EventChannel 实例对象之后 , 调用 /// Sets up a broadcast stream...: 创建的监听用的广播流 ; 注意 : 消息的监听 , 和 取消监听 , 一定个要一一对应 , 防止出现 3、设置监听回调函数 调用 Stream 的 listen 方法 , 传入两个方法参数 ,...onError 参数 , 参数 和 返回值都是 void , 这是出现错误后回调的函数 ; 代码示例 : // 注册 EventChannel 监听 _streamSubscription...) { setState(() { /// 接收到消息 , 显示在界面中 showMessage = message;...) { setState(() { /// 接收到消息 , 显示在界面中 showMessage = message;

    1.4K20

    从零开始的Flutter之旅: Provider

    我们今天就来解决如何避免不必要的build构建,将build缩小到最小的CountText。 分析 首先我们来分析下为什么会导致父widget的重新build。...而state的改变会导致build的重新构建,导致的效果是CountWidget的build被重新调用,继而它的子widget也相继被重新build。...之后再去看Flutter的Provider将会更加简单。 方案已经有了,下面我们直接来看具体实现细节。...数据与需要缓存的child,同时在state中对可监听的data在合适的地方进行监听订阅与移除订阅,并在收到data数据改变时调用notify进行setState操作,通知widget刷新。...为了避免不必要的重复书写,我们将其单独封装到Consumer中,内部来实现对其的调用,并且将调用的结果暴露出来。

    74420
    领券