Question

我需要制作一个滑块，该滑块可以完美地工作，它具有其划分，但是我需要做的是在每个划分中设置数字，我的意思是，如果滑块具有3个划分，则设置数字为1， 2、3之类的东西：

   1   2   3
---|---|---|---

有办法吗？

我正在使用的代码是这样的：

Slider(
  value: _place.value,
  min: 0.0,
  max: 10.0,
  divisions: 10,
  onChangeStart: (double value) {
    print('Start value is ' + value.toString());
  },
  onChangeEnd: (double value) {
    print('Finish value is ' + value.toString());
  },
  onChanged: (double value) {
    if (vm.isRatingPlace) {
      setState(() {
        _place.value = value;
      });
    }
  },
  activeColor: HeatMapColors.getOnFireColor(_place.value),
  inactiveColor: Colors.black45,
))

Answer 1

您可以使用Column并在顶部绘制值，请检查此示例：

     double value = 0.0;

      @override
      Widget build(BuildContext context) {
        return Scaffold(
            body: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            Padding(
              padding: const EdgeInsets.symmetric(horizontal: 15.0),
              child: Row(
                mainAxisAlignment: MainAxisAlignment.spaceBetween,
                children: List.generate(10, (index) => Text("$index")),
              ),
            ),
            Slider(
              value: value,
              min: 0.0,
              max: 10.0,
              divisions: 10,
              onChangeStart: (double value) {
                print('Start value is ' + value.toString());
              },
              onChangeEnd: (double value) {
                print('Finish value is ' + value.toString());
              },
              onChanged: (double newValue) {
                setState(() {
                  value = newValue;
                });
              },
              activeColor: Colors.blue,
              inactiveColor: Colors.black45,
            ),
          ],
        ));
      }

如何将数字放在Flutter Slider的顶部

1 个答案: