Flutter 父子组件通信

在Flutter 中父组件调用子组件的方法可以通过GlobalKey实现,而子组件调用父组件方法可以通过回调函数实现。

父组件

class _MyHomePageState extends State<MyHomePage> {final GlobalKey<LoadPencilState> loadPencilKey = GlobalKey<LoadPencilState>();// 动画状态bool isRun = false;@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(backgroundColor: Theme.of(context).colorScheme.inversePrimary,title: Text(widget.title),),body: SizedBox(width: 350,child: Column(children: [LoadPencil(backgroundColor: Colors.blue,key: loadPencilKey,changeState: (state) {setState(() {isRun = state;});},),ElevatedButton(onPressed: () {if (isRun == true) {loadPencilKey.currentState?.stop();} else {loadPencilKey.currentState?.start();}},child: isRun == true ? const Text("停止") : const Text("开始")),],),));}
}

子组件

import 'package:flutter/material.dart';class LoadPencil extends StatefulWidget {final Color backgroundColor;final Function(bool state) changeState;const LoadPencil({super.key, required this.backgroundColor, required this.changeState});@overrideState<StatefulWidget> createState() => LoadPencilState();
}class LoadPencilState extends State<LoadPencil>with SingleTickerProviderStateMixin {// 定义动画控制器对象late AnimationController _controller;// 定义一个动画对象late Animation _animation;double _size = 0;@overridevoid initState() {super.initState();_controller = AnimationController(vsync: this,duration: const Duration(seconds: 2),);final Tween tween = Tween(begin: 0, end: 300);_animation = tween.animate(_controller);// 监听动画帧的变化,在每一帧中更新UI_animation.addListener(() {setState(() {_size = _animation.value.toDouble();});});//  监听动画的状态,当动画正序完成后反向执行动画_controller.addStatusListener((status) {// 动画状态status的值有:dismissed(动画停止在开始处)、forward(正向运行)、reverse(反向运行)、completed(动画停止在结束处)if (status == AnimationStatus.completed) {_controller.reverse();} else if (status == AnimationStatus.dismissed) {_controller.forward();}});}@overridevoid dispose() {super.dispose();//释放动画_controller.dispose();}@overrideWidget build(BuildContext context) {return Container(width: _size,height: 2,color: widget.backgroundColor,);}// 启动start() {_controller.forward();// 向父组件通信widget.changeState(true);}// 终止stop() {_controller.stop();// 向父组件通信widget.changeState(false);}
}

有一个需要注意的地方是,在使用GlobalKey<>设置类型时,这个类型子组件的State,而不是子组件本身

final GlobalKey<LoadPencilState> loadPencilKey = GlobalKey<LoadPencilState>();

在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.hqwc.cn/news/211400.html

如若内容造成侵权/违法违规/事实不符,请联系编程知识网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

Git工作流和Commit规范

Git大家都非常熟悉了&#xff0c;就不做过多介绍&#xff0c;但是如何用好Git、如何进行合理的分支开发、Merge你是否有一个规范流程呢&#xff1f;&#x1f4a4; 不论是一个团队一起开发一个项目&#xff0c;还是自己独立开发一个项目&#xff0c;都少不了要和Git打交道&…

DALSA.SaperaLT.SapClassBasic无法加载,试图加载格式不正确的程序,c#

情景&#xff1a;用c#wpf写DALSA线扫相机的项目&#xff0c;生成时不报错&#xff0c;运行到DALSA相关的代码就报错找不到dll&#xff08;DALSA的技术支持没给到任何支持 &#xff09; 一.根据框架选择dll 如果是.net framework框架&#xff08;比如说.net480&#xff09;&am…

Linux之实现简易的shell

1.打印提示符并获取命令行 我们在使用shell的时候&#xff0c;发现我们在输入命令是&#xff0c;前面会有&#xff1a;有用户名&#xff0c;版本&#xff0c;当前路径等信息&#xff0c;这里我们可以用环境变量去获取: 1 #include <stdio.h>2 #include <stdlib.h>…

