当前位置: 首页 > 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线缆&…...

BM12O2321-A高集成H桥模块的9位UART驱动原理与Arduino库实践

1. 项目概述BM12O2321-A 是由 Basetron&#xff08;BestModules&#xff09;推出的高集成度 H 桥驱动模块&#xff0c;专为中小功率直流电机、电磁阀、LED 阵列等双向负载控制场景设计。该模块并非传统意义上的分立 H 桥芯片&#xff08;如 L298N、TB6612FNG&#xff09;&#…...

从外卖配送看算法实战:Python+NetworkX解决简化版VRP问题

外卖配送路径优化实战&#xff1a;用PythonNetworkX解决简化版VRP问题 中午12点&#xff0c;城市里的外卖订单如潮水般涌来。配送员小张的手机上瞬间出现了8个不同方向的订单&#xff0c;他盯着地图上分散的标记点皱起了眉头——怎样才能用最短的时间送完所有外卖&#xff1f;这…...

C语言回调函数在TCP客户端中的实现与应用

C语言回调函数在TCP客户端中的实现与应用1. 回调函数基础概念回调函数是一种通过函数指针实现的编程机制&#xff0c;允许将一个函数作为参数传递给另一个函数。在C语言中&#xff0c;回调函数的实现完全依赖于函数指针&#xff0c;这与C、Python等现代语言中可能使用仿函数或匿…...

SAP FICO财务账期管理实战:关键配置与月结操作指南

1. SAP FICO财务账期管理基础概念 财务账期管理是SAP FICO模块中最基础也最重要的功能之一。简单来说&#xff0c;它就像财务部门的"门禁系统"&#xff0c;控制着哪些会计凭证能在特定时间段被录入系统。想象一下&#xff0c;如果超市收银台没有营业时间限制&#xf…...

基于LangChain的RAG与Agent智能体开发 - 持久化会话记忆功能实现(RunnableWithMessageHistory+RedisChatMessageHistory)

大家好&#xff0c;我是小锋老师&#xff0c;最近更新《2027版 基于LangChain的RAG与Agent智能体 开发视频教程》专辑&#xff0c;感谢大家支持。本课程主要介绍和讲解RAG&#xff0c;LangChain简介&#xff0c;接入通义千万大模型 &#xff0c;Ollama简介以及安装和使…...

新手必看!用PHPStudy一键搭建DVWA靶场(附常见错误解决)

零基础实战&#xff1a;用PHPStudy快速搭建DVWA漏洞靶场全指南 第一次接触网络安全实战时&#xff0c;很多人会被复杂的实验环境搭建劝退。作为过来人&#xff0c;我完全理解那种面对满屏报错信息的无力感。本文将手把手带你用PHPStudy这个神器&#xff0c;在Windows系统上快速…...

Webots仿真实战:如何用C语言控制四轮小车实现自动行驶

Webots仿真实战&#xff1a;C语言控制四轮小车自动行驶全攻略 引言 在机器人开发领域&#xff0c;仿真环境的重要性不言而喻。它不仅能大幅降低硬件成本&#xff0c;还能加速开发周期&#xff0c;让开发者专注于算法和控制逻辑的优化。Webots作为一款专业的机器人仿真软件&…...

Verilog进阶实战:独热码状态机设计序列检测器的核心技巧

1. 独热码状态机的设计哲学 第一次接触独热码(One-Hot)编码时&#xff0c;我盯着那串只有一个1的状态编码看了半天——这不就是硬件版的"单选题"吗&#xff1f;每个状态都有自己的专属VIP通道&#xff0c;这种设计理念在中小规模状态机中简直是降维打击。记得去年做电…...

6种专业计时模式:让OBS直播时间管理变得如此简单

6种专业计时模式&#xff1a;让OBS直播时间管理变得如此简单 【免费下载链接】obs-advanced-timer 项目地址: https://gitcode.com/gh_mirrors/ob/obs-advanced-timer 想让你的直播画面看起来更加专业吗&#xff1f;OBS高级计时器正是你需要的秘密武器&#xff01;这款…...

高效PDF处理:用PDF Arranger实现极简文档管理

高效PDF处理&#xff1a;用PDF Arranger实现极简文档管理 【免费下载链接】pdfarranger Small python-gtk application, which helps the user to merge or split PDF documents and rotate, crop and rearrange their pages using an interactive and intuitive graphical int…...