flutter 具有多个值的自定义循环进度指示器[已关闭]

bejyjqdl  于 2023-01-31  发布在  Flutter
关注(0)|答案(1)|浏览(200)

已关闭。此问题需要超过focused。当前不接受答案。
**想要改进此问题吗?**更新此问题,使其仅关注editing this post的一个问题。

昨天关门了。
Improve this question
我想创建一个圆形进度指示器,如下所示:

如何做到这一点?

hfyxw5xn

hfyxw5xn1#

您可以在CircularProgressIndicator()中使用类似这样的多色。

import 'package:flutter/material.dart';
 import 'package:flutter_screenutil/flutter_screenutil.dart';
 import 'package:mis/app_extensions.dart';

class LoadingIndicator extends StatefulWidget {
const LoadingIndicator({ Key? key,}) : super(key: key);

@override
State<LoadingIndicator> createState() =>_LoadingIndicatorState();
}

class _LoadingIndicatorState extends State<LoadingIndicator>
with SingleTickerProviderStateMixin {
late AnimationController animationController;

@override
void initState() {
animationController =
    AnimationController(vsync: this, duration: Duration(seconds: 1));
animationController.repeat();
super.initState();
}

@override
void dispose() {
animationController.dispose();
super.dispose();
}

@override
Widget build(BuildContext context) {
return Container(
  alignment: Alignment.center,
  child: CircularProgressIndicator(
    valueColor: animationController
        .drive(ColorTween(begin: AppColors.blueTop, end: AppColors.red)),
  ),
);
}
}

相关问题