Flutter - 自定义滑块数值指示器。如何获得滑块的中心位置。

Question

我正试图为flutter slider实现一个自定义的进度指示器。就目前而言，我有给定的代码来绘制指标。

class InsideSliderValueIndicator extends SliderComponentShape {
  @override
  Size getPreferredSize(bool isEnabled, bool isDiscrete) {
    return Size.zero;
  }

  @override
  void paint(
    PaintingContext context,
    Offset center, {
    Animation<double> activationAnimation,
    Animation<double> enableAnimation,
    bool isDiscrete,
    TextPainter labelPainter,
    RenderBox parentBox,
    SliderThemeData sliderTheme,
    TextDirection textDirection,
    double value,
  }) {
    final sliderWidth = parentBox.size.width;
    final sliderBoxOffset = parentBox.localToGlobal(Offset.zero);
    labelPainter.paint(
        context.canvas,
        Offset(sliderBoxOffset.dx  + sliderWidth / 2 - labelPainter.width / 2,
            center.dy - labelPainter.height / 2));
  }
}

我还自定义了滑块以去除拇指。下面是它的样子。

如你所见，文字在滑块中没有居中。

这段代码的问题在于 sliderBoxOffset 不返回 "滑块 "的盒子，而是返回父卡的盒子，而且 center 实际上是你的拇指在滑块上相对于父体的位置。

所以我的问题是: 如何从给定的参数中得到滑块的中心？

谢谢您的帮助

Answer 1

我发现了一个奇怪的解决方案，它适用于我的使用情况。

    final sliderWidth = parentBox.size.width;
    final halfSliderWidth = sliderWidth / 2;
    final translateX = value < 0.5 ? halfSliderWidth - (value * sliderWidth) : halfSliderWidth - (value * sliderWidth);
    labelPainter.paint(context.canvas, center.translate(translateX - labelPainter.width / 2, -labelPainter.height / 2));

不过我很确定，如果滑块不在其父体的中心位置，这个方法是行不通的。我仍然想知道是否有一个不那么肮脏的方法来做这件事。