0

I need SfRangeSlider to display the tooltip below the slider instead of the top. As per here discussion here able to display the tooltip below the slider. It is displayed only when we change the slider. I need to display the tooltip below the slider all the time.

 Widget _buildThumbIcon(TextEditingController controller) {
    return Transform.translate(
      // Here 20 is thumb diameter and 5 is spacing between thumb and text.
      offset: const Offset(0, 25),
      child: OverflowBox(
        maxWidth: 150,
        child: TextField(
          textAlign: TextAlign.center,
          decoration:
          const InputDecoration(border: InputBorder.none, isDense: true),
          controller: controller,
        ),
      ),
    );
  }


 SfRangeSlider(

          activeColor: primary,
          inactiveColor: grey_e1,
            min: 1.0,
            max: 12.0,
          showTicks: true,
          showLabels: false,
           stepSize: 1,


           // interval: 1,
          //minorTicksPerInterval: 1,
          startThumbIcon: _buildThumbIcon(_rangeStartController),
          endThumbIcon: _buildThumbIcon(_rangeEndController),
          values: _values,
          onChangeStart: (SfRangeValues newValues) {
            _rangeStartController.text = _getFormattedText(newValues.start);
            _rangeEndController.text = _getFormattedText(newValues.end);
          },
          onChanged: (SfRangeValues newValues) {
            setState(() {
              _rangeStartController.text = _getFormattedText(newValues.start);
              _rangeEndController.text = _getFormattedText(newValues.end);
              _values = newValues;
            });
          },
          onChangeEnd: (SfRangeValues newValues) {
            _rangeStartController.text = "";
            _rangeEndController.text = "";
          },
        )
Gwhyyy
  • 7,554
  • 3
  • 8
  • 35
Siva
  • 81
  • 1
  • 9

0 Answers0