flutter - 如何禁用 PageView 边缘的动画？

Question

我希望用户在 PageView 中的页面之间滚动，但我不想在他们尝试在第一页之前和最后一页之后滚动时向他们显示动画。我可以在彩色动画、黑色动画和不滚动之间切换，但我找不到任何禁用动画的可能性。

如果没有这种可能性，我怎样才能改变那个动画的颜色或者至少让它透明？

Answer 1

根据您的屏幕截图，我可以说您正在为您的 PageView 使用 BouncingScrollPhysics。 iOS 设备通常使用此行为。尽管如此，我还查看了您提供的全部源代码 here .

出了什么问题

您添加了 PageView，但没有在顶层添加 Scaffold 或 Material 小部件，这就是为什么PageView 为黑色。

https://dartpad.dev/c709e410d0a68248ac5b387b3bc6af93

来自文档:

Scaffold implements the basic material design visual layout structure.

如果没有这个小部件，您会注意到您的应用可能会占据设备的整个屏幕，包括通知栏，因为它 (PageView) 不知道状态栏的位置在屏幕上。

你能做什么

我注意到在 PageView 中添加的所有子项都有单独的 Scaffold 和 AppBar，it's not really necessary to nest scaffolds你可能想使用 TabBarView而不是 PageView，并让父小部件通过 TabController 处理 AppBar 更改.

但如果您认为重构会花费太多精力，请随时查看以下选项，这些选项需要进行最少的更改以满足您的需求:

选项 1。您可以将小部件包装在 Scaffold 小部件中。

https://dartpad.dev/4620ff91444353f5e000d2063594bd96

选项 2. 鉴于嵌套 Scaffold 小部件不是一个好的做法，您可以只使用普通的 Material 小部件来包装您的 PageView 以及用 Scaffold 小部件包裹的子项。

https://dartpad.dev/43f8730e5592ce1f96193fc01f08a29c

These solutions will change the background color of the PageView from black to white.

选项 3。如果你真的想摆脱动画，最简单的破解方法是改变你的滚动物理:

physics: ClampingScrollPhysics(),

但是，当您尝试在屏幕末端滑动时，这仍然会产生发光或波纹效果。

为了进一步消除这种影响，我将与您分享这些 SO 答案:

• How to remove scroll glow? (适用于 Android)
• How to remove overscroll on ios? (适用于 iOS)

进一步阅读

• https://api.flutter.dev/flutter/widgets/ScrollPhysics-class.html
• https://medium.com/flutter-community/custom-scroll-physics-in-flutter-3224dd9e9b41