如何在 Flutter Range Slider 中使用渐变色答案

【问题标题】：How To Use Gradiant Color in Flutter Range Slider如何在 Flutter Range Slider 中使用渐变色
【发布时间】：2022-12-20 01:10:59
【问题描述】：

enter image description here

我想在我的 U.i 中使用这种类型的范围滑块

我想要没有任何库的有效解决方案

【问题讨论】：

参考this回答

标签： flutter dart user-interface

【解决方案1】：

在 Slider 中，您不能直接传递渐变，因为 Slider 只接受颜色。

但你可以添加容器和渐变颜色然后添加你的滑块

...

     Container(
        height: 10,
        width: 200,
        decoration: BoxDecoration(
          borderRadius: BorderRadius.circular(5),

          // gradient colors
          gradient: LinearGradient(colors: [
            Colors.red,
            Colors.blue,
          ]),
        ),
        child: SliderTheme(
          data: SliderThemeData(
            overlayShape: SliderComponentShape.noOverlay,
          ),
          child: Slider(
           
            // you have to transparent colors to show gradient colors
            activeColor: Colors.transparent,
            inactiveColor: Colors.transparent,
            thumbColor: Colors.green,
            onChanged: (v) => setState(() => value = v),
            value: value,
          ),
        ),

如果您在我的英语或我的解决方案中发现任何语法错误，请随时对其进行编辑 :)

【讨论】：