CODEWITHSUNDEEP
flutterslider
Mafaza
Mafaza

Reputation: 59

Left and right to cancel or confirm slider flutter

I need to use a slider which slides both to the left to cancel and right to confirm

this is the desired slider

I couldn't find a way to do it, is there any way to do it ?

Upvotes: 0

Views: 1143

Answers (2)

Tasnuva Tavasum oshin
Tasnuva Tavasum oshin

Reputation: 4750

Use Gesture Detector this Example :

@override
  Widget build(BuildContext context) {
    String swipeDirection;

    return GestureDetector(
      onPanUpdate: (details) {
        swipeDirection = details.delta.dx < 0 ? 'left' : 'right';
      },
      onPanEnd: (details) {
        if (swipeDirection == 'left') {
          //handle swipe left event
        }
        if (swipeDirection == 'right') {
          //handle swipe right event
        }
      },
      child: //child widget
    );
  }

Upvotes: 0

Gabriel Garcia
Gabriel Garcia

Reputation: 193

You can achieve it by using a Slider and customizing it.

...

double _currentSliderValue = 5;

Slider customSlider() {
    return Slider(
      value: _currentSliderValue,
      min: 0,
      max: 10,
      divisions: 10,
      onChanged: (double value) {
        setState(() {
          _currentSliderValue = value;
        });
        if (_currentSliderValue == 0) // Decline 
        else if (_currentSliderValue == 10) // Accept
        else // Nothing
      },
    );
  }

The UI can be achieved by including the customSlider() as a child of a Row widget as follows (didn't try it but it should be the right path):


Row declineOrAcceptSlider() {
    return Row(children: [
      Text("Decline"),
      customSlider(),
      Text("Accept")
    ], mainAxisAlignment: MainAxisAlignment.spacedEvenly);
}

Upvotes: 1

Related Questions