flutter loading
在发起请求时 需要有loading页面这样可以让用户知道当前正在操作,又可以防止多次点击等误操作,所以这里就自定义了一个loading页面 菊花使用flutter_spinkit里面的菊花来代替
在需要显示loding的地方通过showDialog的弹窗的方式来显示菊花,在需要关闭的时候让dialog关闭
这里使用了flutter_spinkit
flutter_spinkit: ^4.0.0
具体代码
loading.dart
import 'package:flutter/material.dart';
import 'package:flutter_spinkit/flutter_spinkit.dart';
class Loading extends StatelessWidget {
static void show(BuildContext context) {
showDialog(
barrierDismissible: true,
context: context,
builder: (ctx) => Theme(
data: Theme.of(ctx).copyWith(dialogBackgroundColor: Colors.transparent),
child: Loading(),
),
);
}
static void dismiss(context) {
Navigator.pop(context);
}
@override
Widget build(BuildContext context) {
return Container(
color: Colors.transparent,
child: Center(
child: Container(
decoration: BoxDecoration(
color: Colors.white,
borderRadius: BorderRadius.circular(5),
),
width: 60,
height: 60,
alignment: Alignment.center,
child: Column(
mainAxisSize: MainAxisSize.min,
children: <Widget>[
SpinKitFadingCircle(
color: Colors.black,
size: 46.0,
)
],
),
),
),
);
}
}
关于使用
Loading.show(context);
Loading.dismiss(context);
flutter loading的更多相关文章
- flutter 延时函数delay Loading页面
loading 页面 import 'package:flutter/cupertino.dart'; import 'package:flutter/material.dart'; class Lo ...
- 【老孟Flutter】41个酷炫的 Loading 组件库
老孟导读:目前 loading 库中包含41个动画组件,还会继续添加,同时也欢迎大家提交自己的 loading 动画组件或者直接微信发给我也可以. Github 地址:https://github.c ...
- Flutter AS设备连接显示loading解决方案
看了网上很多解决方案,基本都是要杀dart进程后,删除lockfile 文件,然后运行检查命令flutter doctor. 这个方式有一定的意义,但是确实不一定解决这个问题. 今天就遇到了这样的问题 ...
- Flutter 让你的Dialog脱胎换骨吧!(Attach,Dialog,Loading,Toast)
前言 Q:你一生中闻过最臭的东西,是什么? A:我那早已腐烂的梦. 兄弟萌!!!我又来了! 这次,我能自信的对大家说:我终于给大家带了一个,能真正帮助大家解决诸多坑比场景的pub包! 将之前的flut ...
- 12 Flutter仿京东商城项目 商品列表页面请求数据、封装Loading Widget、上拉分页加载更多
ProductList.dart import 'package:flutter/material.dart'; import '../services/ScreenAdaper.dart'; imp ...
- 用Flutter开发的跨平台项目,完美运行在Android和IOS上,Material简洁风格,包括启动页、引导页、注册、登录、首页、体系、公众号、导航、项目,还有漂亮的妹子图库,运行极度流畅,结构清晰,代码规范,值得拥有
Flutter学习资源汇总持续更新中...... Flutter官方网站 Flutter中文网 wendux的Flutter实战 Flutter官方exampleflutter_gallery 阿里巴 ...
- Android程序员的Flutter学习笔记
作为忠实与较资深的Android汪, 最近抽出了一些时间研究了一下Google的亲儿子Flutter, 尚属皮毛, 只能算是个简单的记录吧. Google自2017年第一次提出Flutter, 到20 ...
- Flutter 开发小技巧
1.命令行运行flutter run之后iOS报错:Could not install build/ios/iphones/Runner.app on XXXXX. try lunching Xcod ...
- flutter 入口文件配置路由+加载页面
入口文件配置路由 1.路由信息 -- 加载页面 ,通常用于显示新的内容或者广告,加载完成之后进入主页面 -- 主页面 /app 2.配置页面 main.dart main.dart // main ...
随机推荐
- go程序基于阿里云CodePipeline的一次devops实践
背景 最近朋友有个项目代码托管用的码云,测试服务器(阿里云ECS)只有一台,三四个人开发,于是想基于阿里云的CodePipeline快速打造一套自动化cicd的流程,使用docker来进行多套环境部署 ...
- iptables详解(8)iptables自定义链
自定义链存在的意义:对链进行分类 target可能是一个“动作“也可能是一个”自定义链” 1.新增自定义链. root@ubuntu:~# iptables -t filter -N IN_WEB#结 ...
- java开发学生信息管理系统 源码
开发环境: Windows操作系统开发工具: Eclipse+Jdk+Tomcat+MYSQL数据库 运行效果图 源码及原文链接:https://javadao.xyz/forum.php?mo ...
- ES相关知识
ElkStack介绍 对于日志来说,最常见的需求就是收集.存储.查询.展示,开源社区正好有相对应的开源项目:logstash(收集).elasticsearch(存储+搜索).kibana(展示),我 ...
- fish 设置环境变量;fish shell 相关使用说明记录;
最近使用 fish进行工作,发现环境变量忘记如何设置: fish 环境变量保存在两个地方: ~ 目录下,.config/fish 目录下: /etc/fish/ 目录下 如果配置所有用户都能用的环境变 ...
- Lucene之查询索引
Query子类 TermQuery:根据域和关键词进行搜索 /** * termQuery根据域和关键词进行搜索 */ @Test public void termQuery() throws IOE ...
- appium+python+unittest+HTMLRunner登录自动化测试报告
环境搭建 python3Java JDK.netFrameworknodejsandroid SDKappiumAppium-Python-Client(pip install Appium-Pyth ...
- 使用JDBC分别利用Statement和PreparedStatement来对MySQL数据库进行简单的增删改查以及SQL注入的原理
一.MySQL数据库的下载及安装 https://www.mysql.com/ 点击DOWNLOADS,拉到页面底部,找到MySQL Community(GPL)Downloads,点击 选择下图中的 ...
- CMD命令下图片合成一句话木马命令
非常简单,我们只需要一张图片1.jpg一句话木马写好的php文件 1.php之后我们进入到命令行.注意:将php文件和图片文件放到同一目录下,cmd也要跳转到放文件的目录下之后执行命令 copy .j ...
- #《Essential C++》读书笔记# 第一章 C++ 编程基础
前言 Stanley B.Lippman 先生所著的<C++ Primer>是学习C++的一本非常优秀的教科书,但<C++ Primer>作为一本大部头书,显然不适合所有的初学 ...