在 Flutter 中创建双向 PageView 滚动？答案

【问题标题】：Creating bidirectional PageView scrolling in Flutter?在 Flutter 中创建双向 PageView 滚动？
【发布时间】：2018-12-18 15:50:57
【问题描述】：

您将如何在 Flutter 中实现双向页面滚动功能？给定 Scaffold 中的多个 PageViews 似乎不起作用，嵌套的 PageViews 也不起作用。我的感觉是 NestedScrollView 可能会提供一个解决方案，但我正在努力找出实现。

【问题讨论】：

试试这个包pub.dartlang.org/packages/bidirectional_scroll_view或查看它的源代码。
@RolandoUrquiza 那个包对我来说看起来相当弱，即 unidiomatic。
youtube.com/watch?v=sWkysCKh2uY Flutter Challenge: Card Flip Carousel，作者 Fluttery 于 2018 年 5 月 31 日发布。 github.com/matthew-carroll/flutter_ui_challenge_flip_carousel Matthew 有一些非常棒的东西。查看他的 github 存储库。您可以轻松分析他的代码以了解发生了什么。

标签： widget scrollview flutter

【解决方案1】：

多方向页面浏览：

您可能会为此创建某种诡计，即将页面数量设置为 2000，然后将初始页面设置为 1000。因此创建一个具有 1000 +/- 左右滚动的 PageView？

小部件：

@override
  Widget build(BuildContext context) {

    Future<void>.delayed(Duration.zero, () => _diaryBloc.buildComplete());

    return Container(
      height: MediaQuery.of(context).size.height,
      child: PageView.builder(
        controller: _diaryBloc.pageController,
        itemBuilder: (BuildContext context, int position) {
          return _buildPage(_diaryBloc.getDateFromPosition(position));
        },
        itemCount: 2000,
      ),
    );
  }

BLoC 或其他控制器

  final PageController pageController = PageController();
  final int initialPage = 1000;

  Future<void> buildComplete() async {
    pageController.jumpToPage(initialPage);
  }

  DateTime getDateFromPosition(int position) {
    if (position < 0) {
      return currentDateTime.subtract(Duration(days: position - initialPage));
    } else {
      return currentDateTime.add(Duration(days: position - initialPage));
    }
  }

可能不是最理想的，但非常简单，似乎效果很好。

【讨论】：