Jiten Basnet
Jiten Basnet

Reputation: 1820

Check which Thumb(left or right) in the RangeSlider is slide

I am Using RangeSlider. I need to change the value of Text based on the (left or right Thumb is slide). I can get the value of rangeValue based on Thumb slide but I want to specifically know which thumb has been slided.

               RangeSlider(
                      values: rangeValues,
                      min: 0.0,
                      max: 11,
                      divisions: 11,
                      onChanged: (value) {
                        setState(() {
                          rangeValues = value;
                          if(rangeValues.start>=0){
                            range="start";
                          }
                          else if (rangeValues.end>=0){
                            range = "end";
                          }
                        });
                      }) 

Upvotes: 1

Views: 1197

Answers (1)

Mazin Ibrahim
Mazin Ibrahim

Reputation: 7889

This will work for you :

enter image description here

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  final appTitle = 'RangeSlider Thumb Detection ';

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: appTitle,
      home: MyHomePage(title: appTitle),
    );
  }
}

class MyHomePage extends StatefulWidget {
  final String title;

  MyHomePage({Key key, this.title}) : super(key: key);

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage>{

  RangeValues rangeValues = RangeValues(0.3, 0.7);

  String range = 'No meovement yet !';

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text(widget.title)),
      body: Column(
        mainAxisAlignment: MainAxisAlignment.spaceEvenly,
        children: <Widget>[
          Text(range, style: TextStyle(fontSize: 22.0,),),
          RangeSlider(
              values: rangeValues,
              min: 0.0,
              max: 11,
              divisions: 11,
              onChanged: (value) {
                setState(() {
                  if(value.start != rangeValues.start){
                    range = 'Left thumb';
                  }
                  if(value.end != rangeValues.end){
                    range = 'Right thumb';
                  }
                  rangeValues = value;
                });
              }),
        ],
      ),
    );
  }
}

Upvotes: 2

Related Questions