Flutter PageView.builder可以加载更多内容并进行刷新

时间:2020-11-03 12:27:57

标签: flutter flutter-layout flutter-dependencies

我正在一个项目上,我正在使用基本上垂直滚动的PageView.builder。我正在使用PageView.builder加载视频列表,用户可以在其中查看视频(一次一个视频),我想添加加载更多功能。目前,我一次从服务器获取10个视频并将其加载到PageView.builder中,当用户到达最后一个视频(即第10个视频)时,我想从服务器加载更多10个视频。此外,如果是第一个视频,我想通过下拉列表来刷新列表。下面是我正在使用的代码。有谁知道如何实现期望的 功能?预先感谢。

Stack createListView(BuildContext context, AsyncSnapshot snapshot)
  {

    videoDataList =snapshot.data;

    _videoListController.init(
      _pageController,
      videoDataList,
    );
    tkController.addListener(
          () {
        if (tkController.value == TikTokPagePositon.middle) {
          _videoListController.currentPlayer.start();
        } else {
          _videoListController.currentPlayer.pause();
        }
      },
    );

    return Stack(
      // index: currentPage == null ? 0 : 1,
      children: <Widget>[
        RefreshIndicator(
          child: PageView.builder(
            key: Key('home'),
            controller: _pageController,
            pageSnapping: true,
            physics: ClampingScrollPhysics(),
            scrollDirection: Axis.vertical,
            itemCount: _videoListController.videoCount,
            itemBuilder: (context, i) {
              // Put together a video component
              var data = videoDataList[i];
              bool isF = SafeMap(favoriteMap)[i].boolean ?? false;
              var player = _videoListController.playerOfIndex(i);

              //Right button bar
              Widget buttons = TikTokButtonColumn(
                profilePic: Glob.ITEM_BASE_URL+data.user_profile,
                isFavorite: isF,
                videoModel: data,
                onAvatar: () {
                  tkController.animateToPage(TikTokPagePositon.right);
                },
                onFavorite: () {
                  setState(() {
                    favoriteMap[i] = !isF;
                  });
                  // showAboutDialog(context: context);
                },
                onComment: () {
                  _getCommentData(data.post_id);

                },
                onShare: () {},
              );
              // video
              Widget currentVideo = Center(
                child: FijkView(
                  player: player,
                  color: Colors.black,
                  panelBuilder: (_, __, ___, ____, _____) => Container(),
                ),
              );

              currentVideo = TikTokVideoPage(
                hidePauseIcon: player.state != FijkState.paused,
                aspectRatio: 9 / 16.0,
                key: Key(Glob.ITEM_BASE_URL+data.post_video + '$i'),
                tag: Glob.ITEM_BASE_URL+data.post_video,
                bottomPadding: hasBottomPadding ? 16.0 : 16.0,
                userInfoWidget: VideoUserInfo(
                  viewers: data.post_view_count,
                  desc: data.post_description,
                  userName: data.user_name,
                  fullname: data.full_name,
                  bottomPadding: hasBottomPadding ? 16.0 : 50.0,
                  // onGoodGift: () => showDialog(
                  //   context: context,
                  //   builder: (_) => FreeGiftDialog(),
                  // ),
                ),
                onSingleTap: () async {
                  if (player.state == FijkState.started) {
                    await player.pause();
                  } else {
                    await player.start();
                  }
                  setState(() {});
                },
                onAddFavorite: () {
                  setState(() {
                    favoriteMap[i] = true;
                  });
                },
                rightButtonColumn: buttons,
                video: currentVideo,
              );
              return currentVideo;
            },
          ),
          onRefresh: _getData,
        ),
        Opacity(
          opacity: 1,
          child: currentPage ?? Container(),
        ),
        // Center(
        //   child: Text(_currentIndex.toString()),
        // )
      ],
    );
  }

0 个答案:

没有答案