使用 PageView 时的 FadeTransition

我试图做一些应该很简单的事情，但事实证明这非常困难！

当用户滚动到 flutter web 上的下一页时，我试图进行淡入淡出过渡。

我尝试使用在 stackoverflow 上找到的许多代码，但没有任何效果！

我最后尝试的是以下代码。它给了我一个白色的空白屏幕。当我使用..repeat(reverse: false) in _animationController，屏幕不断闪烁。

这是我的最终代码（空白屏幕）：

import 'package:flutter/material.dart';
import 'package:flutter/rendering.dart';


class TestLayout extends StatefulWidget {
  const TestLayout({Key? key}) : super(key: key);

  @override
  _TestLayoutState createState() => _TestLayoutState();
}

class _TestLayoutState extends State<TestLayout> with TickerProviderStateMixin {

  int _index = 0;
  late PageController pageController = PageController();

  late final AnimationController _animationController = AnimationController(
    duration: const Duration(seconds: 2),
    vsync: this,
  );

  late final Animation<double> _fadeInFadeOut = Tween<double>(begin: 0.0, end: 1.0).animate(_animationController);

  final List<String> _sectionsName = [
    "Home",
    // "heeeey",
    "Services"
  ];

  @override
  void dispose() {
    _animationController.dispose();
    super.dispose();
  }


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      extendBodyBehindAppBar: true,
      appBar: MediaQuery.of(context).size.width > 760
      ? null
      : AppBar(
        elevation: 0.0,
        backgroundColor: Colors.transparent
      ),
      body: Stack(
        children: [
          NotificationListener(
            onNotification: (notification) {
              if(notification is UserScrollNotification){
                if (notification.direction == ScrollDirection.forward) {
                  print('down');
                  setState(() {
                    _animationController.forward();
                    pageController.nextPage(
                      curve: Curves.easeIn, duration: const Duration(milliseconds: 500)
                    );
                  });
                }
                if (notification.direction == ScrollDirection.idle) {
                  print('Idle');
                }

                if (notification.direction == ScrollDirection.reverse) {
                  print('up');
                  setState(() {
                    _animationController.forward();
                    pageController.previousPage(
                      curve: Curves.easeIn, duration: const Duration(milliseconds: 500)
                    );
                  });
                }
              }
              return false;
            },
            child: PageView(
              controller: pageController,
              scrollDirection: Axis.vertical,
              physics: const NeverScrollableScrollPhysics(),
              children: [
                FadeTransition(
                  opacity: _fadeInFadeOut,
                  child: Container(
                    color: Colors.red,
                    child: const Center(child: Text("Hi"))
                  )
                ),
                // Opacity(
                //   opacity: opacityHelper - (panPosition / screenHeight),
                //   child: Container(
                //     color: Colors.green,
                //     child: Center(child: Text("There"))
                //   )
                // ),
                FadeTransition(
                  opacity: _fadeInFadeOut,
                  child: Container(
                    color: Colors.yellow,
                    child: Center(child: Text("Welcome"))
                  )
                )
              ],
              onPageChanged: (index) {
                _index = index;
              }
            )
          )
        ]
      )
    );
  }
}

感谢任何帮助...提前致谢...