Flutter PageView可正常滚动但无法通过回调跳转至指定页面

哦，这个小坑我之前也踩过！你遇到的问题根源在于对PageController的方法参数理解有误——你用了animateTo()，但传错了参数类型。

问题分析 #

PageController.animateTo()方法需要的是目标页面的像素偏移量，而不是直接传页面索引的数值。你现在传入的index.toDouble()，比如当index是1时，仅代表1像素的偏移，这在屏幕上几乎看不到变化，所以看起来控制器没工作。而手动滚动PageView时，系统会自动计算每个页面的宽度偏移，所以能正常切换。

两种修复方案 #

方案1：正确计算偏移量（适配animateTo）

你需要先获取屏幕宽度，然后用索引乘以宽度得到正确的偏移值：

_toPage(int index) {
  print('topage: $index');
  // 通过build方法传入的rootContext获取屏幕宽度
  final screenWidth = MediaQuery.of(rootContext).size.width;
  _pageController.animateTo(
    index * screenWidth, // 正确的页面偏移量
    curve: Curves.easeInOut,
    duration: kThemeAnimationDuration,
  );
}

方案2：用更便捷的animateToPage方法（推荐）

PageController专门提供了animateToPage()和jumpToPage()方法，直接接收页面索引作为参数，内部会自动帮你计算偏移量，不用手动处理屏幕宽度：

_toPage(int index) {
  print('topage: $index');
  _pageController.animateToPage(
    index, // 直接传页面索引即可
    curve: Curves.easeInOut,
    duration: kThemeAnimationDuration,
  );
}

总结 #

你之前的错误属于很常见的“方法参数混淆”，换成animateToPage是最省心的解决方式，以后也不容易再犯类似错误。

内容的提问来源于stack exchange，提问作者Chris