如何在同一个Progress Indicator中实现多个进度展示？

你要实现的是分段堆叠进度条，不需要从零开发自定义Widget，有更简便的实现方案：

• 直接调用UI库内置组件
  目前主流开发框架的配套UI库基本都内置了对应组件：
  Flutter生态可以直接用percent_indicator库的LinearPercentIndicator组件，传入多组进度值和对应色值即可；前端React/Vue生态的Ant Design、Element UI等也都自带分段进度条组件，配置对应参数就能快速生成目标效果。
• 基础组件组合实现
  如果所用框架没有现成组件，用基础容器拼接也能快速实现，不需要复杂的自定义绘制逻辑：
  外层写一个固定高度、带圆角、置灰的背景容器，内层按照每个进度的占比，放置多个对应宽度、不同背景色的子容器，按顺序横向排列即可。

只有当你需要定制特殊交互效果（比如分段可拖拽调整、悬浮显示各段数值、特殊入场动画）时，才需要基于官方基础Progress组件做少量二次开发。

参考示例效果：

内容的提问来源于stack exchange，提问作者Heartwin