ColourSlider2.dart

class _ColourSliderState extends State<ColourSlider> {
  var fraction = 0.0;

  @override
  Widget build(BuildContext context) {
    debugPaintPointersEnabled = true;
    return GestureDetector(
      onPanUpdate: (DragUpdateDetails details) {
        RenderBox box = context.findRenderObject();
        Offset localOffset = box.globalToLocal(details.globalPosition);
        setState(() {
          fraction = localOffset.dx.clamp(0.0, 300) / 300;
        });
      },
      child: Container(
        width: 300,
        height: 50,
        child: CustomMultiChildLayout(
          delegate: _ColourSliderDelegate(),
          children: <Widget>[
            LayoutId(
              id: ColourSlider.track,
              child: Container(
                width: 300,
                height: 20,
                color: Colors.white,
              ),
            ),
            LayoutId(
              id: ColourSlider.thumb,
              child: Transform.translate(
                offset: Offset(fraction * 300, 0),
                child: Container(
                  width: 50,
                  height: 50,
                  color: Colors.red,
                ),
              ),
            ),
          ],
        ),
      ),
    );
  }
}