当前位置: 首页 > news >正文

Flutter 实现dispose探测控件

文章目录

  • 前言
  • 一、什么是dispose探测控件?
    • 1、通常情况
    • 2、使用dispose探测控件
  • 二、如何实现
    • 1、继承StatefulWidget
    • 2、定义dipose回调
    • 3、定义child
    • 4、重载Dispose方法
    • 5、build child
  • 三、完整代码
  • 四、使用示例
    • 1、基本用法
    • 2、设置定义数据
  • 总结


前言

开发flutter一般会用状态管理工具,用了状态管理后大部分控件都会是StatelessWidget,StatefulWidget有dispose重载获取控件销毁时机,但StatelessWidget则没有,此时我们要获取控件销毁的时机就需要另寻他法了。


一、什么是dispose探测控件?

这是一个控件用于帮助探测无状态控件的销毁时机,有点类似visibility_detector用于探测控件的显示和隐藏。

1、通常情况

通常情况下想要知道一个页面是否销毁或切换了,需要通过StatefulWidget的dispose方法获取。代码如下:

class Page extends StatefulWidget {const Page({super.key,});_Page createState() => _Page();
}class _Page<T extends Widget, S> extends State<Page> {void dispose() {super.dispose();//此处获取到dispose时机}void didUpdateWidget(covariant Page oldWidget) {super.didUpdateWidget(oldWidget);//此处获取到控价刷新时机}Widget build(BuildContext context) {return const SizedBox();}
}

2、使用dispose探测控件

在使用使用状态管理的情况下,通常都是StatelessWidget页面,将其改成StatefulWidget,分成两个类显然是麻烦的。如果有了DisposeDetector(dispose探测控件),作为一个控件放入StatelessWidget页面中,就可以直接获取到dispose时机了。

class Page2 extends StatelessWidget {const Page2({super.key,});Widget build(BuildContext context) {return DisposeDetector(child: const SizedBox(),onDispose: () {//此处获取到dispose时机},onDidUpdateWidget: (DisposeDetector<SizedBox, dynamic> oldWidget) {//此处获取到控价刷新时机},);}
}

二、如何实现

1、继承StatefulWidget

在这里插入图片描述
在这里插入图片描述

2、定义dipose回调

在这里插入图片描述

3、定义child

在这里插入图片描述

4、重载Dispose方法

在这里插入图片描述

5、build child

在这里插入图片描述

三、完整代码

dispose_detector.dart

import 'package:flutter/material.dart';/// 创建人:  xin
/// 创建时间: 2023/6/15 13:44
/// 注释: 销毁探测控件
class DisposeDetector<T extends Widget, S> extends StatefulWidget {final Function onDispose;final Function(DisposeDetector<T, S> oldWidget) onDidUpdateWidget;final T child;final S? tag; //自定义数据const DisposeDetector({super.key, required this.child,required this.onDispose,required this.onDidUpdateWidget,this.tag,});_DisposeDetector<T, S> createState() => _DisposeDetector<T, S>();
}class _DisposeDetector<T extends Widget, S> extends State<DisposeDetector<T, S>>with TickerProviderStateMixin {void dispose() {super.dispose();widget.onDispose();}void didUpdateWidget(covariant DisposeDetector<T, S> oldWidget) {super.didUpdateWidget(oldWidget);widget.onDidUpdateWidget(oldWidget);}Widget build(BuildContext context) {return widget.child;}
}

四、使用示例

1、基本用法

class Page2 extends StatelessWidget {const Page2({super.key,});Widget build(BuildContext context) {return DisposeDetector(child: const SizedBox(),onDispose: () {//此处获取到dispose时机},onDidUpdateWidget: (DisposeDetector<SizedBox, dynamic> oldWidget) {//此处获取到控价刷新时机},);}
}

2、设置定义数据

class Page2Controller {void dispose() {//销毁逻辑}
}class Page2 extends StatelessWidget {final _ctrl = Page2Controller();Page2({super.key,});Widget build(BuildContext context) {return DisposeDetector(tag: _ctrl, //自定义数据,记录当前的controlleronDispose: () {//此处获取到dispose时机_ctrl.dispose();},onDidUpdateWidget:(DisposeDetector<SizedBox, Page2Controller> oldWidget) {//此处获取到控价刷新时机if (oldWidget.tag != _ctrl)//如果刷新控件时controller改变了,则销毁旧controller{oldWidget.tag!.dispose();}},child: const SizedBox(),);}
}

总结

以上就是今天要讲的内容,本文提供的控件是比较有用的,尤其是业务逻辑有数据释放的需求,比如播放器之类的,控件销毁后需要结束播放,将播放资源销毁,如果是用StatelessWidget则没办法实现,用StatefulWidget又会使得页面实现变得麻烦或者复杂,最好的方法则是使用本文提供的dispose探测控件。

相关文章:

Flutter 实现dispose探测控件

文章目录 前言一、什么是dispose探测控件&#xff1f;1、通常情况2、使用dispose探测控件 二、如何实现1、继承StatefulWidget2、定义dipose回调3、定义child4、重载Dispose方法5、build child 三、完整代码四、使用示例1、基本用法2、设置定义数据 总结 前言 开发flutter一般…...

如何定义和衡量一个产品的成功?

定义和衡量一个产品的成功是一个多维度的过程&#xff0c;涉及用户满意度、市场表现、商业成果和技术实现等多个方面。以下是几个关键点&#xff0c;可以帮助产品经理在面试中全面阐述这一话题&#xff1a; 用户层面的成功&#xff1a; 用户满意度&#xff1a;通过用户调研、N…...

微调大模型 - 面向学术论文的AI大模型

1、优化学术交流: 该项目专注于优化学术文献的阅读、润色和写作过程,提供了实用化的交互接口。 2、模块化和可扩展性: 项目设计模块化,支持自定义快捷按钮和函数插件,便于用户根据自己的需求进行扩展。 3、多语言和多模型支持: 支持多种语言的论文翻译和总结,同时可以并行…...

java溯本求源之基础(二十四)之--常见List的实现共同点

兄弟们终于到了上代码讲代码的环节了&#xff0c;之前的一些代码都是小打小闹&#xff0c;现在才是重头戏&#xff0c;今天来简单说说一些集合&#xff0c;首先这些都是基于数组实现的&#xff0c;当然Collections.emptyList不算奥&#xff0c;别犟。剩下的不多墨迹直接上重点&…...

gin连接redis

使用Gin框架连接Redis&#xff0c;需要先安装Redis客户端库&#xff0c;例如go-redis。然后&#xff0c;你可以创建一个Redis客户端实例&#xff0c;并在Gin路由处理函数中使用它。以下是一个简单的示例&#xff1a; 1. 首先&#xff0c;安装go-redis库&#xff1a; bash go g…...

深度学习训练——batch_size参数设置过大反而训练更耗时的原因分析

&#x1f4aa; 专业从事且热爱图像处理&#xff0c;图像处理专栏更新如下&#x1f447;&#xff1a; &#x1f4dd;《图像去噪》 &#x1f4dd;《超分辨率重建》 &#x1f4dd;《语义分割》 &#x1f4dd;《风格迁移》 &#x1f4dd;《目标检测》 &#x1f4dd;《暗光增强》 &a…...

jvm必知必会-类的生命周期图文详解

类的生命周期描述了一个从加载、使用到卸载的过程; 而其中的 连接 部分又分为一下三个阶段: 验证准备解析6.1 加载阶段 Loading阶段第一步是 类加载器 会根据类全限定名通过不同的渠道以二进制流的方式获取字节码信息,程序员可以使用Java代码扩展不同的渠道。 比如通过 …...

一文看懂人工智能、机器学习、深度学习是什么、有什么区别!

引言&#xff1a;走进智能的世界 曾经&#xff0c;人工智能&#xff08;AI&#xff09;是科幻小说中的概念&#xff0c;与飞船、外星人并肩而立。 然而&#xff0c;随着时间的推移&#xff0c;AI不再仅仅是幻想的产物&#xff0c;它已经成为我们日常生活中不可或缺的一部分。 在…...

Vue47-修改默认配置webpack.config.js文件

main.js是脚手架项目的入口文件&#xff0c;系统运行时&#xff0c;默认去找src下的main.js文件。这是webpack通过配置文件&#xff1a;webpack.config.js配置的。 脚手架把所有重要的配置文件都隐藏了&#xff0c;方式被开发者修改。 一、查看被隐藏的webpack配置 1-1、webpa…...

qss实现登录界面美化

qss实现登录界面美化 #include "widget.h" #include "ui_widget.h"Widget::Widget(QWidget *parent): QWidget(parent), ui(new Ui::Widget) {ui->setupUi(this);// 去掉头部this->setWindowFlag(Qt::FramelessWindowHint);// 去掉空白部分th…...

ROS系统中解析通过CAN协议传输的超声波传感器数据

CAN Bus接口设置&#xff1a;确保你的ROS系统可以通过CAN Bus接口与外部设备通信。这可能需要CAN卡或CAN适配器&#xff0c;以及相应的驱动程序和库。 CAN消息接收&#xff1a;配置ROS节点来监听特定的CAN ID&#xff0c;这通常是超声波传感器的标识符。 数据解析&#xff1a…...

SonarQube安全扫描常见问题

目录 一、SonarQube质量报告 二、SonarQube扫描常见问题和修复方法 三、SonarQube质量配置 最近小编在使用SonarQube工具进行代码扫描&#xff0c;检查代码异味&#xff0c;系统漏洞等&#xff0c;实际过程中也遇到了不少问题&#xff0c;这篇文章主要列举我遇到的常见问题和…...

Golang内存模型与分配机制

简述 mheap为堆&#xff0c;堆和进程是一对一的&#xff1b;mcentral&#xff08;小mheadp&#xff09;&#xff0c;mcahe&#xff08;GMP的P私有&#xff09;&#xff0c;分配内存顺序由后向前。 在解决这个问题&#xff0c;Golang 在堆 mheap 之上&#xff0c;依次细化粒度&a…...

HarmoneyOS星河版 安装和启动

一、下载和安装DevEco Studio 官网链接&#xff1a;OpenAtom OpenHarmony 1.1 找到对应的操作系统进行下载 创建安装Harmony的文件夹&#xff1a; 1.2 下载后进行安装 1.3 分别安装Node、Ohpm、SDK 分别安装Node、Ohpm和SDK 二、.创建一个新项目并运行 2.1 选择[OpenHarmon…...

奇舞周刊第530期:AIGC和低代码结合应用全栈研发实践总结

周五快乐&#xff08;图片由midjourney生成&#xff09; 奇舞推荐 ■ ■ ■ AIGC 和低代码结合应用全栈研发实践总结 得物通过低代码和大模型技术简化电商供应链系统开发。尽管低代码工具存在一些局限&#xff0c;但结合大模型生成脚本和理解配置&#xff0c;提高了效率。未来将…...

linux上运行js脚本

貌似学运维&#xff0c;啥都要懂一点儿&#xff1f;&#xff1f;&#xff1f;&#xff1f;&#xff1f;&#xff1f; 我们将使用 Node.js 和 ES6 模块语法。 首先&#xff0c;确保你已经安装了 Node.js。 创建项目文件结构 假设我们的项目结构如下&#xff1a; my_project/…...

PCA 在图像分析上的应用

同一物体旋转角度求取 直接上代码&#xff1a; import cv2, os import numpy as np import timedef perform_pca(image, num_components):# 将图像转换为浮点型img_float np.float32(image)img_flatten img_float.reshape(-1, 2)# 计算均值和协方差矩阵mean, eigenvectors …...

springboot项目mapper无法自动装配,未找到 ‘userMapper‘ 类型的Bean解决办法.

一开始我看到了这个回答&#xff1a;springboot项目mapper无法自动装配&#xff0c;未找到 ‘userMapper‘ 类型的 Bean解决办法&#xff08;含报错原因&#xff09;_无法自动装配。找不到 usermapper 类型的 bean。-CSDN博客 mapper无法自动装配&#xff0c;未找到 ‘userMap…...

TC3xx A\B SWAP机制的小细节(2)

目录 1.引入 2.TC3xx Swap机制小细节 3.小结 1.引入 上文TC3xx A\B SWAP机制的小细节(1)-CSDN博客主要把OTA的概念&#xff0c;以及MCU的硬件A\B Swap机制做了简单介绍&#xff0c;下面我们来聊聊TC3xx的SWAP机制 2.TC3xx Swap机制小细节 英飞凌TC3xx提供了硬件SOTA机制&…...

双绞线(网线)的制作与测试

实验目的 1、熟悉常用双绞线&#xff08;网线&#xff09;及其制作工具的使用&#xff1b; 2、掌握非屏蔽双绞线的直通线、交叉线的制作及连接方法&#xff1b; 3、掌握双绞线连通性的测试。 设备要求&#xff1a;RJ45压线钳&#xff0c;RJ45水晶头&#xff0c;UTP线缆&…...

高效处理海量慢SQL日志文件:Java与JSQLParser去重方案详解

在大数据处理环境下&#xff0c;慢SQL日志优化是一个必要的步骤&#xff0c;尤其当日志文件达到数GB时&#xff0c;直接操作日志文件会带来诸多不便。本文将介绍如何通过Java和JSQLParser库来解析和去重慢SQL日志&#xff0c;以提高性能和可维护性。 背景 公司生产环境中&…...

企业内部、与合作伙伴/客户文档协作如何高效安全地收集资料?

在企业的日常运营与对外合作中&#xff0c;「文件收集」是一项特别常见的文档协作需求。例如&#xff0c;公司举办项目经验分享大会&#xff0c;组织者需要提前收集演讲者的材料&#xff1b;新项目启动时&#xff0c;项目经理需要快速收集技术方案和报价方案以便招投标和商务活…...

用Unity创造自己的绿洲

“谢谢你能玩我的游戏&#xff01;” 希望将来我也能做出一款影响全世界的游戏&#xff0c;就比如现在的《英雄联盟》&#xff0c;或是电影里的《绿洲》&#xff01;然后也说出这么一句话&#xff1a;谢谢你能玩我的游戏&#xff01; 阶段性的总结一下 那就展示一下最近完成的…...

服务器数据恢复—KVM虚拟机被误删除如何恢复虚拟磁盘文件?

服务器数据恢复环境&故障&#xff1a; 1台服务器&#xff0c;Linux操作系统EXT4文件系统&#xff0c;部署了数台KVM虚拟机&#xff0c;每台虚拟机包含一个qcow2格式的磁盘文件&#xff0c;和一个raw格式的磁盘文件。 工作人员操作失误删除了3台服务器上的KVM虚拟机&#xf…...

工具清单 - 看板工具

# 工具清单 Crepido在新窗口打开 - Create (kanban) boards to track users and projects from flat markdown files. MIT NodejsKanboard在新窗口打开 - Simple and open source visual task board. (Source Code在新窗口打开) MIT PHPmyTinyTodo在新窗口打开 - Simple way t…...

Go微服务: 分布式之发送带有事务消息的示例

分布式之发送带有事务消息 现在做一个RocketMQ的事务消息的 demo 1 &#xff09;生产者 package mainimport ("context""fmt""time""github.com/apache/rocketmq-client-go/v2""github.com/apache/rocketmq-client-go/v2/prim…...

【go】go初始化命令总结

包初始化 test项目目录下执行 go mod init test go mod tidy生成二进制可执行文件 go build -o test .\main.go...

vue音乐播放条

先看效果 再看代码 <template><div class"footer-player z-30 flex items-center p-2"><div v-if"isShow" class"h-12 w-60 overflow-hidden"><div :style"activeStyle" class"open-detail-control-wrap&…...

halcon实现浓淡补正,中间值补正-抽取暗

代码效果 抽取前 中值抽取暗 halcon函数代码 测试图片参数 NoiseCut:16 Gain:1 输入ImagePart NoiseCut Gain *获取直方图 get_domain (ImagePart, Domain) gray_histo_range(Domain,ImagePart,0,255,256, Histo, BinSize) area_center(Domain, NumPixels, Row, Column) …...

太速科技-FMC213V3-基于FMC兼容1.8V IO的Full Camera Link 输入子卡

FMC213V3-基于FMC兼容1.8V IO的Full Camera Link 输入子卡 一、板卡概述 该板卡为了考虑兼容1.8V电平IO&#xff0c;适配Virtex7&#xff0c;Kintex Ultrascale&#xff0c;Virtex ultrasacle FPGA而特制&#xff0c;如果要兼容原来的3.3V 也可以修改硬件参数。板卡支持1路…...

温州网站建设制作/长沙优化排名推广

转自&#xff1a;http://www.zgg.org.cn/jgwh/kpgy/kepu/201501/t20150114_494710.html“要是时间能停下来那就好了&#xff0c;哪怕只有一秒钟。”以往在动画中出现的桥段即将发生在现实中啦。1月12日&#xff0c;中科院国家授时中心预告&#xff0c; 2015年6月30日&#xff0…...

java电影网站开发视频/重庆森林经典台词罐头

php中static关键字的作用是&#xff1a;1、放在函数内部修饰变量&#xff0c;函数执行完后变量值仍然保存&#xff1b;2、放在类中修饰属性或方法&#xff0c;如果修饰的是类的属性&#xff0c;则保留值&#xff1b;3、放在类的方法中修饰变量&#xff1b;4、修饰全局作用域的变…...

17网站一起做网店普宁/高权重外链

~~~笔锋至此又怎能平淡而终,故事开始便不承认普通✌✌✌ ✌ 题目及题解持续更新中 【2023王道数据结构目录】课后算法设计题C、C++代码实现完整版大全 题目: 用单链表保存m个整数,结点的结构为【data】【link】,且|data|<=n。现要求设计一个时间复杂度尽可能高效的算法…...

想通过做威客网站上的任务来赚/互联网销售公司

类模板 //类模板和函数模板区别://1、类模板不可以使用自动类型推导,只能用显示指定类型//2、类模板中 可以有默认参数#define _CRT_SECURE_NO_WARNINGS #include<iostream> using namespace std; #include <string> template<class...

videopro wordpress/百度如何发布作品

Q:我用outlook下载了邮箱里所有的邮件&#xff0c;现在想刻盘保存&#xff0c;我应该保存哪些文件呢&#xff0c;以保证我把光盘内的数据放到其他电脑上还可以用outlook查看我的这些邮件&#xff1f; A:找到你outlook的按装文件&#xff0c;你可以全部刻下来&#xff0c;到后期…...

cco网站素材/免费b站软件推广网站

<bean> ***</bean> 这叫做Spring的依赖注入也叫控制反转。bean的id也就是你说的bean的id&#xff0c;通过id找你想要调用的bean <bean id"demo1Action" class"location1 of demo1"> ***</bean> <bean id"demo2Action"…...