Flutter 仿iOS侧滑返回案例实现
前言
各位同学大家好，有一段时间没有给大家更新文章了。最近玩了一些iOS原生的应用，觉得iOS原生的侧滑返回上一级目录很好用。我就想着做一个flutter的版本出来 今天就给大家分享 (Flutter 仿iOS侧滑返回案例实现) 案例，废话不多说，我们正式开始
准备工作
需要安装flutter的开发环境：大家可以去看看之前的教程：
1 win系统flutter开发环境安装教程: https://www.jianshu.com/p/152447bc8718
2 mac系统flutter开发环境安装教程：https://www.jianshu.com/p/bad2c35b41e3
效果图：
侧滑返回.gif
具体实现：
我们需要到导入
import 'package:flutter/cupertino.dart';
这边我们要实现侧滑返回我们要用到 CupertinoPageScaffold 这个脚手架框架组件
@override
Widget build(BuildContext context) {
// TODO: implement build
return CupertinoPageScaffold(
child: Center(
child: CupertinoButton(
child: Text("跳转详情页",style: TextStyle(
fontSize: 20,color: Colors.white
),),
color: CupertinoColors.destructiveRed,
onPressed: (){
Navigator.of(context).push(CupertinoPageRoute(builder: (BuildContext context){
return Details();
}));
},
),
),
);
}
这边我们在Widget build 方法里面直接返回一个 CupertinoPageScaffold 组件 然后在 CupertinoPageScaffold 组件中嵌套一个Center 让我们演示的button居中显示 这边点击的button我们也要用
Cupertino相关的 CupertinoButton ，然后就是具体路由跳转部分逻辑 我们看onPressed 方法体的逻辑
Navigator.of(context).push(CupertinoPageRoute(builder: (BuildContext context){
return Details();
}));
我们在 Navigator.of(context).push() 方法中传入的 是CupertinoPageRoute 而不是通常用到的 MaterialPageRoute ，来实现我们的路由跳转 通过CupertinoPageRoute 路由跳转我们就可以实现在我们跳转到新的widget 可以用过侧滑手势返回上一级。
最后总结：
flutter中提供了 cupertino iOS风格 和material 原生安卓风格（材料设计） 所以我们引入flutter sdk中提供的
cupertino.dart 里面提供了很多iOS风格的组件和效果 ，这样我们就很快实现仿iOS侧滑返回的效果，
有兴趣的同学可以多尝试，最后希望我的文章能帮助到各位解决问题 ，以后我还会贡献更多有用的代码分享给大家。各位同学如果觉得文章还不错 ，麻烦给关注和star，小弟在这里谢过啦
