时间戳

首页 > 解决方案 > 颤动中的多向滚动

flutter - 颤动中的多向滚动

问题描述

我来自 Web 开发背景，并且习惯于创建一个同时具有 x 和 y 溢出的元素（允许向任何方向滚动）。我正在努力使用 Flutter 实现相同的功能。

翻阅文档，我找到了 SingleChildScrollView，但它只允许 Axis.horizo​​ntal 或 Axis.vertical，而不是两者。

所以我尝试了以下方法：

return SingleChildScrollView( // horizontal scroll widget
    scrollDirection: Axis.horizontal,
        child: SingleChildScrollView( // vertical scroll widget
            scrollDirection: Axis.vertical,
            child: ...content of the container etc...
        )
    );

这适用于 x 和 y，但它不允许对角滚动。

有没有办法实现对角滚动，或者有没有更好的材料小部件，我完全错过了？

谢谢

标签： flutterflutter-layout

解决方案

我设法找到了一个解决方案，虽然它并不完美：

我创建了一个 StatefulWidget，Offset _scrollOffset它使用带有 Transform 类型的子元素的 ClipRect。变换矩阵 ( Matrix4.identity()..translate(_offset.dx, _offset.dy)) 应用于变换。

AGestureDetector分配了一个 onPanUpdate 回调来更新滚动位置。_scrollOffset += e.delta. 如果滚动位置太低或太高，这可以通过设置滚动位置来限制在小部件的边界内。

Animation 和 AnimationController 用于设置投掷速度。onPanEnd 提供最后一个平移的速度，因此只需根据该速度执行一个带有弹跳的 Tween。

动画在 TapDown 上停止，因此用户可以停止滚动速度。

这样做的主要问题是它不能完美地模仿 Android 或 iOS 的滚动速度，尽管我正在努力尝试使用 Flutter 提供的 ScrollSimulation 类让它更好地工作。

推荐阅读