flutter的CircularProgressIndicator基本使用

CircularProgressIndicator

循环进度指示器视图

定义及作用

  • 循环进度指示器视图。
  • 在页面绘制一个循环进度指示器视图。

参数

复制代码
const CircularProgressIndicator({
    super.key,
    super.value,
    super.backgroundColor,
    super.color,
    super.valueColor,
    this.strokeWidth = 4.0,//条的宽度
    super.semanticsLabel,//描述CircularProgressIndicator的预期用途
    super.semanticsValue,//为屏幕阅读器提供有关当前进度的信息,给盲人用的,比如设置0.3这个进度时,就会为盲人读30%
})

代码示例

无限循环指示器

复制代码
CircularProgressIndicator(
    backgroundColor: Colors.blue,
    valueColor: AlwaysStoppedAnimation<Color>(Colors.red),
)

能显示进度的指示器

  • 设置了value就会让指示器固定到对应比例的长度
    • 可以用于下载时显示进度,更新value的值并且setstate重绘制即可

      CircularProgressIndicator(
      value: 0.3,
      backgroundColor: Colors.blue,
      valueColor: AlwaysStoppedAnimation<Color>(Colors.red),
      )

相关推荐
西西学代码44 分钟前
Flutter---个人信息(1)---实现简单的UI
开发语言·javascript·flutter
程序员老刘3 小时前
Dart宏被砍掉的真相:为什么Go、Python、Java等高级语言都拒绝宏?
flutter·编程语言·dart
月伤597 小时前
Flutter中的Text换行问题
flutter
东哥很忙XH9 小时前
flutter开发的音乐搜索app
android·javascript·flutter
默默_david9 小时前
在Flutter中使用信号量解决异步冲突
flutter·dart
星释9 小时前
鸿蒙Flutter三方库适配指南: 05.使用Windows搭建开发环境
windows·flutter·harmonyos
倾云鹤11 小时前
搭建Flutter本地私有库
flutter
芝麻开门-新起点11 小时前
Flutter 网络通信协议:从原理到实战,选对协议让 APP 飞起来
flutter·ui·性能优化
消失的旧时光-194320 小时前
Flutter 异步进阶:Isolate 与 compute 的性能优化实践
flutter
nicepainkiller21 小时前
Flutter Loading 的封装
flutter