Flutter PageView как сделать более быструю анимацию при смахивании

Dec 16 2020

У меня простой PageView:

PageView(
  controller: _pageController,
  physics: PlatformScrollPhysics.getPlatformScrollPhysics(),
  children: [
    Text("I am Text1"),
    Text("I am Text"),
  ],
  onPageChanged: (index) {
    print("page changed $index");
  },
);

Что я хотел бы сделать, так это сделать так, чтобы анимация смены страницы после того, как смахивание было выполнено пользователем, стала быстрее. Это происходит, когда пользователь проводит пальцем и отрывает палец, PageView переходит на следующую страницу. Эта привязка в настоящее время занимает много времени и обеспечивает плохой UX. Однако нет возможности установить скорость и продолжительность анимации привязки.

Я попытался добавить слушателя:

_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Обратный вызов меня не интересует, так как уже поздно перезаписывать анимацию.

Ответы

6 JMooreLabs Dec 17 2020 at 04:55

Ответ парня из CS верен . Также следует отдать должное pskink . Скорость перехода виджета PageView не основана на кривой анимации, хотя программный подход таков.

PageView на самом деле использует Spring Simulation для обработки переходов страниц при использовании смахивания , поэтому свойство «физика» должно быть переопределено, чтобы изменить «скорость анимации».

Вот простой способ увеличить «скорость анимации» с помощью специального класса Scroll Physics.

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(),)

И смело настраивайте любой из параметров пружины!