【20年扬大真题】试写一算法在带头结点的单链表结构上实现线性表操作LENGTH(L)

【20年扬大真题】 试写一算法在带头结点的单链表结构上实现线性表操作LENGTH&#xff08;L&#xff09;。 #define _CRT_SECURE_NO_WARNINGS #include<stdio.h> #include<stdbool.h> #include<malloc.h> //单链表定义 //链表结点 int A[10] { 1,2,3,4,5,6,…

Hadoop学习总结(MapReduce的数据去重)

现在假设有两个数据文件 file1.txtfile2.txt2018-3-1 a 2018-3-2 b 2018-3-3 c 2018-3-4 d 2018-3-5 a 2018-3-6 b 2018-3-7 c 2018-3-3 c2018-3-1 b 2018-3-2 a 2018-3-3 b 2018-3-4 d 2018-3-5 a 2018-3-6 c 2018-3-7 d 2018-3-3 c 上述文件 file1.txt 本身包含重复数据&…

C++设计模式之工厂模式(上)——简单工厂模式

工厂模式 概述简单工厂模式介绍示例示例使用运行结果缺点 概述 工厂模式属于一种创建型设计模式。其可以分为简单工厂模式&#xff0c;工厂模式和抽象工厂模式。工厂模式分为上、中、下三篇&#xff0c;本篇主要介绍简单工厂模式。 简单工厂模式 介绍 简单工厂模式可以理解…

react中虚拟dom,diff,fiber - 初级了解

借鉴&#xff1a; 「React深入」一文吃透虚拟DOM和diff算法 - 掘金 (juejin.cn) 虚拟dom、fiber、渲染dom、dom-diff - 掘金 (juejin.cn) 未阅读源码&#xff0c;了解层面&#xff0c;后续可以深入了解 1.虚拟DOM ①.结构上&#xff1a;虚拟DOM比真实DOM轻很多 ②.操作上&…

JS逆向之wasm逆向(二)

本文仅供技术交流和技术学习 不做其他用途 接着上一篇继续讲&#xff1a; 上篇地址&#xff1a; JS逆向之wasm逆向(二进制) 网址&#xff1a; aHR0cHM6Ly93d3cuN3E2Y3lqLmNvbTo5MDAxL3JlZ2lzdGVyNDY5Njg/aV9jb2RlPTQ0Mjc5OTU1 这个网站我们后面可以继续讲他的debugger 和滑块…

玻色量子“揭秘”之多项式回归问题与QUBO建模

摘要&#xff1a;多项式回归&#xff08;Polynomial Regression&#xff09;是一种回归分析方法&#xff0c;通过拟合一个多项式方程来模拟自变量与因变量之间的非线性关系。多项式回归的目标是找到一组多项式系数&#xff0c;使得拟合曲线尽可能地接近数据点。这种方法可以用于…

本地websocket服务端暴露至公网访问【cpolar内网穿透】

本地websocket服务端暴露至公网访问【cpolar内网穿透】 文章目录 本地websocket服务端暴露至公网访问【cpolar内网穿透】1. Java 服务端demo环境2. 在pom文件引入第三包封装的netty框架maven坐标3. 创建服务端,以接口模式调用,方便外部调用4. 启动服务,出现以下信息表示启动成功…

centos7上用docker部署redis

1. 下载redis镜像 docker pull redis docker images # 查看镜像是否下载成功2. 安装redis容器 2.1 先准备好配置文件redis.conf vi /data/redis/redis.conf写入配置信息&#xff0c;appendonly yes&#xff0c;如果需要给redis配置密码&#xff0c;可以写入requirepass root…

Feign 远程调用

目录 代码架构 feign-api 模块解析 架构 依赖 定义接口类 lead-news-article模块 架构 yml配置 依赖 实现类 启动类 lead-news-wemedia模块 架构 调用 启动类 代码架构 feign-api 模块解析 架构 依赖 <dependency><groupId>org.springframework.clo…