Flutter按钮切换进度时带过度动画的插件 state_loading_button，可动态改变进度颜色

最新推荐文章于 2024-04-22 14:07:04 发布
最新推荐文章于 2024-04-22 14:07:04 发布
阅读量279 收藏
点赞数
分类专栏： Flutter 文章标签： 动画 flutter
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_31329349/article/details/131062768
版权

Flutter按钮切换进度时带过度动画的插件 state_loading_button，可动态改变进度颜色

功能

最近做下载更新功能时，需要一个带按钮-进度过度动画的控件，找了一下没有合用的，于是自己写了一个简单插件，主要亮点就是加载过程中能动态设置进度属性，自定义各种按钮状态，可用于登录下载等场景。

效果图

请添加图片描述
图糊得很，将就看吧，大概就这些，太简单就不多说了，具体使用看插件内demo

插件地址：state_loading_button

雪枫轻语
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论
专栏目录
flutter 实现一个有加载动画的按钮（loadingButton）
smileKH的博客
07-05 2522
flutter：loadingbutton
flutter 中的动画详解 全网最全 动画一篇搞定 一万四千字
半身风雪
08-16 2356
学习 Flutter 中的动画和过渡是构建流畅用户界面的关键部分之一。这里我整理了一个主要的学习路径，可以帮助你逐步掌握 Flutter 中的动画和过渡技术，希望能够帮助到你自定义动画（Custom Animations）是指通过自定义代码来实现特定的动画效果，以满足特定的设计需求。在 Flutter 中，你可以使用来绘制自定义的图形，或使用封装动画逻辑，从而创建高度自定义的动画效果。使用可以绘制自定义的图形和动画。你需要实现类并重写paint方法，在其中定义绘制逻辑。@override。
flutter 按钮动画 AnimatedPress
最新发布
weixin_43575775的博客
04-22 963
【代码】flutter 按钮动画 AnimatedPress。
flutter开发实战-实现左右来回移动的按钮引导动画效果
一名开发者
08-10 1378
flutter开发实战-实现左右来回移动的按钮引导动画效果最近开发过程中需要实现左右来回移动的按钮引导动画效果。AnimationController用来控制一个或者多个动画的正向、反向和停止 动画等相关操作。在默认情况下AnimationController是按照线性进行动画播放的。
flash一个按钮控制动画_flutter闪屏过渡动画，闪光占位动画
weixin_39756273的博客
11-30 172
在程序设计的理念中，讲究一切都来源于物理世界，在现实世界中，人们在每接触到一个新的事物或者说在手指触碰到一个事物时，总是心里默许期望有一个反馈效果，这就是来源于心底深处常常被人忽略的一个潜在期望。在程序的世界中，在页面未加载出数据时，给出一个闪光过度动画，可以间接的满足使用都心底那一点点潜在的欲望需求。实现闪光过渡动画效果如下：在Flutter开发中，小编以将这个效果封装成一个Flash...
Flutter Widget控件切换过渡动画 AnimatedSwitcher
qq_35364808的博客
08-05 2902
先上效果图 直接上代码（然后下面是控件的具体用法） AnimatedSwitcher( transitionBuilder: (child, anim) { return ScaleTransition( child: child, scale: anim, ); }, duration: Duration(milliseconds: 350), child: IconButton( key: ValueKey(_icon), .
flutter_web_loading_animation:为Flutter Web App启动加载加载动画
05-01
"flutter_web_loading_animation"项目正为此目的而设计，它提供了一个启动加载动画，使得Flutter Web App在加载过程中不会显得过于空白和无响应，从而提高用户对应用程序的第一印象。 1. **Flutter Web与加载动画**...
ANIMATED_BITMAP_BUTTON.rar_按钮 动画
09-20
这个名为"ANIMATED_BITMAP_BUTTON.rar_按钮 动画"的压缩包显然包含了一个特殊的按钮元素，它具备了三维效果和动态特性。下面，我们将深入探讨这个主题，并围绕按钮动画及其在编程中的实现进行详细阐述。 首先，让...
progress-state-button:Flutter Android，iOS和Web的可自定义进度按钮小部件
04-30
Flutter的可自定义进度按钮 使用测试 安装 progress_state_button: "^1.0.3" 用法 图标 ProgressButton.icon(iconedButtons: { ButtonState.idle: IconedButton( text: "Send", icon: Icon(Icons.send,color:...
audio_service:Flutter 插件可在屏幕关闭时在后台播放音频
08-04
此插件环绕您现有的音频代码，使其能够在后台运行或在屏幕关闭的情况下运行，并允许您的应用与耳机按钮、Android 锁屏和通知、iOS 控制中心、可穿戴设备和 Android Auto 进行交互。 它适用于： 音乐播放器 文字转...
future_button:可自定义的Material和Cupertino按钮，带有进度指示器等
05-10
future_button 可自定义的Material和Cupertino按钮以及进度指示器等。 如果您想在用户按下按钮时运行一些后台任务，然后显示任务结果，则很有用。 如何使用它 用法非常简单-目前支持5种类型的按钮： ...
Flutter Slider 进度条
10-21
Flutter Slider 进度条
一个MaterialFlutterButton支持进度和错误视觉效果
08-10
一个Material Flutter Button，支持进度和错误视觉效果
Flutter 进度条组件
xiangxiongfly
05-31 2316
模糊进度条 具体进度条 环形进度条 模糊进度条 具体进度条 设置尺寸 LinearProgressIndicator和CircularProgressIndicator没有提供设置尺寸的参数，它们是去父容器的尺寸作为绘制的边界，这时可以借助SizedBox、ConstrainedBox限制指定尺寸。 环形进度条设置尺寸 进度条动画 3秒内进度条颜色由灰色变为蓝色。 iOS风格...
【Flutter】【进度条】进度条 功能的内置widget 使用
自动人生博客
09-21 826
【代码】【Flutter】【进度条】进度条 功能的内置widget 使用。
【Flutter入门到进阶】Flutter基础篇---动画
Yvan
03-06 1492
隐式动画显式动画自定义隐式动画、自定义显式动画Hero 动画AnimatedContainer的属性和Container属性基本是一样的，当AnimatedContainer属性改变的时候就会触发动画。flag;});
Flutter仿抖音点击进入直播间按钮动画实现
Welcome To As.Kai 's Home
11-16 2298
利用flutter仿抖音’点击进入直播间’动画效果 效果图： 对于这个widget 已经封装成插件 供大家依赖使用 askai_animation_button: ^last version 组件的一些必选属性： const KaiAnimationButton( {Key? key, required this.text, //按钮内文字 required this.innerCircleColor, //内圈的颜色渐变 List类型[begin,end]
flutter 点击旋转动画_Flutter 实现底部扩散模糊动画：页面交互
weixin_39649614的博客
12-24 360
作为一个炫(pin)酷(ru)的页面，页面中的交互也非常的重要。在本篇，我将进一步说明页面内各个位置的交互细节，从而带着各位做一个不将就的强迫症~效果图：完整demo及组件已上传至项目，走过路过留个star~交互要素页面中的交互主要包含三个触发位置：点击空白的模糊处，页面会执行退出和退出动画；点击页面上的返回或关闭按钮，页面会执行退出和退出动画；元素渐显并带有其他效果。接下来将逐点说明如何实现。实...
flutter 使用插件flutter_swiper_view实现走马灯的左右按钮，点击可让走马灯左右滑动
07-14
您可以使用 `flutter_swiper` 插件来实现走马灯效果，并通过自定义按钮来控制左右滑动。以下是一个示例代码： 首先，在 `pubspec.yaml` 文件中添加 `flutter_swiper` 插件的依赖： ```yaml dependencies: flutter...

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

雪枫轻语

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付：¥1
获取中
扫码支付

您的余额不足，请更换扫码支付或充值

打赏作者

实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值