时间戳

首页 > 解决方案 > Flutter：pageview.builder 跳转到目标页面位置

flutter - Flutter：pageview.builder 跳转到目标页面位置

问题描述

综合浏览量有 1000 个项目，需要时间才能全部刷完。如何跳转到当前页面的+10页面？我试过“final PageController _controller = PageController(initialPage: 0);” 但不知道怎么用

class Home extends StatefulWidget {
  Home({ Key? key, required this.title,}) : super(key: key);
  final String title;

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

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('stackoverflow'),
      ),
      body: PageView.builder(
        itemBuilder: (context, position) {
          return Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Text(
                'Page' + position.toString(),
              ),
              ElevatedButton(
                  onPressed: () {
                    print('jump to +10 pages');
                  },
                  child: Text('Jump >> + 10'))
            ],
          );
        },
        itemCount: 1000,
      ),
    );
  }
}

标签： flutteruser-interface

解决方案

让我们利用类的animateToPage()方法PageController：

_pageController.animateToPage(
  _pageController.page + 10,
  duration: const Duration(milliseconds: 400),
  curve: Curves.easeInOut,
);

完整的片段如下：

class Home extends StatefulWidget {
  Home({ Key? key, required this.title,}) : super(key: key);
  final String title;

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

class _HomeState extends State<Home> {

  final PageController _pageController = PageController();

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


  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('stackoverflow'),
      ),
      body: PageView.builder(
        controller: _pageController,
        itemBuilder: (context, position) {
          return Column(
            mainAxisAlignment: MainAxisAlignment.center,
            crossAxisAlignment: CrossAxisAlignment.center,
            children: <Widget>[
              Text(
                'Page' + position.toString(),
              ),
              ElevatedButton(
                  onPressed: () {
                    print('jump to +10 pages');
                    if (_pageController.hasClients)
                      _pageController.animateToPage(
                        _pageController.page + 10,
                        duration: const Duration(milliseconds: 400),
                        curve: Curves.easeInOut,
                      );
                  },
                  child: Text('Jump >> + 10'))
            ],
          );
        },
        itemCount: 1000,
      ),
    );
  }
}

推荐阅读