flutter使用get依赖实现全局loading效果,弹窗loading状态

news2024/11/19 10:31:13

get dialog的官网文档:GetDialogRoute class - dialog_route library - Dart API

可以使用Get.dialog()方法来创建一个自定义的加载弹窗,get框架是支持自定义弹窗效果的,所以我们就使用这个方式来自定义一个弹窗效果,并且点击遮罩区域可以实现关闭,这个功能要先在组件里面创建一个loading.dart文件,然后代码如下:

import 'package:flutter/material.dart';
import 'package:get/get.dart';

class LoadingDialog {
  static show() {
    Get.dialog(
      GestureDetector(
        child: Container(
          color: Colors.black54,
          child: const Center(
            child: CircularProgressIndicator(
              valueColor: AlwaysStoppedAnimation<Color>(Colors.white),
            ),
          ),
        ),
        onTap: () {
          // 点击是否退出模态框
          Get.back();
        },
      ),
      barrierDismissible: false,
    );
  }

  static hide() {
    Get.back();
  }
}

然后在组件中使用,如果你想在路由跳转的时候,就展示loading效果,就可以在Get.toName()跳转后立马调用:

然后当页面数据加载完之后隐藏loading:

我这里使用了延时两秒来关闭弹窗,不然无法关闭:

  getGoods() async {
    var res = await userApi.getGoods();
    var goodsData = res['response_data']['data'];
    setState(() {
      goods = goodsData;
    });
    //
    Future.delayed(Duration(seconds: 2), () {
      print("退出加载...");
      // Get.back();
      LoadingDialog.hide();
    });
  }

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

curl 测试返回状态码

curl 测试返回状态码 curl -I -m 10 -o /dev/null -s -w %{http_code} www.baidu.com -I 仅测试HTTP头 -m 10 最多查询10s -o /dev/null 屏蔽原有输出信息 -s silent -w %{http_code} 控制额外输出 测试&#xff1a; curl -I -m 10 -o /dev/null -s -w %{http_code} www.baid…

【上分日记】第379场周赛(分类讨论 + 数学 + 前缀和)

文章目录 前言正文1.3000. 对角线最长的矩形的面积2.3001. 捕获黑皇后需要的最少移动次数3.3002. 移除后集合的最多元素数3.3003. 执行操作后的最大分割数量 总结尾序 前言 终于考完试了&#xff0c;考了四天&#xff0c;也耽搁了四天&#xff0c;这就赶紧来补这场周赛的题了&a…

解决kali beef启动失败解问题

只限于出现这个提示的时候使用 卸载 ruby apt remove ruby 卸载 beef apt remove beef-xss 重新安装ruby apt-get install ruby apt-get install ruby-dev libpcap-dev gem install eventmachine 重新安装beef apt-get install beef-xss 弄完以上步骤如果还是不行就重启kali再试…

SpringBoot集成p6spy

P6Spy 是一个可以用来在应用程序中拦截和修改数据操作语句的开源框架。 通过 P6Spy 我们可以对 SQL 语句进行拦截,相当于一个 SQL 语句的记录器,这样我们可以用它来作相关的分析,比如性能分析。这里主要用于在控制台打印SQL时能自动将问号替换成实际参数打印一个可执行的SQL…

原子累加器 LongAdder

&#x1f47d;System.out.println(“&#x1f44b;&#x1f3fc;嗨&#xff0c;大家好&#xff0c;我是代码不会敲的小符&#xff0c;双非大四&#xff0c;Java实习中…”); &#x1f4da;System.out.println(“&#x1f388;如果文章中有错误的地方&#xff0c;恳请大家指正&a…

nginx基本优化

安装nginx隐藏版本号 查看百度web服务器 [rootcjq11 ~]# curl -I http://www.baidu.com 隐藏nginx服务器版本号 [rootcjq11 ~]# cd /usr/local/src/nginx-1.22.0/ [rootcjq11 nginx-1.22.0]# vim src/core/nginx.h第13、14行修改版本号和服务器名称 [rootcjq11 nginx-1.2…

Springboot开发的大学生寝室考勤系统刷脸进出宿舍系统源码有论文

主要功能&#xff1a; 学生可以申请换寝&#xff0c;申请宿舍维修&#xff0c;健康上报&#xff0c;寝室长可上报寝室考勤和补签考勤&#xff08; 正常签到&#xff0c;不在寝室&#xff0c;晚归&#xff09;&#xff0c;查看寝室通报&#xff0c;公告等。 宿管处需要学生刷脸进…

Android Studio 项目结构

manifests&#xff1a;用于存放安卓程序的配置文件 AndroidManifest.xml&#xff1a;这是Android应用程序的清单文件&#xff0c;包含了应用程序的基本信息和组件声明等java&#xff1a;Java源代码文件存放的根目录 主代码 com.example.app&#xff1a;应用程序的主包名&#x…

