How can I increase the "touch zone" of my Flutter slider widget?

Question

I am using a Flutter slider widget, where tapping/dragging on the slider moves the progress/activeColor of the slider. However, it seems like only directly touching the slider causes an event to happen, and it's hard to always touch a finger directly onto the slider. Is there a way to expand the Slider's "touch zone"? This is what I have:

return new Center(
    child: new Container(
      height: 2.0,
      child: new Slider(
        min: 0.0,
        max: 1.0,
        activeColor: Colors.grey[50],
        value: _getUnitProgress(model),
        onChanged: (double value) => _unitSeek(value, model),
      ),
   ),
);

Answer 1

I faced a very similar issue recently and found that it was too easy a problem!

The flutter slider which you are using is in itself a renderBox which detects gesture all over it's given area (it uses a GestureArena), the only thing you have to do is too increase the tap area is that you give the widget more area, one of the easiest way to do that is that wrap the slider in a container and give the container enough height and width!

return Container(
  height: 100,
  child: Slider(
    value: _value.toDouble(),
    min: 1,
    max: 10,
    divisions: 10,
    label: _value.toString(),
    onChanged: (double newValue) {
      setState(() {
          _value = newValue.round();
        },
      );
    },
  ),
);

In this example the container height is 100 thus the tap area in this case will be 50 above the slider and 50 below, the slider will be exactly in the middle.

Hope it helps!