Flutter Slider自定义滑块样式 Slider的label标签框常显示

在Flutter中，要自定义滑块样式并使Slider的label标签框始终显示，您可以使用Slider控件的label参数和valueIndicatorShape参数。label参数允许您显示一个固定的标签，而valueIndicatorShape可以自定义滑块滑块的样式。

以下是一个示例代码，展示了如何自定义滑块滑块并使标签框始终显示：

import 'package:flutter/material.dart';
 
void main() => runApp(MyApp());
 
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: Center(
          child: Slider(
            value: 0.5,
            label: '${0.5.toStringAsFixed(1)}', // 设置标签显示当前值
            activeColor: Colors.blue, // 滑块颜色
            inactiveColor: Colors.grey, // 轨道颜色
            valueIndicatorColor: Colors.red, // 值指示器颜色
            valueIndicatorShape: RoundSliderValueIndicatorShape(), // 使值指示器变成圆形
            onChanged: (value) {
              // 处理滑动事件
            },
          ),
        ),
      ),
    );
  }
}

在这个例子中，label属性被设置为一个固定的字符串，显示在滑块的上方。valueIndicatorShape被设置为RoundSliderValueIndicatorShape，使得滑块的值指示器显示为圆形。这样，滑块的标签框将始终显示。