Flutter Slider设置overlayColor不生效、仍显示thumbShape对应颜色如何解决

问题产生原因 #

• 你给overlayShape参数错误使用了RoundSliderThumbShape类，该类是为滑块圆点（thumb）设计的形状实现，绘制逻辑默认读取thumbColor配置，不会响应你设置的overlayColor，所以自定义的overlay颜色无法生效。
• RoundSliderThumbShape没有适配overlay的绘制逻辑，即使传入了自定义的overlayColor也不会被读取使用。

修复方法 #

将overlayShape的实现替换为专门适配overlay层的RoundSliderOverlayShape类即可，注意该类的尺寸参数为overlayRadius，修改后的完整代码如下：

SliderTheme(
  data: SliderTheme.of(context).copyWith(
    thumbColor: Color(0xFFEB1555),
    activeTrackColor: Colors.white,
    thumbShape: RoundSliderThumbShape(enabledThumbRadius: 15.0),
    // 替换为Overlay专用的形状类
    overlayShape: RoundSliderOverlayShape(overlayRadius: 25.0),
    overlayColor: Color(0x29EB1555),
  ),
  child: Slider(
    value: height.toDouble(),
    min: 122.0,
    max: 220.0,
    inactiveColor: Color(0xFF8D8E98),
    onChanged: (double newValue) {
      setState(() {
        height = newValue.round();
      });
    },
  ),
)

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