Flutter中如何修改Stepper组件的线条颜色？

要修改Stepper的线条颜色，仅设置canvasColor是不够的，需要通过ThemeData的配色体系来针对性配置。以下是完善后的代码：

Theme(
  data: ThemeData(
    canvasColor: whiteColor,
    // 配置步骤线条与指示器的配色
    colorScheme: ColorScheme.fromSwatch()
        .copyWith(
          primary: Colors.blue, // 已激活步骤的线条、指示器颜色
          onSurface: Colors.grey.shade300, // 未激活步骤的线条颜色
        ),
    // 全局设置Stepper分隔线颜色（可选，作为兜底配置）
    dividerColor: Colors.grey.shade300,
  ),
  child: Stepper(
    type: StepperType.horizontal,
    steps: getSteps(),
    currentStep: currentStep,
    elevation: 2,
  ),
)

核心配置说明： #

• colorScheme.primary：控制已激活步骤的线条和圆形指示器的高亮颜色，对应你需要的高亮线条部分。
• colorScheme.onSurface：控制未完成/未激活步骤的线条颜色，对应灰色线条部分。
• dividerColor：全局定义Stepper分隔线的基础颜色，当配色方案未覆盖时生效。

如果需要更个性化的定制（比如某一步骤单独设置线条颜色），可以在getSteps()方法返回的Step组件中，通过自定义icon和state属性来实现，但常规场景下通过Theme全局配置即可满足需求。

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