如何在颤振中向可滚动小部件添加触觉反馈？

Question

如何将触觉反馈添加到可滚动小部件中？具体而言，在这两种情况下：

当可滚动小部件当前正在滚动时，

• ；当可滚动小部件到达可滚动区域的起始/结束边缘时，
• 。

第一种情况应该在整个事件期间经常发出轻微的触觉反馈，而第二种情况应该有一个更重的触觉反馈一次。

--这很糟糕，因为它没有触觉反馈，但它是所需的布局：

SingleChildScrollView(
      child: Column(
        children: [
          Container(height: 100, color: Colors.redAccent),
          Container(height: 100, color: Colors.blue),
          Container(height: 100, color: Colors.green),
          Container(height: 100, color: Colors.deepOrange),
          Container(height: 100, color: Colors.purple),
        ],
      ),
    );

期望的结果非常类似于几个基于苹果的滚动视图的工作方式。例如，Apple Watch在滚动时发出相同的触觉模式。

有触觉反馈将使滚动体验非常令用户愉快，也将有助于解决应用程序中的可访问性问题。

Answer 1

我经历了这个问题，并为此创建了一个包：https://pub.dev/packages/scrollable。

为了允许您的可滚动小部件发出触觉反馈，您可以将它包装在ScrollHaptics小部件中。默认情况下，这将起作用，但是，您也可以根据自己的喜好更改小部件的属性。

这是所提供的示例与ScrollHaptics 的外观：

ScrollHaptics( // <----- Added here!
      child: SingleChildScrollView(
        child: Column(
          children: [
            Container(height: 100, color: Colors.redAccent),
            Container(height: 100, color: Colors.blue),
            Container(height: 100, color: Colors.green),
            Container(height: 100, color: Colors.deepOrange),
            Container(height: 100, color: Colors.purple),
          ],
        ),
      ),
    );

，这里是另一个版本，为了示例而更改了一些属性：

ScrollHaptics( // <----- Added here, with example properties changed below.
      bubbleUpScrollNotifications: false,
      heavyHapticsAtEdgeEnabled: true,
      hapticEffectAtEdge: HapticType.medium,
      hapticEffectDuringScroll: HapticType.light,
      distancebetweenHapticEffectsDuringScroll: 55,
      child: SingleChildScrollView(
        child: Column(
          children: [
            Container(height: 100, color: Colors.redAccent),
            Container(height: 100, color: Colors.blue),
            Container(height: 100, color: Colors.green),
            Container(height: 100, color: Colors.deepOrange),
            Container(height: 100, color: Colors.purple),
          ],
        ),
      ),
    );