解决slider 左右两边顶不到头,有pading

219 阅读1分钟
import 'package:flutter/material.dart';

class HorizSeekbarWidget extends StatelessWidget {
  final double height;
  final int value;
  final ValueChanged<double> onChange;
  final ValueChanged<double> onChangeStart;
  final ValueChanged<double> onChangeEnd;

  const HorizSeekbarWidget(
    this.height,
    this.value,
    this.onChange,
    this.onChangeStart,
    this.onChangeEnd,
  );

  @override
  Widget build(BuildContext context) {
    return SliderTheme(
      data: SliderTheme.of(context).copyWith(
        trackShape: WDCustomTrackShape(),
        trackHeight: height,
        // 滑轨的高度
        activeTrackColor: Colors.red,
        //已滑过轨道的颜色
        inactiveTrackColor: Colors.grey,
        //未滑过轨道的颜色
        thumbShape: const RoundSliderThumbShape(
          enabledThumbRadius: 0,
        ),
        thumbColor: Colors.transparent,
        //滑块中心的颜色(小圆头的颜色)
        overlayColor: Colors.transparent,
        //滑块边缘的颜色
        overlayShape:
            const RoundSliderOverlayShape(overlayRadius: 15), //滑块外圈大小 15
      ),
      child: Slider(
        value: value.toDouble(),
        min: 0,
        max: 100,
        // thumbColor: ,
        onChanged: onChange,
        onChangeStart: onChangeStart,
        onChangeEnd: onChangeEnd,
        divisions: 100,
        // allowedInteraction:SliderInteraction,
      ),
    );
  }
}
class WDCustomTrackShape extends RectangularSliderTrackShape {

  ///去掉默认边距
  @override
  Rect getPreferredRect({
    required RenderBox parentBox,
    Offset offset = Offset.zero,
    required SliderThemeData sliderTheme,
    bool isEnabled = false,
    bool isDiscrete = false,
  }) {
    final double trackHeight = sliderTheme.trackHeight??1;
    final double trackLeft = offset.dx;
    final double trackTop =
        offset.dy + (parentBox.size.height - trackHeight) / 2;
    final double trackWidth = parentBox.size.width;
    return Rect.fromLTWH(trackLeft, trackTop, trackWidth, trackHeight);
  }
}