Flutter类书籍应用实现Chrome式横向侧滑切换页面的方案咨询

目前有几款成熟的第三方包可以直接适配你的需求，不需要从零开发：

• cupertino_back_gesture：原生适配iOS侧滑返回逻辑的封装库，支持自定义滑动触发区域宽度、滑动阻尼参数，稍加调整即可支持左右双向边缘侧滑切换页面，接入成本很低
• page_turn：专门针对书籍类翻页场景开发的功能包，内置边缘触发滑动的开关配置，可将默认的翻页动画调整为和Chrome侧滑接近的平移动画效果
• swipeable_page_route：基于路由层封装的侧滑切换库，不需要修改现有页面的结构，只需要替换路由实现即可支持双向侧滑切换，滑动过程的动画参数高度可定制

如果现有包不能完全匹配你的定制化需求，可以按照以下思路实现：

• 首先处理手势拦截：使用GestureDetector或者Listener监听水平触摸事件，仅响应屏幕左右边缘15~20dp范围内的按下事件，避免和页面内其他横向滑动组件冲突
• 实现滑动跟随动画：拖动过程中根据实时偏移量，同步控制当前页面和待切换页面的水平位移、透明度、边缘阴影效果，还原Chrome侧滑的交互反馈
• 完善滑动结束判定：根据滑动结束时的总偏移量和瞬时速度判断是否触发页面切换，通常偏移量超过屏幕宽度1/3或者滑动速度超过1000像素/秒即可判定为切换成功，否则执行回弹动画回到原状态
• 适配路由逻辑：如果是基于Flutter原生路由体系做页面切换，建议封装自定义的PageRoute来承载侧滑动画逻辑，避免和系统默认的路由切换动画冲突

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