Matlab:isomorphism

语法&#xff1a; P isomorphism(G1,G2) %计算图G1和G2之间的图同构等价关系&#xff08;如果存在&#xff09;。若不存在同构&#xff0c;则P为空数组 P isomorphism(___,Name,Value) %使用一个或多个名称-值对组参数指定其他选项 [P,edgeperm] isomorph…

浅谈SQL优化

避免使用子查询 例&#xff1a; select * from t1 where id in (select id from t2 where name lolly1023);其子查询在MySQL5.5版本里&#xff0c;内部执行计划是&#xff1a;先查询外表再匹配内表&#xff0c;而不是先查内表t2&#xff0c;当外表的数据很大时&#xff0c;查…

VM安装群晖系统 挂载整个硬盘给群晖系统

前言 在我们日常业务需求中&#xff0c;经常需要把整个磁盘的空间分配给群晖使用&#xff0c;那么如何通过vm分配整个磁盘空间给群晖系统。 操作 需要用管理员运行VM虚拟机 然后添加硬盘 就可以有权限全部添加了。这样会清除要挂载的磁盘的全部的数据。

蓝莓产量预测(R语言版)

数据描述 字段名 描述 字段名 描述 id 蓝莓唯一标识 MinOfUpperTRange 花期内最高温带日平均气温的最低记录, Clonesize 蓝莓克隆平均大小 AverageOfUpperTRange 花期内最高温带日平均气温, Honeybee 蜜蜂密度 MaxOfLowerTRange 花期内最低温带日平均气温的最…

vscode显示120字符或者80字符提示线或者显示垂直标尺

vscode显示120字符或者80字符提示线或者显示垂直标尺 一般规定一行代码不超过80或者120个字符。取决于团队的编码规范。 不同公司不同团队有不同的规定。 当单行代码过长。产生横向滚动条。使得代码难以阅读。 打开全局设置的settings.json /C:/Users/xxx/AppData/Roaming/Cod…

Qt-UI界面无法输入名字

在UI界面“在这里输入”&#xff0c;直接双击填写名称&#xff0c;无论是中文还是英文都没有反应。解决方案&#xff1a; 双击“在这里输入之后”&#xff0c;在可编辑状态下&#xff0c;空格→enter键&#xff0c;然后在右下角属性框的title中直接填写中文或英文名&#xff0…

学习c语言,奇偶排序

如果左边是奇数右边是偶数就不管他&#xff0c;如果左边找到偶数右边是奇数则互相交换。

高性能小模型SLM最新优化方案和热门应用盘点,附配套模型和开源代码

当大多数人都还在卷谁的大模型参数规模大的时候&#xff0c;聪明人已经开始搞“小模型”了&#xff08;doge&#xff09;。 这里的小模型指的小型语言模型&#xff08;Small Language Model&#xff0c;简称SLM&#xff09;&#xff0c;通常用于解决资源受限或实时性要求较高的…

「云渲染科普」3dmax vray动画渲染参数如何设置

动画渲染一直都是占用时间最多的地方&#xff0c;动画帧数通常 1 秒在 25 帧或者以上&#xff0c;电脑通常需要对每一帧的画面分批渲染&#xff0c;通常本地电脑由于配置上的限制&#xff0c;往往无法在短时间内快速的完成渲染任务。这时“云渲染”则成为了动画渲染的主要方案&…

在国外外出结账时应该怎样表述,柯桥生活英语学习

大家平时外出就餐时&#xff0c;尤其是那种外国餐厅&#xff0c;结账时都怎么表达&#xff1f;可能大家会脱口而出“how much”..... 如果你真的这么说&#xff0c;那可就“踩雷”了。因为&#xff0c;在歪果仁的文化中&#xff0c;用how引导的疑问句都或多或少涉及隐私问题&am…

「许战海矩阵战略洞察」吉香居给调味品企业带来的战略启示

引言&#xff1a;吉香居通过实施份额化战略和打造形象产品&#xff0c;在调味品行业中取得了成功。但品牌结构需要调整&#xff0c;需要将子品牌整合到吉香居主品牌下&#xff0c;共同提升品牌势能。此外&#xff0c;企业需保持主品牌竞争战略&#xff0c;以实现长期稳定的高速…

一、基础篇 vue模板语法

Vue.js 使用了基于 HTML 的模板语法&#xff0c;允许开发者声明式地将 DOM 绑定至底层 Vue 实例的数据。所有 Vue.js 的模板都是合法的 HTML&#xff0c;所以能被遵循规范的浏览器和 HTML 解析器解析。 在底层的实现上&#xff0c;Vue 将模板编译成虚拟 DOM 渲染函数。结合响应…