如何创建二级循环进度指示器? [英] How to create two level circular progress indicator?

问题描述

以下是我要实现的目标

我正在查看循环百分比指标"库，但是该库不提供此功能

I was having a look at the Circular Percent Indicator library but that does not provide this functionality

以下是在本机Android开发中实现的 https://github.com/grmaciel/two-level-circular-progress-酒吧

The following is achieve in native Android Development https://github.com/grmaciel/two-level-circular-progress-bar

但是如何将其移植到Flutter?

but how to port it to Flutter?

推荐答案

您可以通过使用 stack 小部件来实现此效果，它将使您将两个指示器放置在相同的位置上，这将获得完成重叠的效果:

You can achieve this effect by using a stack widget, it will allow you to place both indicators on an identical position which will get the effect of overlapping done :

Stack(
  children: <Widget>[
    CircularProgressIndicator(
      value: 0.8,
      valueColor: AlwaysStoppedAnimation<Color>(Colors.purple),
    ),
    CircularProgressIndicator(
      value: 0.6,
      valueColor: AlwaysStoppedAnimation<Color>(Colors.green),
    ),
  ]
);

这篇关于如何创建二级循环进度指示器?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！