如何在 Slider flutter 中更改分区的颜色

Question

你好，我有带分区的滑块。属性更改分区颜色使其不可见的主题是什么？

Answer 1

您可以通过改变ColorScheme的原色来改变滑块的颜色，但需要为所有颜色赋值。

colorScheme: ColorScheme(
        primary: Colors.amber,
        primaryVariant: Colors.amber,
        secondary: Colors.amber,
        secondaryVariant: Colors.amber,
        surface: Colors.amber,
        background: Colors.amber,
        error: Colors.amber,
        onPrimary: Colors.amber,
        onSecondary: Colors.amber,
        onSurface: Colors.amber,
        onBackground: Colors.amber,
        onError: Colors.amber,
        brightness: Brightness.light),

Answer 2

你可以用 SliderTheme 小部件包裹你的滑块，然后在 SliderThemeData[=18 里面添加 SliderThemeData =], 其中 TickMark 定义除法，你会发现改变 TickMark 颜色的属性，这是一个例子

data: SliderThemeData( activeTickMarkColor: Colors.transparent, inactiveTickMarkColor: Colors.transparent, thumbColor: ColorAssets.themeColorMagenta, activeTrackColor: ColorAssets.themeColorMagenta, inactiveTrackColor: Colors.white, ), child: Slider( value: textSliderValue, min: 0, max: 20, divisions: 20, ), )

Answer 3

请查看此示例，如果您需要任何进一步的帮助，请告诉我：

SliderTheme(
  data: SliderTheme.of(context).copyWith(
    trackHeight: 10.0,
    minThumbSeparation: 2,
    thumbColor: Colors.white,
    thumbShape: RoundSliderThumbShape(enabledThumbRadius: 12.0),
    overlayColor:Colors.deepPurple,
    inactiveTickMarkColor: Colors.amber,
    inactiveTrackColor: Colors.green,
  ),
  child: Slider(
    min: 1,
    max: 100,
    value: 45,
    divisions: 2,
    onChanged: (newValue) {
      // set the new value here
      setState(() {
        progress= newValue;
      });
    },
  ),
)

让我们演示一些参数：

用于更改分区颜色的主要参数是 SliderTheme 对象中的 inactiveTickMarkColor 参数，在我们的例子中它是琥珀色。 随意更改它。
inactiveTrackColor 参数是当区域不在活动范围内时滑块的颜色。
overlayColor 参数是当您按下或聚焦在选择器小部件上时出现的小部件的颜色。

如何在 Slider flutter 中更改分区的颜色

How to change color of divisions in Slider flutter

colors

slider

division

flutter