滑块，不允许滑过值X，这不是最小值或最大值

Question

我创建了此问题的简化小吃：https://snack.expo.io/@noitsnack/range-slider

适用于Android和iOS。我创建了一个这样的滑块：

render() {
    return <Slider minimumValue={0} maximumValue={100} value={this.state.value} onSlidingComplete={this.setValue} />
}

setValue = value => this.setState(() => ({ value }))

现在滑块不是精确控制的组件。用户可以自由滑动，然后在释放后，设置值。我们可以尝试使用onValueChange来控制它，它会控制它，但是用户滑动的视觉效果非常糟糕。

我想阻止滑块滑过70.所以在伪代码中它是这样的：

<Slider minimumValue={0} maximumValue={100} maxSlideValue={70} />

我知道这maxSlideValue并不存在。但是有办法做到这一点吗？甚至本地修改Slider实现来实现这个目标？

更多信息

这是我的实际用例。屏幕截图底部。我们看到覆盖滑块的位置绝对超过彼此。我正试图制作一个＆＃34;范围＆＃34;滑块，其中开始时间不能超过结束时间（并且结束时间不能超过开始时间）。

我在这个屏幕截图中有三件事需要解决：

1. 如何重叠该结束滑块，但如果按开始点，则允许与start进行交互，如果结束点，则允许与end进行交互。
2. 只制作＆＃34; union＆＃34;暗红色线条显示。因为我想表达＆＃34;介于＆＃34;。
之间
3. 我在这个问题中询问的问题，如何制作起点，不要超过终点。并且结束点不在开始点之前。