9
This commit is contained in:
13
lib/13/02_/main.dart
Normal file
13
lib/13/02_/main.dart
Normal file
@@ -0,0 +1,13 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
import 'pages/app/app.dart';
|
||||
|
||||
|
||||
|
||||
void main() {
|
||||
runApp(const App());
|
||||
}
|
||||
|
||||
|
||||
|
||||
|
||||
83
lib/13/02_/menus.dart
Normal file
83
lib/13/02_/menus.dart
Normal file
@@ -0,0 +1,83 @@
|
||||
import 'package:toly_menu/toly_menu.dart';
|
||||
|
||||
List<MenuData> menus = [
|
||||
MenuData(path: '/dashboard', label: '总览面板', children: [
|
||||
MenuData(path: '/dashboard/data_analyse', label: '数据分析', deep: 1),
|
||||
MenuData(path: '/dashboard/work_board', label: '工作台', deep: 1, children: [
|
||||
MenuData(path: '/dashboard/work_board/a', label: '第一工作区', deep: 2),
|
||||
MenuData(path: '/dashboard/work_board/b', label: '第二工作区', deep: 2),
|
||||
MenuData(path: '/dashboard/work_board/c', label: '第三工作区', deep: 2),
|
||||
]),
|
||||
]),
|
||||
MenuData(path: '/cases', label: '案例演示', children: [
|
||||
MenuData(path: '/cases/counter', label: '计数器项目', deep: 1),
|
||||
MenuData(path: '/cases/guess', label: '猜数字项目', deep: 1),
|
||||
MenuData(path: '/cases/muyu', label: '电子木鱼项目', deep: 1),
|
||||
MenuData(path: '/cases/canvas', label: '白板绘制项目', deep: 1),
|
||||
MenuData(path: '/cases/timer', label: '计时器项目', deep: 1),
|
||||
]),
|
||||
MenuData(path: '/manager', label: '系统管理', children: [
|
||||
MenuData(path: '/manager/account', label: '账号管理', deep: 1),
|
||||
MenuData(path: '/manager/role', label: '角色管理', deep: 1),
|
||||
MenuData(path: '/manager/menu', label: '菜单管理', deep: 1),
|
||||
]),
|
||||
MenuData(path: '/knowledge', label: '知识库管理', children: [
|
||||
MenuData(path: '/knowledge/a', label: '语文知识', deep: 1, children: [
|
||||
MenuData(
|
||||
path: '/knowledge/a/1',
|
||||
label: '诗词歌赋',
|
||||
deep: 2,
|
||||
),
|
||||
MenuData(
|
||||
path: '/knowledge/a/2',
|
||||
label: '人物故事',
|
||||
deep: 2,
|
||||
),
|
||||
MenuData(
|
||||
path: '/knowledge/a/3',
|
||||
label: '名著推荐',
|
||||
deep: 2,
|
||||
)
|
||||
]),
|
||||
MenuData(
|
||||
path: '/knowledge/b',
|
||||
label: '数学知识',
|
||||
children: [
|
||||
MenuData(
|
||||
path: '/knowledge/b/1',
|
||||
label: '人物故事',
|
||||
deep: 2,
|
||||
),
|
||||
MenuData(
|
||||
path: '/knowledge/b/2',
|
||||
label: '数学定理',
|
||||
deep: 2,
|
||||
),
|
||||
MenuData(
|
||||
path: '/knowledge/b/3',
|
||||
label: '几何知识',
|
||||
deep: 2,
|
||||
),
|
||||
MenuData(
|
||||
path: '/knowledge/b/4',
|
||||
label: '代数知识',
|
||||
deep: 2,
|
||||
)
|
||||
],
|
||||
deep: 1),
|
||||
MenuData(
|
||||
path: '/knowledge/c',
|
||||
label: '英语知识',
|
||||
deep: 1,
|
||||
),
|
||||
]),
|
||||
MenuData(path: '/widgets', label: '组件集录', children: [
|
||||
MenuData(path: '/widgets/stateless', label: '无状态组件', deep: 1),
|
||||
MenuData(path: '/widgets/stateful', label: '有状态组件', deep: 1),
|
||||
MenuData(path: '/widgets/single_child', label: '单子渲染组件', deep: 1),
|
||||
MenuData(path: '/widgets/mutli_child', label: '多子渲染组件', deep: 1),
|
||||
MenuData(path: '/widgets/sliver', label: '滑片组件', deep: 1),
|
||||
MenuData(path: '/widgets/proxy', label: '代理组件', deep: 1),
|
||||
MenuData(path: '/widgets/other', label: '其他组件', deep: 1),
|
||||
])
|
||||
];
|
||||
107
lib/13/02_/pages/app/app.dart
Normal file
107
lib/13/02_/pages/app/app.dart
Normal file
@@ -0,0 +1,107 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:toly_menu/toly_menu.dart';
|
||||
|
||||
import '../../menus.dart';
|
||||
import '../../transition/fade_transition.dart';
|
||||
import 'root_content.dart';
|
||||
|
||||
class App extends StatelessWidget {
|
||||
const App({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return MaterialApp(
|
||||
theme: ThemeData(
|
||||
pageTransitionsTheme: PageTransitionsTheme(
|
||||
builders: {
|
||||
TargetPlatform.android: FadeUpwardsPageTransitionsBuilder(),
|
||||
TargetPlatform.iOS: CupertinoPageTransitionsBuilder(),
|
||||
TargetPlatform.macOS: FadeUpwardsPageTransitionsBuilder(),
|
||||
TargetPlatform.windows: FadeTransitionsBuilder(),
|
||||
}
|
||||
),
|
||||
|
||||
appBarTheme: const AppBarTheme(
|
||||
elevation: 0,
|
||||
iconTheme: IconThemeData(color: Colors.black),
|
||||
backgroundColor: Colors.white,
|
||||
titleTextStyle: TextStyle(
|
||||
color: Colors.black,
|
||||
fontSize: 18,
|
||||
fontWeight: FontWeight.bold,
|
||||
))),
|
||||
debugShowCheckedModeBanner: false,
|
||||
home: AppLayout());
|
||||
}
|
||||
}
|
||||
|
||||
class AppLayout extends StatelessWidget {
|
||||
const AppLayout({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(
|
||||
body: Row(
|
||||
children: [
|
||||
SizedBox(
|
||||
width: 210,
|
||||
child: MenuPanel(),
|
||||
),
|
||||
// Container()
|
||||
Expanded(child: RootContent())
|
||||
],
|
||||
),
|
||||
// appBar: AppToolBar(),
|
||||
// body: AppNavigation(),
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
class MenuPanel extends StatefulWidget {
|
||||
const MenuPanel({super.key});
|
||||
|
||||
@override
|
||||
State<MenuPanel> createState() => _MenuPanelState();
|
||||
}
|
||||
|
||||
class _MenuPanelState extends State<MenuPanel> {
|
||||
MenuState state = MenuState(expandMenus: ['/dashboard'], activeMenu: '/dashboard/data_analyse', items: menus);
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return TolyMenu(state: state, onSelect: _onSelect);
|
||||
}
|
||||
|
||||
void _onSelect(MenuData menu) {
|
||||
|
||||
|
||||
if(menu.isLeaf){
|
||||
state = state.copyWith(activeMenu: menu.path);
|
||||
print("menu.path:${menu.path}");
|
||||
goRouter.go(menu.path);
|
||||
}else{
|
||||
List<String> menus = [];
|
||||
String path = menu.path.substring(1);
|
||||
List<String> parts = path.split('/');
|
||||
|
||||
if(parts.isNotEmpty){
|
||||
String path = '';
|
||||
for (String part in parts) {
|
||||
path+='/$part';
|
||||
menus.add(path);
|
||||
}
|
||||
}
|
||||
|
||||
if(state.expandMenus.contains(menu.path)){
|
||||
menus.remove(menu.path);
|
||||
}
|
||||
|
||||
state = state.copyWith(expandMenus: menus);
|
||||
|
||||
}
|
||||
setState(() {
|
||||
|
||||
});
|
||||
}
|
||||
}
|
||||
140
lib/13/02_/pages/app/root_content.dart
Normal file
140
lib/13/02_/pages/app/root_content.dart
Normal file
@@ -0,0 +1,140 @@
|
||||
import 'package:flutter/material.dart';
|
||||
import 'package:go_router/go_router.dart';
|
||||
import 'package:iroute/cases/cases.dart';
|
||||
|
||||
import '../color_page.dart';
|
||||
|
||||
// GoRouter configuration
|
||||
final goRouter = GoRouter(
|
||||
initialLocation: '/manager',
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: '/dashboard',
|
||||
builder: (_,__)=>SizedBox(),
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: 'data_analyse',
|
||||
// builder: (context, state) => ColorPage(title: 'data_analyse',),
|
||||
pageBuilder: (context, state) {
|
||||
return CustomTransitionPage(
|
||||
key: state.pageKey,
|
||||
child: ColorPage(title: 'data_analyse',),
|
||||
transitionsBuilder: (context, animation, secondaryAnimation, child) {
|
||||
// Change the opacity of the screen using a Curve based on the the animation's
|
||||
// value
|
||||
return FadeTransition(
|
||||
opacity:
|
||||
CurveTween(curve: Curves.easeInOutCirc).animate(animation),
|
||||
child: child,
|
||||
);
|
||||
},
|
||||
);
|
||||
},
|
||||
),
|
||||
|
||||
GoRoute(
|
||||
path: 'work_board',
|
||||
builder: (_,__)=>SizedBox(),
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: 'a',
|
||||
builder: (context, state) => ColorPage(title: '第一工作区',),
|
||||
),
|
||||
GoRoute(
|
||||
path: 'b',
|
||||
builder: (context, state) => ColorPage(title: '第二工作区',),
|
||||
),
|
||||
GoRoute(
|
||||
path: 'c',
|
||||
builder: (context, state) => ColorPage(title: '第三工作区',),
|
||||
),
|
||||
]
|
||||
),
|
||||
|
||||
]
|
||||
),
|
||||
|
||||
GoRoute(
|
||||
path: '/cases',
|
||||
builder: (_,__)=>SizedBox(),
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: 'counter',
|
||||
builder: (context, state) => CounterPage(),
|
||||
),
|
||||
GoRoute(
|
||||
path: 'guess',
|
||||
builder: (context, state) => GuessPage(),
|
||||
),
|
||||
GoRoute(
|
||||
path: 'muyu',
|
||||
builder: (context, state) => ColorPage(title: '第三工作区',),
|
||||
), GoRoute(
|
||||
path: 'canvas',
|
||||
builder: (context, state) => Paper(),
|
||||
), GoRoute(
|
||||
path: 'muyu',
|
||||
builder: (context, state) => ColorPage(title: '第三工作区',),
|
||||
),
|
||||
]
|
||||
),
|
||||
GoRoute(
|
||||
path: '/manager', builder: (_,__)=>SizedBox(),
|
||||
routes: [
|
||||
GoRoute(
|
||||
path: 'account',
|
||||
builder: (context, state) => ColorPage(title: 'account',),
|
||||
),
|
||||
GoRoute(
|
||||
path: 'role',
|
||||
builder: (context, state) => ColorPage(title: 'role',),
|
||||
),
|
||||
]
|
||||
),
|
||||
],
|
||||
);
|
||||
|
||||
|
||||
class RootContent extends StatelessWidget {
|
||||
const RootContent({super.key});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
|
||||
|
||||
return Router.withConfig(config: goRouter);
|
||||
}
|
||||
}
|
||||
|
||||
class RootContentDelegate extends RouterDelegate with ChangeNotifier,PopNavigatorRouterDelegateMixin{
|
||||
|
||||
|
||||
@override
|
||||
final GlobalKey<NavigatorState> navigatorKey = GlobalKey<NavigatorState>();
|
||||
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Navigator(
|
||||
key: navigatorKey,
|
||||
pages: [
|
||||
|
||||
],
|
||||
onPopPage: (route, result) {
|
||||
// appState.selectedBook = null;
|
||||
// notifyListeners();
|
||||
return route.didPop(result);
|
||||
},
|
||||
);
|
||||
}
|
||||
|
||||
|
||||
@override
|
||||
Future<void> setNewRoutePath(configuration) {
|
||||
// TODO: implement setNewRoutePath
|
||||
throw UnimplementedError();
|
||||
}
|
||||
|
||||
|
||||
|
||||
}
|
||||
11
lib/13/02_/pages/color_page.dart
Normal file
11
lib/13/02_/pages/color_page.dart
Normal file
@@ -0,0 +1,11 @@
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
class ColorPage extends StatelessWidget {
|
||||
final String title;
|
||||
const ColorPage({super.key, required this.title});
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
return Scaffold(body: Center(child: Text(title)));
|
||||
}
|
||||
}
|
||||
58
lib/13/02_/transition/fade_transition.dart
Normal file
58
lib/13/02_/transition/fade_transition.dart
Normal file
@@ -0,0 +1,58 @@
|
||||
|
||||
|
||||
|
||||
|
||||
import 'package:flutter/material.dart';
|
||||
|
||||
|
||||
class FadeTransitionsBuilder extends PageTransitionsBuilder {
|
||||
/// Constructs a page transition animation that slides the page up.
|
||||
const FadeTransitionsBuilder();
|
||||
|
||||
@override
|
||||
Widget buildTransitions<T>(
|
||||
PageRoute<T>? route,
|
||||
BuildContext? context,
|
||||
Animation<double> animation,
|
||||
Animation<double>? secondaryAnimation,
|
||||
Widget child,
|
||||
) {
|
||||
return _FadeUpwardsPageTransition(routeAnimation: animation, child: child);
|
||||
}
|
||||
}
|
||||
|
||||
class _FadeUpwardsPageTransition extends StatelessWidget {
|
||||
_FadeUpwardsPageTransition({
|
||||
required Animation<double> routeAnimation, // The route's linear 0.0 - 1.0 animation.
|
||||
required this.child,
|
||||
}) : _positionAnimation = routeAnimation.drive(_bottomUpTween.chain(_fastOutSlowInTween)),
|
||||
_opacityAnimation = routeAnimation.drive(_easeInTween);
|
||||
|
||||
// Fractional offset from 1/4 screen below the top to fully on screen.
|
||||
static final Tween<Offset> _bottomUpTween = Tween<Offset>(
|
||||
begin: const Offset(0.25,0),
|
||||
end: Offset.zero,
|
||||
);
|
||||
static final Animatable<double> _fastOutSlowInTween = CurveTween(curve: Curves.fastOutSlowIn);
|
||||
static final Animatable<double> _easeInTween = CurveTween(curve: Curves.easeIn);
|
||||
|
||||
final Animation<Offset> _positionAnimation;
|
||||
final Animation<double> _opacityAnimation;
|
||||
final Widget child;
|
||||
|
||||
@override
|
||||
Widget build(BuildContext context) {
|
||||
// return FadeTransition(
|
||||
// opacity: _opacityAnimation,
|
||||
// child: child,
|
||||
// );
|
||||
|
||||
return SlideTransition(
|
||||
position: _positionAnimation,
|
||||
child: FadeTransition(
|
||||
opacity: _opacityAnimation,
|
||||
child: child,
|
||||
),
|
||||
);
|
||||
}
|
||||
}
|
||||
Reference in New Issue
Block a user