颤振如何保持指示器值显示？

Question

enter image description here

如何在页面运行时显示指标值

Answer 1

您可以在下面复制粘贴运行完整代码
您可以使用软件包https://pub.dev/packages/flutter_xlider
并将alwaysShowTooltip设置为true

代码段

FlutterSlider(
          values: [_lowerValue, _upperValue],
          max: 200,
          min: 50,
          rangeSlider: true,
          handlerAnimation: FlutterSliderHandlerAnimation(
              curve: Curves.elasticOut,
              reverseCurve: null,
              duration: Duration(milliseconds: 700),
              scale: 1.4),
          onDragging: (handlerIndex, lowerValue, upperValue) {
            _lowerValue = lowerValue;
            _upperValue = upperValue;
            setState(() {});
          },
          tooltip: FlutterSliderTooltip(
            alwaysShowTooltip: true,
          ),
        ),

工作演示

完整代码

import 'package:flutter/material.dart';
import 'package:flutter_xlider/flutter_xlider.dart';

class SliderDemo extends StatefulWidget {
  @override
  _SliderDemoState createState() => _SliderDemoState();
}

class _SliderDemoState extends State<SliderDemo> {
  double _lowerValue = 50;
  double _upperValue = 180;

  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("Sliders (Guess the Word's level)"),
      ),
      body: Center(
          child: Column(children: <Widget>[
        SizedBox(
          height: 50,
        ),
        FlutterSlider(
          values: [_lowerValue, _upperValue],
          max: 200,
          min: 50,
          rangeSlider: true,
          handlerAnimation: FlutterSliderHandlerAnimation(
              curve: Curves.elasticOut,
              reverseCurve: null,
              duration: Duration(milliseconds: 700),
              scale: 1.4),
          onDragging: (handlerIndex, lowerValue, upperValue) {
            _lowerValue = lowerValue;
            _upperValue = upperValue;
            setState(() {});
          },
          tooltip: FlutterSliderTooltip(
            alwaysShowTooltip: true,
          ),
        ),
      ])),
    );
  }
}

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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: SliderDemo(),
    );
  }
}