android - 如何在 Android 中创建非线性 slider ？

Question

我想添加一个 slider 来定义 map 中的搜索半径。当半径较小时，每一米都很重要，因此 slider 应允许进行细粒度的更改。当半径变大时，例如 5 公里和 6 公里之间的差异很小，因此无需花费很多像素进行细粒度控制。

这只是许多非线性 slider 有用的示例 (this page details usability issues related to linear scales)，但我在 Material 中找不到任何引用资料或 Flutter sliders .很遗憾，因为它们已经有了独立的 slider ；唯一缺少的部分是接受值列表而不是单步递增，这就完成了!

这是一个非线性 slider 的示例，它与我所寻找的(取自 UI Movement)有些相似:

我错过了什么吗？有没有办法在 Android/Flutter 中快速实现它，或者我是否需要为此制作一个完全自定义的组件？

Answer 1

您可以通过拥有一个可能值的列表，然后使用 slider 索引列表中的元素来实现类似的功能。

class ListSlider extends State{

  List<String> items = ['one','two','four','eight'];
  int selectedIndex = 0;

  setSelected(int value) {
    setState(() {
      selectedIndex = value;
    });
  }

  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(items[selectedIndex]),
        Slider(
          min: 0,
          max: items.length -1,
          divisions: items.length -1
          onChanged: (double value) => setSelected(value.round())
        )
      ]
    );
  }
}

另一种可能对数字特别感兴趣的方法是使用范围为 (0.0, 1.0) 的 slider ，然后通过二次动画曲线转换 slider 的输出。