PageView.builder的使用技巧

PageView.builder()可以创建一个可以逐页工作的可滚动列表，并使用按需创建的小部件。当你的页面中使用了PageView.builder()时，你可以使用PageController来控制页面的滚动。并且会自动移除不在屏幕区域的组件。
所以，与传统的PageView相比，PageView.builder能够按需创建页面小部件，从而在性能和内存方面更加高效。

使用方法

使用PageView.builder的关键是提供一个itemBuilder函数，该函数将根据给定的索引创建小部件。下面是使用PageView.builder的一些技巧：

1. 定义页面数量：通过传递itemCount参数，可以定义页面的总数量。

PageView.builder(
  itemCount: 3,
  itemBuilder: (context, index) {
    // 返回用于当前索引的小部件
  },
)

2. 根据索引创建小部件：在itemBuilder函数中，根据给定的索引创建小部件。

PageView.builder(
  itemCount: 3,
  itemBuilder: (context, index) {
    return Container(
      child: Text('Page $index'),
    );
  },
)

3. 动态创建页面内容：itemBuilder函数可以根据索引动态创建页面的内容。可以基于提供的索引来生成不同的小部件。

PageView.builder(
  itemCount: 3,
  itemBuilder: (context, index) {
    if (index == 0) {
      return Container(
        child: Text('First Page'),
      );
    } else if (index == 1) {
      return Container(
        child: Text('Second Page'),
      );
    } else {
      return Container(
        child: Text('Third Page'),
      );
    }
  },
)

4. 无限轮播：通过将itemCount设置为一个较大的值，可以实现无限轮播的效果。

PageView.builder(
  itemCount: 10000,
  itemBuilder: (context, index) {
    // 根据索引计算实际的页面内容
    int pageIndex = index % 3;
    if (pageIndex == 0) {
      return Container(
        child: Text('First Page'),
      );
    } else if (pageIndex == 1) {
      return Container(
        child: Text('Second Page'),
      );
    } else {
      return Container(
        child: Text('Third Page'),
      );
    }
  },
)

灵活地利用PageView.builder创建逐页滚动的视图，并且可以动态生成页面的内容。这样可以在滚动大量页面时提升性能和内存效率。

TabBarView的替代

综上所述，TabBarView实际是一个PageView，但是Flutter并没使用PageView.builder，而是使用了PageView，所以TabBarView的替代方案就是PageView.builder。

return NotificationListener<ScrollNotification>(
      onNotification: _handleScrollNotification,
      child: PageView(
        dragStartBehavior: widget.dragStartBehavior,
        clipBehavior: widget.clipBehavior,
        controller: _pageController,
        physics: widget.physics == null
          ? const PageScrollPhysics().applyTo(const ClampingScrollPhysics())
          : const PageScrollPhysics().applyTo(widget.physics),
        children: _childrenWithKey,
      ),

在versions/3.19.5/packages/flutter/lib/src/material/tabs.dart中，TabView被这样书写。所以你可以拷贝一个tabs.dart并将组件更名ExtendedTabBarView，然后将代码修改为下面的示例，在实际的应用中使用这个TabView便大大降低渲染压力。但是，你需要在Tabview的项目中使用AutomaticKeepAliveClientMixin来防止切换时，状态丢失。

return NotificationListener<ScrollNotification>(
      onNotification: _handleScrollNotification,
      child: PageView.builder(
          dragStartBehavior: widget.dragStartBehavior,
          controller: _pageController,
          physics: widget.physics == null
              ? const PageScrollPhysics().applyTo(const ClampingScrollPhysics())
              : const PageScrollPhysics().applyTo(widget.physics),
          itemCount: _childrenWithKey.length,
          itemBuilder: (BuildContext context, int index) {
            return _childrenWithKey[index];
          }),
    );