flutter - 检查RangeSlider中的哪个Thumb(左或右)滑动

标签 flutter slider rangeslider

我正在使用 RangeSlider。我需要根据(左或右 Thumb 是滑动)更改 Text 的值。我可以根据 Thumb slide 获取 rangeValue 的值,但我想具体知道滑动了哪个 thumb。

               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";
                          }
                        });
                      }) 

最佳答案

这对你有用:

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;
                });
              }),
        ],
      ),
    );
  }
}

关于flutter - 检查RangeSlider中的哪个Thumb(左或右)滑动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57622186/

相关文章:

firebase - flutter中如何检查文档是否存在?

jquery - 如何在 jQuery 插件中插入图像横幅 slider 的链接?

jquery - Owl Carousel : jump to a slide with an certain id

iPhone 范围 slider

javascript - 动态改变最大范围和 document.getElementById

flutter - 如何在 ListView 中添加滚动指示器

dart - Flutter - float 操作按钮 - 隐藏项目的可见性

css - 在 ion.rangeslider 上突出显示一个范围

firebase - 使用 flutter 从 firebase 实时数据库中读取 child 的数量

angularjs - Angular 范围 slider 的附加 handle 值不显示值