flutter_router_forzzh

Description:

flutter router forzzh

让widget具有生命周期 #
###前言：
在Flutter开发中很多时候需要你的页面像安卓中的Activity/Fragment具备生命周期的特性做懒加载来提升部分性能和体验，然而在
flutter中StatelessWidget、StatefulWidget中并不具备检测页面是否运行在前台、后台、和销毁。尽管StatefulWidget中
有销毁时的 dispose() 回调，但对于检查前后台，和StatelessWidget做页面时将变得力不从心....
此工具库可快速让StatelessWidget、StatefulWidget具备Android中Activity/Fragment的 onResume、onPause、onDestroy的生命周期。
此库已将原来页面跳转工具和生命周期功能独立拆开，不再耦合。可分别使用。
pubspec.yaml 依赖 #
dependencies:
flutter_router_forzzh: ^0.0.5
copied to clipboard
导包 import 'package:flutter_router_forzzh/router_lib.dart';
功能1： #
1.路由功能实现界面跳转。
顶层定义router方便全局使用。
RouterProxy router = RouterProxy.getInstance(
routePathCallBack: (routeInformation) {
///自定义的动态路由 跳转
if (routeInformation.location == 'TaoBaoPageDetail1') {
return TaoBaoPageDetail();
}
},
pageMap: {
'/': const Login(),
'TaoBaoPageDetail': TaoBaoPageDetail(),
},
exitStyleCallBack: (context){
return _confirmExit(context);
}
);
copied to clipboard
2.MaterialApp.router 注册RouterProxy
void main() {
runApp(MyApp());
}

class MyApp extends StatelessWidget {
MyApp({Key? key}) : super(key: key)
@override
Widget build(BuildContext context) {
return MaterialApp.router(
title: 'router_lifecycle',
debugShowCheckedModeBanner: false,
routerDelegate: router, //绑定路由跳转工具
routeInformationParser: router.defaultParser(),//路由解析器,可自定义传入
);
}
}


1 页面的跳转使用 router.push(); router.pushNamed()等

2 页面的关闭使用 router.pop();
copied to clipboard
功能2： #
2.对需要监听生命周期的页面做任务。
#####2.1 StatefulWidget页面：
#####2.2 StatelessWidget页面：
class Login extends StatelessWidget {
const Login({Key? key}) : super(key: key);
@override
Widget build(BuildContext context) {
return LifeCycle(
onCreate: (){
print("--------Login onCreate");
},
onStart: (){
print("--------Login onStart");
},
onResume: (){
print("--------Login onResume");
},
onPause: (){
print("--------Login onPause");
},
onDestroy: (){
print("--------Login onDestroy");
},
child: Scaffold(
body: Stack(
children: [
Container(
constraints: const BoxConstraints.expand(),
padding: const EdgeInsets.symmetric(horizontal: 16),
child: Column(
mainAxisSize: MainAxisSize.min,
mainAxisAlignment: MainAxisAlignment.center,
children: [

Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: [
const SizedBox(
width: 16,
),
ElevatedButton(
style: ElevatedButton.styleFrom(
primary: Theme.of(context).primaryColor,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(4.0),
),
side: BorderSide(
color: Theme.of(context).primaryColor),
),
onPressed: () {},
child: const Text(
'注册',
style: TextStyle(color: Colors.white),
),
),
const SizedBox(
width: 16,
),
ElevatedButton(
style: ElevatedButton.styleFrom(
primary: Colors.white,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(4.0),
),
side: const BorderSide(color: Colors.black),
),
onPressed: () {
router.push(page: NavPage());
},
child: const Text('登录', style: TextStyle(color: Colors.black),),
),
const SizedBox(
width: 16,
),
],
),
],
),
),
],
)
));
}}
copied to clipboard
其他：
1.exitStyleCallBack可自定义推出程序提示框
2.web端需要支持浏览器直接跳转访问某页面需要自定义routeInformationParser并继承 RouteParser类做解析器
效果如下：