如何在 Flutter 中为 CircularProgressIndicator 添加圆角边框？

Question

我想按照上图实现进度指示器的角点。

Answer 1

向 LinearProgressIndicator 添加圆形边框可以轻松完成，但这与 CircularProgressIndicator 不同，因为 flutter 库中尚未提供支持。

这个问题已经在这里提出，flutter团队给出的解决方案在这里。

因此，在这里我们可以为这个问题提供一个干净的自定义解决方案，即只需将 ..StrokeCap = StrokeCap.round添​​加到默认的 CircularProgressIndicator 类中。

将类CircularProgressIndicator和ProgressIndicator的源代码复制到代码存储库中的单独文件中，并根据您的要求在_CircularProgressIndicatorPainter中添加 strokeCap 值。

就这样吧。您将获得上图中预期的指示器。