Flutter PageView 如何在滑动时制作更快的动画

标签 flutter

我有一个简单的页面 View :

PageView(
  controller: _pageController,
  physics: PlatformScrollPhysics.getPlatformScrollPhysics(),
  children: [
    Text("I am Text1"),
    Text("I am Text"),
  ],
  onPageChanged: (index) {
    print("page changed $index");
  },
);
我想做的是我想让用户更快地完成滑动后的页面更改动画。当用户滑动手指并抬起手指时,就会发生这种情况,PageView 会对齐到下一页。这种捕捉目前需要很多时间,提供糟糕的用户体验。但是,没有设置捕捉动画速度和持续时间的选项。
我试图添加一个监听器:
_pageController.addListener(() {
      _pageController.position // this variable holds lots of information but yet I couldnt find what i looked for
      print("LISTENERRR ${_pageController.position}");
    }); 
可悲的是,我找不到任何可以帮助我的东西。我试图超越滑动并通过调用进行自定义滑动
  _pageController.animateToPage(0, .. PARAMS);
为此,我需要检测页面何时即将更改,以便我可以用 animateToPage 覆盖动画。方法。我可以检测页面何时在 PageView 中更改吗?我对 onPageChanged 不感兴趣回调,因为覆盖动画为时已晚。

最佳答案

cs guy的答案是正确的。也归功于 pskink .PageView 小部件的过渡速度不是基于动画曲线,即使编程方法是。
当与滑动一起使用时,PageView 实际上使用 Spring Simulation 来处理页面转换 ,因此必须覆盖“物理”属性以更改“动画速度”。
这是通过使用自定义滚动物理类来提高“动画速度”的简单方法。

import 'package:flutter/cupertino.dart';
import 'package:flutter/physics.dart';

class CustomPageViewScrollPhysics extends ScrollPhysics {
  const CustomPageViewScrollPhysics({ScrollPhysics parent})
      : super(parent: parent);

  @override
  CustomPageViewScrollPhysics applyTo(ScrollPhysics ancestor) {
    return CustomPageViewScrollPhysics(parent: buildParent(ancestor));
  }

  @override
  SpringDescription get spring => const SpringDescription(
        mass: 80,
        stiffness: 100,
        damping: 1,
      );
}
它可以在 PageView 构造函数中使用,如下所示:
PageView(... physics: const CustomPageViewScrollPhysics(),)
并随意调整任何 Spring 参数!

关于Flutter PageView 如何在滑动时制作更快的动画,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65325496/

相关文章:

android - 在 Flutter ListView 中加载更多选项

flutter - 在Flutter,Dart中找到确切的单词

flutter - 如何更改 DropdownButton 的图标颜色? flutter

dart - 类型 '_BuiltList<Data>' 不是类型 'List<Data>' 的子类型

flutter - 如何使用 pubspec.yaml Assets 系列中指定的字体列表中的特定字体

flutter - 文本字段 flutter 的默认值?

flutter - 如何让屏幕在 flutter 中滚动?

dart - 如何检查字符串是否包含阿拉伯字符dart flutter

api - Flutter 队列 API 请求稍后执行

api - 使用zoom oauth2和flutter_web_auth的无效重定向错误